函数体内的this对象,就是定义时所在的对象,而不是使用时所在的对象. 箭头函数本身没有this,this继承上级的this. 定时器中箭头函数的this指向包含定时器的函数,所以定时器中的箭头函数要使用外层this的时候,不用借that传递了,正常使用即可 // 为避免频繁点击触发事件,点击之后禁用点击事件,1.5秒后解除 $('#refresh').click(function () { $(this).css('pointer-events', 'none') //定时器的this指向wi

ES6 箭头函数 this 指向 箭头函数有几个使用注意点: 函数体内的this对象,就是定义时所在的对象,而不是使用时所在的对象. 不可以当作构造函数,也就是说,不可以使用new命令,否则会抛出一个错误. 不可以使用arguments对象,该对象在函数体内不存在.如果要用,可以用 Rest 参数代替. 不可以使用yield命令,因此箭头函数不能用作 Generator 函数. 上面四点中,第一点尤其值得注意.this对象的指向是可变的,但是在箭头函数中,它是固定的. function foo(

箭头函数有几个使用注意点. (1)函数体内的this对象,就是定义时所在的对象,而不是使用时所在的对象. (2)不可以当作构造函数,也就是说,不可以使用new命令,否则会抛出一个错误. (3)不可以使用arguments对象,该对象在函数体内不存在.如果要用,可以用Rest参数代替. (4)不可以使用yield命令,因此箭头函数不能用作Generator函数. 上面四点中,第一点尤其值得注意.this对象的指向是可变的,但是在箭头函数中,它是固定的. function foo() { setTi

箭头函数(Arrow functions),是ECMAScript2015中新加的特性,它的产生,主要有以下两个原因:一是使得函数表达式(匿名函数)有更简洁的语法,二是它拥有词法作用域的this值,也就是说它跟父作用域共享this,不会新产生自己作用域下的this, arguments, super 和 new.target 等对象. 使用箭头函数特性 在JavaScript代码中,函数无处不在.假设页面上有一个特定的按钮,它的id是‘clickMe’,点击它后,页面弹出“Hello,Arrow

关于函数表达式中的this:自动引用正在调用当前方法的.前的对象1.obj.fun()中的this fun中的this -> obj2.new Fun() Fun中的this -> 正在创建的新对象3.fun()和匿名函数自调 this -> window4.类型.prototype.fun() fun中的this -> 将来调用fun的.前的子对象,子对象一定是当前类型5.如果this不是想要的对象 fun.call(替换this的对象),相当于对象.fun()ex:键盘事件 /

this指向本质 箭头函数this指向的固定化,并不是因为箭头函数内部有绑定this的机制,实际原因是箭头函数根本没有自己的this,导致内部的this就是外层代码块的this.正是因为它没有this,所以也就不能用作构造函数. 箭头函数转成 ES5 的代码如下: // ES6 function foo() { setTimeout(() => { console.log('id:', this.id); }, 100); } // ES5 function foo() { var _this

箭头函数与普通函数的区别 1.语法上更加简洁.清晰 基本语法: // 关于箭头函数的参数 // 如果箭头函数没有参数,直接写一个括号即可 let fun1 = () => { console.log('111') }; // 如果箭头函数只有一个参数,可以省略括号 let fun2 = name => { console.log('Hello ' + name); }; // 如果箭头函数有多个参数,用逗号隔开,写括号里面 let fun3 = (a, b, c) => { consol

var name = "window"; var person1 = { name: "person1", show1: function() { console.log(this.name); }, show2: () => console.log(this.name), show3: function() { return function() { console.log(this.name); } }, show4: function() { retur

1.回调函数中,用箭头函数改变this的作用域 success: (res)=>{ this.setData({ //此时,this指向page页面 ... }) } 2.自定义事件中,如果使用箭头函数,则箭头函数中的this指向undefined,不指向page onLike: (event)=>{ likeModel.like(this.data.classic.id) //报错,this指向undefined }, 需要修改成传统函数形式 onLike: function(event){

箭头函数的语法 function fn1() { console.log(1); } let fn2 = () => { console.log(2); } fn1()//1 fn2()//2 //箭头函数: 形参=>返回值 //单个形参的最简写法,箭头函数作为匿名的回调函数是可以省略let fn ,既(形参)=>{语句} let fn = nub => nub * 2 console.log(fn(10));//20 //多个形参,语句单一.(形参1,形参2)=>返回值 l

ES6允许使用“箭头”(=>)定义函数 var f = a = > a //等同于 var f = function(a){ return a; } 如果箭头函数不需要参数或需要多个参数,就使用一个圆括号代表参数部分. //无形参 var f = () => 2; // 等同于 var f = function () { return 2 }; //多个形参 var sum = (a, b) => a + b; // 等同于 var sum = function(a, b) { r

1. 箭头函数 函数的简写方式 () => {} 只有一个参数时,可以省略() ---- x => {} 只有一条语句时,可以省略{},此时这点语句的结果会作为函数的返回值返回  () => console.log('hello'); 特点: 箭头函数没有自己的 this,与离他最近的一层包裹它的函数的 this 一致,如果没有函数就指向 window 箭头函数没有 prototype 属性,有 __proto__ 属性 箭头函数不能 new 调用 箭头函数不能强制修改 this 指向

es5中 this 的指向 var factory = function(){ this.a = 'a'; this.b = 'b'; this.c = { a:'a+', b:function(){return this.a} } }; console.log(new factory().c.b()); // a+ 通过es5的语法调用,返回的是 a+ ,this 的指向是该函数被调用的对象,也就是说函数被调用的时候,这个 this 指向的是谁,哪个对象调用的这个函数,这个 this 就是谁.

今天注意到前端小伙伴用react 定义component class的方法的时候是通过箭头函数的方式,表示好奇. class Test extends React.Component { public fun1 = () => { console.log(this); }; fun2() { console.log(this); } } 如上代码中fun1的定义方式.于是感到好奇,fun1中的this是什么. 如果我们套用箭头函数的概念,我们可能认为,这中间的this是否会指向环境变量globa

1.普通函数中的this总是指向调用它的那个对象, 箭头函数没有自己的this,他的this永远指向其定义环境,任何方法都改变不了其指向,如call().bind().apply().(正是因为它没有this,所以也就不能用作构造函数,也没有原型对象) 2.箭头函数不能当作构造函数,也就是说,不能使用new命令,否则会报错. 3.箭头函数不能使用yield命令,因此箭头函数不能用作genertor函数. 4.箭头函数没有原型属性. 5.箭头函数不能使用argumen对象,该对象在函数体内不存在.

普通函数中的this: 1. this总是代表它的直接调用者(js的this是执行上下文), 例如 obj.func ,那么func中的this就是obj 2.在默认情况(非严格模式下,未使用 'use strict'),没找到直接调用者,则this指的是 window (约定俗成) 3.在严格模式下,没有直接调用者的函数中的this是 undefined 4.使用call,apply,bind(ES5新增)绑定的,this指的是 绑定的对象 箭头函数中的this 箭头函数没有自己的this,

转载自:https://juejin.im/post/5aa1eb056fb9a028b77a66fd#heading-1 JavaScript在ES6语法中新增了箭头函数,相较于传统函数,箭头函数不仅更加简洁,而且在this方面进行了改进.this作为JavaScript中比较诡异的存在,许多文章对于this的解释也不尽相同,本篇文章试图厘清JS中函数与this的关系. 一.JS中函数的写法 1.常规函数的写法 在ES6语法之前,JS中的函数由function关键字.params参数和被花括号

x => x * x 上面的箭头函数相当于: function (x) { return x * x; } 箭头函数相当于匿名函数,并且简化了函数定义. 箭头函数有两种格式,一种像上面的,只包含一个表达式,连{ ... }和return都省略掉了. 还有一种可以包含多条语句,这时候就不能省略{ ... }和return: x => { if (x > 0) { return x * x; } else { return - x * x; } } 如果参数不是一个,就需要用括号()括起来:

ES6标准新增了一种新的函数:Arrow Function(箭头函数). 主要的几种写法如下: 组成: 参数 => 语句, 参数不是1个: (参数,参数2)=>语句 语句不止一条: 参数 =>{语句1;语句2;return 返回值} 返回的对象格式: 参数=>({对象}) 通常函数的定义方法 var fn1 = function(a, b) { return a + b } function fn2(a, b) { return a + b } 使用ES6箭头函数语法定义函数,将原

1.定义 箭头函数相当于匿名函数,并且简化了函数定义.箭头函数有两种格式,一种像上面的,只包含一个表达式,连{ ... }和return都省略掉了.还有一种可以包含多条语句,这时候就不能省略{ ... }和return: x => { if (x > 0) { return x * x; } else { return - x * x; } } 箭头=>前面是形参,箭头后面是函数体,函数匿名 如果参数不是一个,就需要用括号()括起来: // 两个参数: (x, y) => x *

我们知道普通函数调用,this在非严格模式下指向全局对象,在严格模式下是undefined.那箭头函数呢?我们知道,箭头函数没有自己的this,它的this是最近外层非箭头函数的this,那直接在顶层用的箭头函数的this在严格模式下是什么呢?不太好解释,我们看下代码 <body> <script type="text/javascript"> 'use strict' // x = 3 var a = { name1: 'gg', say: () =>