国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

徹底搞清JS中的this,construtor,prototype

NoraXie / 1306人閱讀

摘要:再看和是一個對象的屬性,這個屬性存在在此對象的中指向此對象的構造函數。在中指向構造函數例子此種方式定義的是隱藏的默認指向例子為什么是這種定義是把重寫了覆蓋了默認的。

this定義

this是對象

this依賴函數執行的上下文

this存在于函數中(函數調用的時候被隱式傳入)

直接看例子:

    alert(this); //在全局環境調用this, this指向window,  輸出[Object window]
   
     function Person(){
         alert(this);
    } 

     方式一:  
      Person(); // 全局環境用Person函數, this指向window,  輸出[Object window]

     方式二: 
     var obj = new Person(); //把Person當做構造函數, 實例化一個對象
                             //此時this指向了obj, 不再指向window,  輸出[Object object]
     
     function Person(){
        alert(this.name); //此時無法判斷this的身份
     }
     
     Person(); //this在全局環境中被調用, this.name == window.name, 輸出了窗口的名字
     var obj = new Person(); //this在obj環境下被調用, this.name == obj.name, 由于name沒被賦值, 所以輸出undefined
     
     
     由此可以看出, 我們在閱讀代碼或者寫代碼時,看到某個函數中定義的this時, 還無法去判斷那個this身份,必須找到它依賴執行的環境(對象)。
     再回頭看看this的定義,大家就清楚自然了。
再看constructor和prototype

constructor是一個對象的屬性,這個屬性存在在此對象的prototype中, 指向此對象的構造函數。分析這句話

constructor是一個對象屬性。

constructor在prototype中

constructor指向構造函數

例子1:

    function Person(name, age){
        this.name = name;
        this.age = age;
    }
    Person.prototype.getName = function(){
        alert(this.name);
    }
    Person.prototype.getAge = function(){
        alert(this.age);
    }
    var obj = new Person();
    alert(obj.constructor == Person);// true
    此種方式定義的prototype, constructor是隱藏的, 默認指向Person
    
例子2:
    function Person(name, age){
        this.name = name;
        this.age = age;
    }
    Person.prototype = {
        getName: function(){
           alert(this.name);
        },
        getAge: function(){
           alert(this.age);
        }
    }
    var obj = new Person();
    alert(obj.constructor == Person);// false
    
    為什么是false? 這種定義prototype, 是把prototype重寫了, 覆蓋了默認的constructor。
    換句話說, 其實這種方式就是給屬性重新賦值了, 所以導致默認的constructor被覆蓋。
    此時的obj.constructor將指向的是Object。
    
    改寫一下上面的:
    Person.prototype = {
        constructor: Person, //強制指向Person
        getName: function(){
           alert(this.name);
        },
        getAge: function(){
           alert(this.age);
        }
    }
    此時constructor就指向Person了。
    
    prototype是一個函數屬性, 此屬性同時也是一個對象, 保存著對象實例所共有的屬性和方法。
    
    分析這句話:
        1.prototype是函數屬性, 只要是函數, 就有prototype屬性. 而不管是構造函數還是普通函數.
        2.prototype同時也是對象.
        2.prototype放的是公共的東西, 包括屬性和方法.
        
    例子1.
        function Person(name, age){
            this.name = name;
            this.age = age;
        }
        
        //是函數就有prototype屬性, 這個屬性也是一個對象
        Person.prototype = {
            getName: function(){ //所有對象實例都共享
                return this.name;
            },
            getAge: function(){//所有對象實例都共享
                return this.age;
            }
        }
    
        var obj = new Person("tom", 23);
        obj.getName(); //"tom"
        var obj2 = new Person("jack", 23);
        obj2.getName(); //"jack"
        obj.getName == obj2.getName; //true, 所有實例共享
        Person.prototype.getName(); //當做普通函數屬性, 根據this定義, 此時this指向的是Person.prototype, 所以返回undefined
  
  以上就是this, constructor, prototype的定義和他們之間的關系. 可能還有些粗糙, 歡迎大家補充.
  
  綜合例子:
    
    var Tinker = function(){
        this.elements = [];
    
    };
        Tinker.fn = Tinker.prototype = {
            constructor: Tinker,
            extend: function(obj){
                var p;
                for(p in obj){
                    this.constructor.prototype[p] = obj[p];//此處若看明白了, 那么前面的就理解了
                }
            }
        
        }
        Tinker.fn.extend({
           get: function(){
                var length = arguments.length,
                i = 0;
               for(; i < length; i++){
                   this.elements.push(document.getElementById(arguments[i])); //此處若看明白了, 那么前面的就理解了
               }
               return this;//此處若看明白了, 那么前面的就理解了
           },
           each: function(fn){
                var i = 0,
                    length = this.elements.length;
                for(; i < length; i++){
                    fn.call(this.elements[i], i, this.elements[i]);
                }
                return this;//此處若看明白了, 那么前面的就理解了
           }
            
        });
    
   這個例子其實很簡單, 就是向一個對象原型添加方法.一個方法是get, 用于查找頁面id. 一個是each, 用于對找到的id元素執行一個方法

   //假設有id = "data", id = "message"
   var obj = new Tinker();
   obj.get("data", "message").each(function(i, item){
    this.style.cssText = "height:20px; background:#ff0000";
  })

