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. 4.15 每周作业 —— 简单DP

    免费馅饼 Time Limit : 2000/1000ms (Java/Other)   Memory Limit : 65536/32768K (Java/Other) Total Submissi ...

  2. dynamic用法

    https://www.cnblogs.com/lgx5/p/9650203.html https://www.cnblogs.com/gygtech/p/9915367.html

  3. 功能区按钮调用Excel、PowerPoint、Word中的VBA宏：RunMacro

    功能区按钮调用Excel.PowerPoint.Word中的VBA宏:RunMacro 众所周知,Excel.PPT.Word文档或加载宏文件中可以写很多过程和函数,调试的过程中当然可以按F8或F5直 ...

  4. VMware 三种网络配置解释

    https://blog.csdn.net/noob_f/article/details/51099040 ifconfig -a 网卡名称

  5. python中读取mat文件

    mat数据格式是Matlab的数据存储的标准格式 在python中可以使用scipy.io中的函数loadmat()读取mat文件. import scipy.io as scio path = 'e ...

  6. 吴裕雄--天生自然python学习笔记：python用OpenCV 读取和显示图形

    Open CV 是一个开源.跨平台的计算机视觉库,它可 以在商业和研究领域中免费使用,目前已广泛应用于人机 互动.人脸识别.动作识别.运动跟踪等领域. 要识别特定的图像,最重要的是要有识别对象的特征 ...

  7. leetcode第38题：报数

    这是一道简单题,但是我做了很久,主要难度在读题和理解题上. 思路:给定一个数字,返回这个数字报数数列.我们可以通过从1开始,不断扩展到n的数列.数列的值为前一个数列的count+num,所以我们不断叠 ...

  8. Filter 中注入失败问题

    参考: https://www.cnblogs.com/digdeep/p/4770004.html?tvd https://www.cnblogs.com/EasonJim/p/7666009.ht ...

  9. python--防止SQL注入

    from pymysql import * def main(): # 创建Connextion连接 conn = connect(host='localhost', port=3306, user= ...

  10. 微信小游戏排行榜页滚动查看排行榜（canvas指定区域溢出滚动，懒渲染）

    在微信小游戏中,好友排名数据是能在关系数据域操作,整个关系数据域只会返回一个最终的sharedCanvas,并且这个canvas不能调用toDataURL()方法,所以要展示好友排行榜的话只能在关系数 ...