JS物件導向（3）之Object類，靜態屬性，閉包，私人屬性， call和apply的使用，繼承的三種實現方法，objectapply

JS物件導向（3）之Object類，靜態屬性，閉包，私人屬性， call和apply的使用，繼承的三種實現方法，objectapply

1.Object類

在JS中，Object是所有類的基類，使用Object類來建立自訂對象時，可以無需定義建構函式（constructor，prototype，hasOwnProperty(property)）

var per = new Object();per.name = 'zhangsan';per.age = ;alert(per.name + per.age);

我們想在程式中得到一個物件變數，只要能儲存大量資料即可，這個時候，我們可以考慮使用Object類。Object類避免了對構造器的定義。 Object類下另一個常用的屬性：hasOwnProperty

var per = new Object();per.name = 'zhangsan';per.age = ;if per.hasOwnProperty('email'){alert('具有email');}else{alert('無email');}

2.靜態屬性

在有些物件導向的語言當中，可以使用static關鍵字定義類的靜態屬性或者靜態方法，在JS中，可以進行類比。

文法：

類名.屬性名稱

類名.屬性=function(){}

function Person(){}Person.count = ;var p = new Person();Person.count++;var p = new Person();Person.count++;var p = new Person();Person.count++;alert(Person.count);

添加靜態屬性和靜態方法：

