冬天可以种爬山虎吗?

小说:冬天可以种爬山虎吗?作者:帝石更新时间:2019-05-21字数:99653

林风点头,“这一点有过考虑,可惜对方在暗,我们在明,如果只是单纯冲着林风而来,何必大费周折,跑到秦王府杀人,在京城动手反而更方便。”

天津玫瑰基地规模大吗?

如此强大的力量催动的那波浪足足达到了数丈之高,狠狠的砸向了叶扬。
本来税警总团的这些残部要被改编为其他部队的,但由于宋先生在委员长面前力争,才总算保留了这个番号,虽然编制统统缩小了一两级,但好歹保住了番号,只要还有种子在,税警总团还是有希望东山再起的。

“是不错的,只不过这个东西不能长期使用,不然的话身体会垮掉的,就算有仙豆也是如此,要让身体有一个过渡缓和期才可以。”

今天给大家分享一个JavaScript OOP中关于分辨this指向对象的小技巧,很实用呦!

我们先来看一段代码:

大家能判断出func();和obj.func();这两句的this指向吗?

首先,我们都知道的是,this的指向就是最终调用函数的对象。可是最终调用函数的对象,你能清楚地判断出来吗?

但是,有几点需要注意:

  ① this 指向谁,不应该考虑函数在哪声明,而应该考虑函数在哪调用!

  ② this 指向的永远只可能对象,而不可能是函数。

  ③ this 指向的对象 ,叫做函数的上下文context,也叫函数的调用者。 

 什么是上下文context ?    

  经常看到很多资料文档都有提到上下文,但是都不是太好理解。相信很多人犯迷糊。现在尝试把自己的理解写出来,也算是梳理一下。

  上下文 —— 我把它理解为当前运行环境,程序运行时,程序的每条语句都有对应的上下文,即运行环境。

  可以想象一下语句执行前:有个上下文对象,名称是 context,上下文对象是window对象,即: context = window。

  直接调用函数func(),此时函数体内的上下文对象就是window。

  对象obj调用func函数,即:obj.func()  时,函数体内的上下文对象就是window.obj对象。

  this的值,就是运行到this代码位置时,上下文所对应的上下文对象。函数定义是并没有运行console.log(this)语句,所以函数定义是this指向的对象还未定义,它的值是undefined,需要在函数调用时,边解释边执行,执行 console.log(this) 时才分析调用函数是的上下文。最终确定this指向的值。

下面我们来看一下更多的情况,总结一下更多的规律,让大家面对this不再糊涂:

【 接下来,我们详细解读一下 】

① 通过 函数名() 调用的,this永远指向window。就是上述例子的第一个调用 func();

结果(window)

 

② 通过 对象.方法 调用的,this指向这个对象。就是上述例子的第二种调用方式 obj.func();

 

 结果(obj)

 

③ 函数 作为数组中的一个元素存在,用数组下标调用,this指向这个数组。

 结果(数组arr)

 

④ 函数作为 window 内置函数的回调函数使用,this指向window 。

结果(window)

 

⑤ 函数作为构造函数,使用new关键字调用,this指向新new出的对象。

 

结果(objs)

【区分】在HTML中新增一个div,给div添加点击事件。

<div id="div1" style="width: 200px;height: 200px;background-color: red;" onclick="func(this)">
     这是一个div
</div>

<script type="text/javascript">
        window.onclick = function(){
                 document.getElementById("div1").onclick = function(){  
                 func();   //  最终还是使用()调用,指向Window
            }                            
                 document.getElementById("div1").onclick = func;   // 广义对象  通过对象.方法 调用的,this指向这个对象                
            }          
    function func(){
        console.log(this);
    }
</script>                    

 

规律咱们总结完了,接下来来两个题目练练手吧!

 first one:

function func(){
    console.log(this);
            }
 var obj1 = {
     name : "obj1",
     arr : [func,1,{name:"obj2",func:func},3,setTimeout(func,1000)],
}           
// 通过对象取到数组,然后通过数组的下标调用该函数,最终指向数组。this -> obj.arr obj1.arr[0]();                    // obj1.arr[0]:目的是取到func,给setTimeout作为回调函数,相当于setTimeout(func,2000)。this -> window setTimeout(obj1.arr[0],2000); obj1.arr[2].func();    // 最终调用者{name:"obj2",func:func} 属于②情况 setTimeout(obj1.arr[2].func,2000);   // 最终调用者是setTimeout,同上

结果如下显示:(调用了三次延时函数,包括一次自动调用)

 

second one:

    var fullname = "John Doe";
        var obj = {
           fullname: "Colin Ihrig",
           prop: {
              fullname: "Aurelio De Rosa",
              getFullname: function() {
                 return this.fullname;
              }
           }
        };
        console.log(obj.prop.getFullname());  // 函数的最终调用者 obj.prop 
        
        var test = obj.prop.getFullname; 
        console.log(test());       // 函数的最终调用者 test()  this-> window
        
        obj.func = obj.prop.getFullname;  // 给obj追加方法
        console.log(obj.func());     // 函数最终调用者是obj
        
        var arr = [obj.prop.getFullname,1,2];
        arr.fullname = "TraceyW";
        console.log(arr[0]());     // 函数最终调用者数组        
            

结果如下显示:

 

总结一下,this指向的规律,大家可以发现,这个规律跟函数的调用方式息息相关:

  ① 通过 函数名() 调用的,this永远指向window。

  ② 通过 对象.方法 调用的,this指向这个对象。

  ③ 函数 作为数组中的一个元素存在,用数组下标调用,this指向这个数组。

  ④ 函数作为 Window 内置函数的回调函数使用,this指向window。  如setInterval 、 setTimeout ...

  ⑤ 函数作为构造函数,使用new关键字调用,this指向新new出的对象。

挺有用的,拿走不谢!

有需要的点关注呦~~小W会经常更新小技巧呢!如有不完善的地方,敬请拍砖!蟹蟹~~

 

编辑:秉扁

发布:2019-05-21 00:00:00

当前文章:http://scycxh.com/news_16420.html

观赏花木红王子锦带什么地方有? 法国冬青四季常绿吗? 欧月小苗哪里有卖的? 【秒懂】解析玫瑰扦插苗与嫁接苗区别 【经验分享】菖蒲种子几月播种最好? 板蓝根种子如何播种才能提高出苗的数量? 哪里有卖蓝花鼠尾草种子的? 细弱剪股颖一般与什么混播?

68945 49417 32261 75814 26498 78747 74454 28122 48634 50048 34317 27998 71025 13714 12453 55888 87432 57940 92849 47150

我要说两句: (0人参与)

发布