zoukankan      html  css  js  c++  java
  • ES6和ES5中的this指向问题

    不多逼逼 直接上代码:

    var name = "window";
    var obj = {
        name: 'obj',
        //普通函数
        one: function(){
        	console.log(this.name)
        },
        //箭头函数
        two: ()=> {
    	    console.log(this.name)
        },
        //普通函数中的箭头函数
        three: function(){
        	(()=>{
        		console.log(this.name)
       		})()
        }, 
        //多层箭头函数
        four: ()=> {
        	(()=>{
        		console.log(this.name)
       		})()
        }
    }
    obj.one();    //obj  
    obj.two();	  //window 
    obj.three();  //obj
    obj.four()    //window
    

    说明:

    1、

    普通函数中的this总是指向它的直接调用者;

    箭头函数中的this是在定义函数的时候绑定,而不是在执行函数的时候绑定。

    2、

    ①比如上面的 obj.one();直接调用者是obj,因此this指向obj

    ②箭头函数中的this指向是固定的,并不是因为箭头函数内部有绑定this的机制,实际原因是箭头函数内部没有this,箭头函数的this是在定义时就绑定的,它的this就是箭头函数所处的对象的所处作用域

    比如obj.three();箭头函数所在的对象是函数three,函数three处于obj的作用域中,因此this指向obj;

    比如obj.four();箭头函数所在的对象是obj,obj处于window的作用域中因此this指向window。

    3、

    es6函数写法有2种,一种是 fn: (str) => { } ; 一种是 fn(str){ }

    箭头函数是没有上下文的、this会直接指向上一级

    第二种写法this指向调用它的调用者

    2019-01-30补充

    //1内部this对象指向创建期上下文对象
    // 普通函数的this指向是在函数的执行期间绑定的
    //比如
    function fn6(){
        console.log(this)
    }
    fn6() // 自调用的时候,指向window
    var obj  = {};
    obj.f = fn6;
    obj.f(); // 指向他的直接调用者obj
    
    document.onclick = fn6; // 指向触发该事件的对象 document
    
    
  • 相关阅读:
    python导入数据的几种方法
    sql 如何删除(代替)字段内某一部分内容
    SQL Server如何将查询的内容保存到新的sql 表中
    sqlserver 计算同比,环比增长
    SQLlite实现增删查改
    如何实现基于框架的选课系统的质量属性
    实验1.2:框架选择及其原因
    期末考试复习c#时总结的抽象类与接口的一些区别
    <<梦断代码>>读书笔记
    结对开发首尾相接数组求子数组最大和
  • 原文地址:https://www.cnblogs.com/wenqiangit/p/9962394.html
Copyright © 2011-2022 走看看