1


2


3


4


5


6


7


8


9


10


11


12


13


14


15


16


17


18


19


20


21


22


23


24


25


26


27


28


29


30


31


32


33


34


35


<!DOCTYPE html>  


<html>  


    <head>  


        <meta charset="UTF-8">  


        <title></title>  


    </head>  


    <body>  


        <script>  


      


    var test1=()=>{  


        console.log(this.name,this);  


    }  


    window.name = "obj window";  


    class {  


        constructor(){  


            this.name = "class p";  


        }  


        func(){  


            var test2 = () =>{  


                console.log(this.name,this);  


            };  


            function test3(大专栏  es6this箭头函数 class="params">){  


                console.log(this);  


            }  


            test1();


            test2();//class p  


            test3();//undefined  


        }  


    }  


    var p = new P();  


    p.func();  


      


        </script>  


    </body>  


</html>

js中函数作用域属于静态作用域，就是函数作用域的嵌套关系在函数定义时确定了，废话不多说直接上例子

1


2


3


4


5


6


7


8


9


10


[javascript] view plain copy


var a='out a';  


function test(){  


    console.log(a); // out a  


}  


function outer(){  


    var a="in a";  


    test()  


};  


outer();

ok，接下来就是箭头函数的this，

以下为我的理解，如有不正之处，望指点。

箭头函数不能用于构造函数，在上面的例子中，test1箭头函数定义在最外面，当test1函数打印this对象时会根据定义时决定的作用域嵌套关系逐级向上查找，因此查找的是window对象，在test2箭头函数中，由于test2定义在类P的func函数中，test2箭头函数打印this时，会先去func方法查找，找到了，然后打印。test3中，类中的方法默认开启了严格模式 所以test3中this为undefined。 可以将箭头函数中的this类比为函数中定义的变量，使用时按照定义时决定的作用域逐级查找直到找到为止。

原文地址

es6this箭头函数的更多相关文章

  1. 区别ES3ES5和ES6this的指向问题。区分普通函数和箭头函数中this的指向问题

    ES3 ES5this的指向问题 this指的是该函数被调用的对象 var foo = function () { this.a = 'a', this.b = 'b', this.c = { a: ...

  2. ES6 箭头函数中的 this？你可能想多了（翻译）

    箭头函数=>无疑是ES6中最受关注的一个新特性了,通过它可以简写 function 函数表达式,你也可以在各种提及箭头函数的地方看到这样的观点——“=> 就是一个新的 function”. ...

  3. ES6箭头函数与展开运算符

    箭头函数:省去了关键字function和return: eg: reduce=(a,b)=>a+b;//返回a+b的值 redduce=(a,b)=>{console.log(a);con ...

  4. 箭头函数和Buffer对象

    一.箭头函数 普通函数1 var add = function (a, b) { return a + b; } 普通函数2 function add (a, b) { return a + b; } ...

  5. 深入理解this机制系列第三篇——箭头函数

    × 目录 [1]痛点 [2]解决 [3]基本用法[4]回调函数[5]注意事项 前面的话 this机制与函数调用有关,而作用域则与函数定义有关.有没有什么是可以将this机制和作用域联系起来的呢?本文将 ...

  6. Es6 箭头函数

    1.单参数function cheng(a=3){    return a*a;}let cheng= (a=3)=>a*a;console.log(cheng(9));2.多参数functio ...

  7. 【javascript】箭头函数

    ES6标准新增了一种新的函数:Arraw Function(箭头函数). x => x * x 这个函数相当于 function (x){ return x * x; } 题外话:user st ...

  8. JS中generater和箭头函数

    generater跟函数很像: function* fn(x){ yield x; yield x++; return x;} 如上所示,generater用function*定义,可以用yield返 ...

  9. 箭头函数 Arrow Functions/////////////////////zzz

    箭头符号在JavaScript诞生时就已经存在,当初第一个JavaScript教程曾建议在HTML注释内包裹行内脚本,这样可以避免不支持JS的浏览器误将JS代码显示为文本.你会写这样的代码: < ...

随机推荐

  1. docker 一些简略环境搭建及部分链接

    1.center 7  搭建 docker https://www.cnblogs.com/yufeng218/p/8370670.html 2.docker 命令 https://www.cnblo ...

  2. 关于SG函数

    Sprague-Grundy定理(SG定理): 游戏和的SG函数等于各个游戏SG函数的Nim和.这样就可以将每一个子游戏分而治之,从而简化了问题.而Bouton定理就是Sprague-Grundy定理 ...

  3. SMO算法--SVM(3)

    SMO算法--SVM(3) 利用SMO算法解决这个问题: SMO算法的基本思路: SMO算法是一种启发式的算法(别管启发式这个术语, 感兴趣可了解), 如果所有变量的解都满足最优化的KKT条件, 那么 ...

  4. 给c盘瘦身

    火狐浏览器缓存 C:\Users\lenovo\AppData\Local\Mozilla\Firefox\Profiles\5nk022sw.default\cache2\entries ‪C:\U ...

  5. 洛谷P1525 关押罪犯（并查集、二分图判定）

    本人蒟蒻,只能靠题解AC,看到大佬们的解题思路,%%%%%% https://www.luogu.org/problemnew/show/P1525 题目描述 S城现有两座监狱,一共关押着N名罪犯,编 ...

  6. 74cms_3.5.1 宽字节注入

    第一次进行CMS的代码审计,我选择了2014年发布的74CMS 3.5.1,历史比较久远的CMS往往存在更多的问题,虽然技术上难度不大,但是在思路方面给了我很大的启发.下面我根据我的思路给大家分享一下 ...

  7. 初始化方法，init，构造器

    1.继承于NSObject class student: NSObject { var name : String? var age : Int = var friend : Int = init(n ...

  8. 如何回收VCSA 6自带的vPostgres数据库空间

    最近有学生连续反应由于VCSA磁盘空间满了,导致服务无法正常启动,寻求压缩数据库空间的问题.首先说下,VCSA的数据库是没办法图形界面管理的, 它的内置vPostgres数据库的管理只能通过命令行来完 ...

  9. [LC] 234. Palindrome Linked List

    Given a singly linked list, determine if it is a palindrome. Example 1: Input: 1->2 Output: false ...

  10. 读写分离（AMOEBA）

    博主本人平和谦逊,热爱学习,读者阅读过程中发现错误的地方,请帮忙指出,感激不尽 1. 环境准备: 1.1新增一台虚拟机 amoeba:192.168.247.80 架构(使用图片源自其它博文): 1. ...