DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> JavaScript基礎知識 >> 對Js OOP編程 創建對象的一些全面理解
對Js OOP編程 創建對象的一些全面理解
編輯:JavaScript基礎知識     

面向對象是一種對現實世界理解和抽象的方法,是計算機編程技術發展到一定階段後的產物。

對象的含義

對象可以是汽車,人,動物,文字,表單或者任何存在的事物等等。

對象有:

  屬性-------對象的某些特定的性質。
  方法-------對象能做的事情。
  事件-------能響應發生在對象上的事情。

我們可以通過創建一個人的對象來理解面向對象

人:

  兩只手,兩只腳,一個頭,還可以跑動。

  手,腳,頭,是人的屬性,跑動是人的方法。

首先,我們來用最簡單的方法創建一個對象

var person = {
      head: "one",
      hand: "two",
      foot: "two",
      run : function(){
        console.log("running");
      }
    }

這個方法一點都不實用,因為它是創建一個單獨的對象,,而這個對象和任何常見的數據結構沒有任何聯系。

然後,我們用構造函數的方式創建一個對象

var Person = function(){//注意,首字母大寫
      this.head = "one",
      this.hand = "two",
      this.foot = "two",
      this.run = function(){
        alert("running");
      }
    }
    var Joan = new Person();
    document.write(Joan.run())// "running"

這是用構造函數創建的對象,然後我們再加上一行代碼看看

var Niki = new Person();
    alert(Joan==Niki) //false;

是的,現在創建了是兩個不同的對象實例。

在JavaScript中的每個函數都有一個prototype的屬性.如果某個函數被用作構造函數,則這個屬性會被自動通過new調用創建對象的原型

console.log(Joan)

可以看到有一個__proto__:Person,其中__proto__是Joan的原型鏈.它是指向Person的原型.

JS在創建對象(不論是普通對象還是函數對象)的時候,都有一個叫做__proto__的內置屬性,用於指向創建它的函數對象的原型對象prototype。

關於原型鏈的一些理解,在JavaScript高級程序設計 一書中寫的非常詳細。有興趣的可以去看看,網上也有pdf的文檔可以找到。不過建議還是買本書,支持原版嘛。

然後對prototype這個原型屬性的任何更改能夠應用於用new Person()構造的每一個實例對象,不管它是在更改之前還是更改後創建.為Person.prototype 添加新函數.具體如下:

var Person = function(){//注意,首字母大寫
      this.head = "one",
      this.hand = "two",
      this.foot = "two"
    }
    Person.prototype.run = function(){
      alert("running");
    }
    var Joan = new Person();
    Joan.run()// "running"
    alert(Joan.__proto__===Person.prototype)//'true'

可以看到,在原型中創建方法是可以調用的,同時Joan的原型鏈是指向Person的原型的。

再看:

var Niki = new Person();//"runing"
     Person.prototype.run = function(){
       alert("running running")
     }
     Joan.run()//"running running"
     Niki.run()//"running running"

看,修改Person的原型方法,所有被new Person()創建的對象實例中的方法都被修改了,因為所有實例中共用的是同一個原型方法run。這就是原型的一種應用。

這就是關於創建對象的一些理解。

寫了好久。也不知道有沒有錯誤。 如果有錯誤,歡迎各位大大指點。

下次再寫面向對象繼承方面的東西。

以上就是小編為大家帶來的對Js OOP編程 創建對象的一些全面理解全部內容了,希望大家多多支持~

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved