zoukankan      html  css  js  c++  java
  • js中的this关键字,setTimeout(),setInterval()的执行过程

    var test1 = {
    name: 'windseek1',
    showname: function () {
    console.log(this.name);
    }
    }
    var test2 = {
    
    name:'windseek2',
    showname: test1.showname
    }
    test2.showname()
    

    运算结果是windseek2,由于test2.showname=test1.showname所以test2.showname()=test1.showname();

    test2.showname=

    function () {

    console.log(this.name);

    }

    test2.showname();对象时test2,所以this也指向test2 name自然也是test2.name windseek2

    上面的代码也相当于这样写:

    var test1 = {
    name: 'windseek1',
    showname: function () {
    console.log(this.name);
    }
    }
    var test2 = {
    
    name:'windseek2',
    showname: function () {
    console.log(this.name);
    }
    }
    test2.showname()
    

    运算结果是一样的

    var test1 = {
    name: 'windseek1',
    showname: function () {
    console.log(this.name);
    }
    }
    var test2 = {
    
    name:'windseek2',
    showname: function () {
    test1.showname();
    }
    }
    test2.showname()
    

    这时的运算结果应该是windseek1,由于test2.showname()执行其实是找到,test1.showname()执行,对象时test1,this指向test1,结果也就是test1.name也就是windseek1

    var name="windseek";
    var test1 = {
    name: 'windseek1',
    showname: function () {
    console.log(this.name);
    }
    }
    var test2 = {
    
    name:'windseek2',
    showname: function () {
    var test=test1.showname;
    test();
    }
    }
    test2.showname();
    

    结果是windseek,因为test2.showname()执行时会找到test()执行,test=function () {console.log(this.name);},test前面没有任何对象,作用域就是全局的,this就是全局变量,this.name也就是windseek

    上述代码可以解释成以下代码

    var name="windseek";
    var test1 = {
    name: 'windseek1',
    showname: function () {
    console.log(this.name);
    }
    }
    var test2 = {
    
    name:'windseek2',
    showname: function () {
    var test=function () {
    console.log(this.name);
    };
    test();
    }
    }
    ( function () {
    var test=function () {
    console.log(this.name);
    };
    test();
    })();
    

    写到这,感觉写代码像是在做数学题了,越来越有意思了

    var name='windseek';
    var test1 = {
    name: 'windseek1',
    showname: function () {
    console.log(this.name);
    }
    }
    var test2 = {
    
    name:'windseek2',
    showname: function () {
    setTimeout(test1.showname,1000);
    }
    }
    test2.showname();
    

    结果就是windseek其实,setTimeout等价于这种函数function(__callback){ __callback();} 最后执行的是callback

    等价于这样写

    var name='windseek';
    var test1 = {
    name: 'windseek1',
    showname: function () {
    console.log(this.name);
    }
    }
    var test2 = {
    
    name:'windseek2',
    showname: function () {
    (function(__callback){
        __callback();
    })(test1.showname);
    }
    }
    test2.showname();
    

    结果一样也是windseek,但是这个不会延迟,settimeout会延迟,setInterval也是一样的原理

    学而不思则罔,思而不结则殆,结而不看,一事无成
  • 相关阅读:
    2.5亿!华为成立新公司!
    两年半换第 4 份工作,做个总结
    不懂什么叫编程?
    Google 为什么把几十亿行代码放在一个库?
    IntelliJ 平台 2020 年路线图
    别找了,这是 Pandas 最详细教程了
    MongoDB是什么?看完你就知道了!
    有了这个神器,轻松用 Python 写 APP !
    整理出来几个比较实用的代码对比工具
    学习进度条 第六十一-七十五天 SpringMVC学习笔记
  • 原文地址:https://www.cnblogs.com/windseek/p/5972466.html
Copyright © 2011-2022 走看看