js基础之var与let

参考阮一峰老师的教程:http://es6.ruanyifeng.com/#docs/let

一、先附图,此部分为阮老师教程内容。

下图是因为i只有一个,简化理解:最后调用a[i]的时候为输出的consol.log(i)中的指向同一个内存,均为10.

var a = [];
for (var i = 0; i < 10; i++) {
  a[i] = function () {
    console.log(i);
  };
}
a[6](); // 10

而如果使用let,声明的变量仅在块级作用域内有效,最后输出的是6。简化理解:a[i]和console.log(i)一一对应,这里的每个i都不一样。

var a = [];
for (let i = 0; i < 10; i++) {
  a[i] = function () {
    console.log(i);
  };
}
a[6](); // 6

上面代码中,变量i是let声明的,当前的i只在轮循环有效,所以每一次循环的其实都是一个新的变量,所以最后输出的是6。你可能会问,如果每一轮循环的变量i都是重新声明的,那它怎么知道上一轮循环的值,从而计算出本轮循环的值?这是因为 JavaScript 引擎内部会记住上一轮循环的值,初始化本轮的变量i时,就在上一轮循环的基础上进行计算。

二、函数部分

上代码:

var a = 1;
function func(a){
	a = 2;
	return a;
}
func(a);
console.log(a); //a为1;
在给一个做对比:
var a = 1;
function func(a){
	console.log(a);  //a为1
	a = 2;
	return a;
}
var c=func(a);
console.log(a);  //a为1
console.log(c);  //c为2
上面两个代码对比可发现函数内的a和函数外的a是两个a,作用域不同。
再上一个代码:
function func(a){
	a.a = 2;
}
func(a);
console.log(a); //输出为{a:2}
接着上对比代码:
var a = {a:1};
function func(a){
	console.log(a);   //输出{a:1}
	a.a = 2;
	console.log(a);   //输出{a:2}
}
func(a);
console.log(a);     //输出{a:2}
三、for中的var与let补充
for (let i = 0; i < 3; i++) {
  let i = 'abc';
  console.log(i);  //共输出三次‘abc’
}
for (var i = 0; i < 3; i++) {
  let i = 'abc';
  console.log(i);  //共输出三次‘abc’
}
for (let i = 0; i < 3; i++) {
  var i = 'abc';
  console.log(i);  //Uncaught SyntaxError: Identifier 'i' has already been declared
}
for (var i = 0; i < 3; i++) {   //这里只有i=0被执行了
  var i = 'abc';
  console.log(i);  //共输出一次‘abc’
}
以上所有代码都在chrome中调试,如有问题欢迎留言!

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值