1. 程式人生 > >js中的對象、原型鏈機制、構造函數

js中的對象、原型鏈機制、構造函數

this arr prototype 函數名 浪費 創建對象 字段名 name pre

一、在js中創建對象的方式

  //一、字面量或直接量創建對象
    var obj1 = {
        name:"zs",
        age:12
    }; 
    //二、通過new來創建對象
    var obj2 = new Object();
    obj2.name = "zs";
    obj2.age = 16;
    //三、通過工廠函數來創建
    function creatObj() {
        return {};
    } 
    //四、通過new 構造函數來創建
    function Obj() {
        
    }  
//測試 var obj = new Obj(); console.log(obj instanceof Obj); console.log(typeof obj); console.dir(obj);
 

二、構造函數與普通函數的區別

  1、構造函數的函數名是需要首字母大寫的,也就是說構造函數的函數名是所有字母的首字母都大寫

  2、構造函數是希望通過new來調用,而普通函數是通過函數名來調用

    在這裏強調一下調用函數的方式:1》函數名調用2》new來調用3》事件調用4》定時器調用5》call調用6》apply調用

  3、構造函數是隱式創建對象,直接將屬性和方法賦值給對象

  4、構造函數中無return,普通函數中一般都有返回值

三、我們在執行new構造函數操作時,到底發生了什麽?

  1、將實際參數傳遞給形式參數

  2、在內存中創建空對象,並讓函數的this指向該空對象

  3、執行構造函數中的代碼

  4、返回這個this指向的對象

四、原型

  1、當你使用console.dir(obj);時,你會發現展開後會出現__proto__的字段名,這就是原型。每一個函數每一個對象都有其對應的原型,但我們只研究構造函數的原型

技術分享圖片

  2、原型的應用

    1》一次性賦值

      

 //一次性賦值
    Student.prototype = {
        
//首先一定要加上這個constructor constructor:Student, study:function (){ alert("好好學習"); }, eat:function(){ alert("吃飯"); } }

    2》擴展對象

    //擴展對象
    var arr = [1,2];
    Array.prototype.getSum = function () {
        var res = 0;
        for(var i=0;i<this.length;i++){
            res += this[i];
        }
        return res;
    }

  註意:第一種方案盡量不要使用,因為js內置的對象是不允許進行賦值次改的

  內置對象:Object Date Number String Array Function RegExp

  3、構造函數會出現資源浪費的情況

    所以引出概念:靜態成員

    構造函數直接打點賦值Student.version = "1.0";

  另外,我們一般會選擇把函數放到原型上。

三、原型鏈機制

  當調用對象屬性或者方法時,首先會查找自身對象是否具有該屬性和方法,如果有,則就用自身的,如果沒有,則在原型__proto__上尋找.

  但是原型鏈是可以繼承的.

  註意:有的瀏覽器是不支持的。

例子:

js中的對象、原型鏈機制、構造函數