轉自http://www.cnblogs.com/tinkbe...

文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。

轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/82049.html

相關文章

  • JS高級程序設計》讀書筆記----JS創建對象的七種模式

    摘要:用對象字面量形式創建的對象,直接賦值給函數的原型對象,本質上完全重寫了其對象,因此屬性也就變成了新對象的屬性指向構造函數,不再指向函數。 【上一篇】:JavaScript對象內部屬性及其特性總結 showImg(https://segmentfault.com/img/bVbjYsc?w=839&h=489); 工廠模式(★★) 先在內部顯示地創建一個臨時對象,根據接收的參數來構建(賦...

    Dogee 評論0 收藏0
  • 徹底搞懂JavaScript中的繼承

    摘要:這正是我們想要的太棒了毫不意外的,這種繼承的方式被稱為構造函數繼承,在中是一種關鍵的實現的繼承方法,相信你已經很好的掌握了。 你應該知道,JavaScript是一門基于原型鏈的語言,而我們今天的主題 -- 繼承就和原型鏈這一概念息息相關。甚至可以說,所謂的原型鏈就是一條繼承鏈。有些困惑了嗎?接著看下去吧。 一、構造函數,原型屬性與實例對象 要搞清楚如何在JavaScript中實現繼承,...

    _ivan 評論0 收藏0
  • js的方法實現一個new

    摘要:運算符創建一個用戶定義的對象類型的實例或具有構造函數的內置對象的實例。新建對象鏈接對象設置指向原來指向執行一次構造函數返回對象當代碼執行時,會發生以下事情一個繼承自的新對象被創建。使用指定的參數調用構造函數,并將綁定到新創建的對象。 new 運算符創建一個用戶定義的對象類型的實例或具有構造函數的內置對象的實例。new 關鍵字會進行如下的操作: 1.創建一個空的簡單JavaScript對...

    lemanli 評論0 收藏0
  • 再談JavaScript面向對象思想及繼承

    摘要:面向對象中有三大特征,封裝,繼承,多態。這不僅無法做到數據共享,也是極大的資源浪費,那么引入對象實例對象的屬性指向其構造函數,這樣看起來實例對象好像繼承了對象一樣。實例對象的原型指向其構造函數的對象構造器的指向。 前言 為什么說是再談呢,網上講解這個的博客的很多,我開始學習也是看過,敲過就沒了,自以為理解了就結束了,書到用時方恨少啊。實際開發中一用就打磕巴,于是在重新學習了之后分享出來...

    svtter 評論0 收藏0
  • class 與 原型鏈 解析

    摘要:一相當于拿實例對象的名字來給原型命名。不專業點說的實例函數為匿名函數,而中,構造函數即原型鏈展示的原型為匿名函數。關系圖不通過創造,不通過各種情況擾亂的情況下分析為原型屬性,展示構造函數,比如上面舉例的某同學的媽媽構造函數。 這篇文章只是我個人的見解,因為也是今年剛畢業,所以理解不一定非常的準確,如果理解有誤希望大家告訴我。 一、class 相當于 拿實例對象的名字 來給 原型 命名。...

    novo 評論0 收藏0

發表評論

0條評論

NoraXie

|高級講師

TA的文章

閱讀更多
最新活動
閱讀需要支付1元查看
<