温馨提示×

温馨提示×

您好,登录后才能下订单哦!

密码登录×
登录注册×
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》

ECMAScript 学习笔记(2)--ES6新增let、箭头函数理解

发布时间:2020-06-18 16:35:25 来源:网络 阅读:659 作者:daydaydream 栏目:web开发

1、关于let
用来锁定块程序内的变量非常实用:

   var a = [];

for (var i = 0; i < 10; i++) {
a[i] = function () {
console.log(i);
};
}
a[6](); // 输出10
用var i 并没有将i值锁定(var定义的i会变量提升,作为全局变量),数组a中每个成员中的i都是公用一个变量空间,所以最后i为10,a[1]()-----a[10]()输出均为10

   var a = [];

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

用let i 会针对for每次循环的{ }块代码重新定义变量空间,js解释引擎会自动记录上次i值,所以a的每个成员的i值都是不一样的!

2、箭头函数使函数定义变得更简洁:

var f = () => 5;
// 等同于
var f = function () { return 5 };

var sum = (num1, num2) => num1 + num2;
// 等同于
var sum = function(num1, num2) {
return num1 + num2;
};

箭头前一般为传入参与,箭头后一般返回参数,没有传入参数可以用(),如果没有返回参数可以用{}把语句包含。

关于箭头函数有几个使用注意点:

(1)函数体内的this对象,就是定义时所在的对象,而不是使用时所在的对象。如下:

{
var ft=function(){
this.a='a';
this.b='b';
this.c={
a: 'a+';
b: ()=>{
return this.a;
}

                          }

          }

          console.log(new ft().c.b());  //显示 a,不是a+,因为this指向在定义箭头函数时就已经被确定了箭头函数外的this相同

}

比较非箭头函数写法结果:

{
var ft=function(){
this.a='a';
this.b='b';
this.c={
a: 'a+';
b: fuction(){
return this.a;
}

                          }

          }

          console.log(new ft().c.b());  //显示 a+,不是a,此时的 this是在对象被使用的时候定义,即被调用的时候定义,this指向c

}

(2)不可以当作构造函数,也就是说,不可以使用new命令,否则会抛出一个错误。

(3)不可以使用arguments对象,该对象在函数体内不存在。如果要用,可以用 rest 参数代替。

(4)不可以使用yield命令,因此箭头函数不能用作 Generator 函数。
先做个记录,有时间再分析

向AI问一下细节

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

AI