1、箭头函数
ES6 允许使用“箭头”(=>)定义函数。
var cat= function (name) { return "tom";}; var cat = name => "tom";
如果箭头函数不需要参数或需要多个参数,就使用一个圆括号代表参数部分。 var cat = (name) => "tom";
如果箭头函数的代码块部分多于一条语句,就要使用大括号将它们括起来 var cat = (name) => {return "tom"};
箭头函数有几个使用注意点。
(1)函数体内的this对象,就是定义时所在的对象,而不是使用时所在的对象。
(2)不可以当作构造函数,也就是说,不可以使用new命令,否则会抛出一个错误。
(3)不可以使用arguments对象,该对象在函数体内不存在。如果要用,可以用 rest 参数代替。
上面三点中,第一点尤其值得注意。this对象的指向是可变的,但是在箭头函数中,它是固定的。
由于箭头函数使得this从“动态”变成“静态”,下面两个场合不应该使用箭头函数。
第一个场合是定义函数的方法,且该方法内部包括this。
const cat = {
lives: 9,
jumps: () => {
this.lives--;
}
} 指向的是全局的变量
第二个场合是需要动态this的时候,也不应使用箭头函数。
button.addEventListener('click', () => {
this.classList.toggle('on');
}); 指向的是全局的变量
2、双冒号运算符
箭头函数可以绑定this对象,大大减少了显式绑定this对象的写法(call、apply、bind)。
但是,箭头函数并不适用于所有场合,所以现在有一个提案,提出了“函数绑定”(function bind)运算符,用来取代call、apply、bind调用。
函数绑定运算符是并排的两个冒号(::),双冒号左边是一个对象,右边是一个函数。
该运算符会自动将左边的对象,作为上下文环境(即this对象),绑定到右边的函数上面。
run.bind(cat);
cat::run;
// 等同于
cat::run(...arguments);
// 等同于
run.apply(cat, arguments);
如果双冒号左边为空,右边是一个对象的方法,则等于将该方法绑定在该对象上面
let log = ::console.log;
// 等同于
var log = console.log.bind(console);
如果双冒号运算符的运算结果,还是一个对象,就可以采用链式写法。
ES6 浅谈箭头函数,双冒号符号
最新推荐文章于 2024-01-16 13:49:05 发布