let var const三种定义方式及闭包

Mr.wang

javascript

发布于：2019年5月10日

次浏览

介绍js如何定义变量的及闭包的使用

let var const 之间的区别

var

var的作用域是根据函数作用域的， 他在函数内起作用 这里就引用到闭包和作用域链

1
2
3
4
5
6
7
8

function out(){
 	 var a = 000; //=> 这个a的作用域作用在out内 而info函数在out函数内 所以可以调用
	b=222 //=> 报错err 因为b的作用域在info函数内 包裹他的out函数不可以调用它
function info(){
  	var b=999;
	a= 111;
	}
}

var 的变量提升

1
2
3
4
5
6
7
8

function (){
  var a=10; 
}
//变量提升 就是var定义的变量会在先声明再赋值 提升到函数顶部
function(){
  var a;
  a=10;
}

let

let的作用域的块级作用域，不会变量提升 可以理解为在某块范围内作用 与var 的函数作用域不同在于 let的作用域会形成闭包

1
2
3
4
5
6
7
8
9
10
11
12
13

for (var i = 0; i < 3; i++) {
  setTimeout(function () {
    console.log(i);
  }, 1000)
}
//输出 3 3 3

for (let i = 0; i < 3; i++) {
  setTimeout(function () {
    console.log(i);
  }, 1000)
}
//输出 0 1 2

1
2

var会在全局声明 而setTimeout 是一个定时器 也是异步回调  会在同步执行完毕再执行异步 所以当for循环完毕 i=3时调用三次定时器  
let 的作用范围会在for循环内 每循环一次 i会形成一次闭包  i会被setTimeout调用

const

const代表一个值的常量索引，常量的值在垃圾回收前永远不能改变，所以需要谨慎使用。

cosnt定义的值不能被改变 否则会报错

1
2

Uncaught TypeError: Assignment to constant variable.
未捕获的类型错误:赋值给常量变量。

闭包

外部可以访问内部的私有变量

可以返回携带状态的函数，并且状态隐藏 可以做到变量的私有

1
2
3
4
5
6

function f1(){
  var n=999;
  function f2(){
    alert(n); // 999
  }
}

在上面的代码中，函数f2就被包括在函数f1内部，这时f1内部的所有局部变量，对f2都是可见的。但是反过来就不行，f2内部的局部变量，对f1就是不可见的。这就是Javascript语言特有的”链式作用域”结构（chain scope），子对象会一级一级地向上寻找所有父对象的变量。所以，父对象的所有变量，对子对象都是可见的，反之则不成立。

既然f2可以读取f1中的局部变量，那么只要把f2作为返回值，我们不就可以在f1外部读取它的内部变量了吗！

1
2
3
4
5
6
7
8
9

function f1(){
	var n=999;
	function f2(){
	alert(n); 
}
return f2;
}
var result=f1();
result(); // 999

闭包就是能够读取其他函数内部变量的函数

要形成闭包 必须两层function函数作用域

1
2
3
4
5
6
7
8
9
10
11
12

function f1(){
  var n=999;
  Add=function(){n+=1}
  function f2(){
  console.log(n)
}
return f2;
}
var result=f1();
result(); // 999
Add();
result(); // 1000

这里形成闭包后，f1的局部变量n一直保存在内存中，并没有因为f1的重复调用而清除

原因就在于f1是f2的父函数，而f2被赋给了一个全局变量，这导致f2始终在内存中，而f2的存在依赖于f1，因此f1也始终在内存中，不会在调用结束后，被垃圾回收机制（garbage collection）回收。

缺点

由于闭包会使得函数中的变量都被保存在内存中，内存消耗很大，所以不能滥用闭包，否则会造成网页的性能问题，在IE中可能导致内存泄露。解决方法是，在退出函数之前，将不使用的局部变量全部删除。

闭包会在父函数外部，改变父函数内部变量的值。所以，如果你把父函数当作对象（object）使用，把闭包当作它的公用方法（Public Method），把内部变量当作它的私有属性（private value），这时一定要小心，不要随便改变父函数内部变量的值。

1
2
3
4
5
6
7
8
9
10

var name = "The Window";
var object = {
  name: "My Object",
  getNameFunc: function () {
    return function () {
      return this.name;
    };
  }
};
alert(object.getNameFunc()());

经典闭包题

个人理解

object.getNameFunc() 执行到这一步时 调用object内的函数 返回一个function（）{return this.name} 这时候 name还是My Object 当再次执行时object.getNameFunc()() 调用了外部的name 输出为The Window

本页文档最后更新于：2021年4月13日

javascript