function Person(){Person.count++; //靜態屬性Person.getCount=function(){ //靜態方法alert('當前共有' + Person.count + '個人');}}Person.count = ;var p = new Person();var p = new Person();var p = new Person();Person.getCount();

3.閉包

概念：所謂閉包，指的是一個擁有許多變數和綁定了這些變數的環境的運算式（通常是一個函數），因此這些變數也是該運算式的一部分。

提出一個問題：

function display(){var i=; }display();//在這裡，想訪問局部變數i

在全域中，不能訪問局部變數i，因為範圍不同，而且，在display函數執行完畢後，局部變數i會被回收。 閉包的功能：“訪問局部變數”和“使變數所佔的記憶體不被釋放”

//例function fn(){function fn(){alert('hello');}return fn; //返回fn函數首地址}var test=fn(); //test也指向了fn函數的首地址test();

通過例1我們知道：變數是可以指向函數的首地址的，函數也可以返回另一個函數的首地址。

//例function fn(){var i = ;function fn(){alert(i);}return fn; //返回fn函數首地址}var test=fn(); //test也指向了fn函數的首地址test();

通過例2我們知道：使用一個拒不函數包含變數i，這樣局部變數i的記憶體不會被回收。

//例function fn(){var i = ;function fn(){alert(i++);}return fn; //返回fn函數首地址}var test=fn(); //test也指向了fn函數的首地址test();test();test();

在例3中，因為i的記憶體永遠不會被回收，所以每次調用fn2，i的值會+1。啟動並執行結果是彈出10，彈出11，彈出12。

閉包的原理：在例3中，共有三個範圍：全域範圍，fn1的範圍，fn2的範圍。在全域範圍裡有test=fn1(),其實這句話就相當於test=fn2。在fn1範圍裡有 var i=10和return fn2，在fn2範圍例有alert(i++)。當全域範圍下的test=fn1()執行時，test指向了fn2的範圍，這個時候fn2範圍下的i被全域範圍鉤住，根據範圍鏈的法則，fn2下並沒有定義i，所以在fn2下的i往上一層範圍上找，找到了fn1範圍下的var i=10。所以全域的test鉤住了fn2的i，fn2的i鉤住了fn1的i，所以fn1運行完畢後，不會被回收。

4.私人屬性

在物件導向思想中，對於有些敏感的，不想公開的成員可以定義為私人的，在JavaScript中可以類比這個功能。

文法：

function Person(p_name){var name = p_name;this.age}

var ：私人

this ：公有

function Person(p_name,p_age){this.name = p_name;var age = p_age;}var p = new Person('zhangsan',);alert(p.name);alert(p.age);

在上面這個例子中，我們想用 var 來表示私人成員屬性，但 Person 建構函式執行完畢後， age 會被回收，不能當做成員屬性來使用。

function Person(p_name,p_age){this.name = p_name;var age = p_age;this.setAge=function(a){age = a;}this.getAge=function(){return(age);}}var p = new Person('zhangsan',);p.setAge();alert(p.getAge());

this.setAge和this.getAge兩個方法使用到了局部變數age,所以age不會被回收。

如果只有set方法，說明該屬性是唯寫屬性。

如果只有get方法，說明該屬性是唯讀屬性。

5.call和apply的使用

call和apply的功能：使用指定的對象調用當前函數。call和apply的功能完全相同，只是在文法上略有不同。

文法：

call([thisObj[,arg1[,arg2[,argN]]]])

第一個參數：函數執行時，this指向誰

後面的參數：根據需要順序指定

apply([thisObj[,argArray]])

第一個參數：函數執行時，this指向誰

第二個參數：數組，表示參數集合

在js中，函數有幾種調用形式：

Person(); //Person內的this指向windowvar p=new Person(); //Person內的this指向pper.Person(); //Person內的this指向perfunction Person(p_name,p_age){this.name = p_name;this.age = p_age;}function speak(){alert(this.name + this.age);}var p = new Person('zhangsan',);//speak(); 這樣調用this指向window//p.speak(); p對象沒有speak屬性

使用call和apply來調用

function Person(p_name,p_age){this.name = p_name;this.age = p_age;}function speak(){alert(this.name + this.age);}var p = new Person('zhangsan',);speak.call(p);speak.apply(p);

call和apply在執行時做了兩件事：1）將函數內部this指向了第一個參數 2）調用函數

另外：還可以這樣解決問題：

P1.say=speak;

P1.say();

這樣解決和上面解決方案有本質上的區別：

上面的解決辦法是直接調用speak函數，只不過函數內部this的指向發生改變。

下面的解決辦法會為p1對象增加屬性，p1對象的“體積”會變大。

舉例說明：

<script>function fn(){this.style.color='red';}function fn(){this.style.fontSize='px';}window.onload=function(){document.getElementById('btn').onclick=function(){var div = document.getElementById('div');fn.call(div);fn.apply(div);};};</script><div id='div'>hello javascript</div><input type='button' id='btn' value='確定'>

6.繼承的三種實現方法

概念：在有些物件導向語言中，可以使用一個類（子類）繼承另一個類（父類），子類可以擁有父類的屬性和方法，這個功能可以在js中進行類比。

三種方法：

第一種：擴充Object方法

Object.prototype.方法=function(父類對象){for(var i in 父類對象){this[i] = 父類對象[i];}　};

舉例說明：

Object.prototype.ext=function(parObject){//迴圈遍曆父類對象所有屬性for(var i in parObject){//為子類對象添加這個遍曆到的屬性//它的值是父類對象這個屬性的屬性值this[i] = parObject[i];}}function Person(p_name,p_age){this.name=p_name;this.age=p_age;this.speak=function(){alert(this.name+this.age);}}function Student(p_no){this.no=p_no;this.say=function(){alert(this.no+this.name_this.age);}}var stu = new Student();stu.ext(new Person('xiaoqiang',));stu.speak();stu.say();

第二種：使用call和apply方法

文法：

父類構造器.call(this,.......);

function Person(p_name,p_age){this.name=p_name;this.age=p_age;this.speak=function(){alert(this.name+this.age);}}function Student(p_no,p_name,p_age){this.no=p_no;this.say=function(){alert(this.name+this.age+this.no);}Person.call(this,p_name,p_age);}var stu = new Student(,'zhagsan',);stu.speak();stu.say();

第三種：原型繼承

文法：

子類.prototype = new 父類();

function Person(p_name,p_age){this.name=p_name;this.age=p_age;this.speak=function(){alert(this.name+this.age);}}function Student(p_no){this.no=p_no;this.say=function(){alert(this.name+this.age+this.no);}}Student.prototype = new Person('wangwu',);var stu = new Student();stu.speak();stu.say();

以上內容給大家介紹了JS物件導向（3）之Object類，靜態屬性，閉包，私人屬性， call和apply的使用，繼承的三種實現方法，希望對大家有所協助！

您可能感興趣的文章:

• JS物件導向、prototype、call()、apply()
• js apply/call/caller/callee/bind使用方法與區別分析
• JS物件導向編程之對象流量分析
• JS物件導向編程淺析
• JS物件導向基礎講解(原廠模式、建構函式模式、原型模式、混合模式、動態原型模式)
• javascript中call,apply,bind的用法對比分析
• 淺談javascript中call()、apply()、bind()的用法
• 開啟Javascript中apply、call、bind的用法之旅模式