JavaScript中的物件和原型物件
阿新 • • 發佈:2022-04-05
一.物件:是現實世界中客觀存在的事務,也可以說萬物皆物件
1.JavaScript中建立物件的方式一
語法:var 物件名=new Object();
程式碼如下:
//js面向物件 //建立物件的方式1: var person=new Object(); //給物件屬性賦值 person.name="王二"; person.age=18;
2.JavaScript中建立物件的方式二
語法:var 物件名={屬性1:屬性值1,屬性2:屬性值2....屬性n:屬性值};
程式碼如下:
//建立物件的方式2: var person1={name:"張三",age:18}; console.log(person1.name)
3.JavaScript中建立物件的方式二:
使用構造方法建立物件
語法:首先定義一個物件的建構函式
function 函式名(屬性1,屬性2...)
{
this.屬性1=屬性1;
this.屬性2=屬性2;
...
}
程式碼如下:
//建立物件的方式3使用構造方法建立物件: function Person2(name,age) { this.name=name; this.age=age; this.eat=function () { console.log(name+"大口吃飯!!!") } } var person2=new Person2("李四",18); console.log(person2.name) person2.eat();
二.原型物件
JavaScript中每個物件都有原型物件.
原型物件:原型物件,就是其它語言中的類中的靜態屬性和靜態方法,總是是靜態-static就對了.原理是: 記憶體中只有一份.
在JavaScript中,每個函式都有一個prototype屬性,這個屬性指向函式的原型物件
原型的概念:每一個javascript物件(除null外)建立的時候,就會與之關聯另一個物件,這個物件就是我們所說的原型,每一個物件都會從原型中“繼承”屬性。
建構函式與原型物件之間的關係,如圖:
2.__proto__
這是每個物件(除null外)都會有的屬性,叫做__proto__,這個屬性會指向該物件的原型。
案例如下:
//原型物件,最重要的作用就是把常量和方法獨立到自身裡. 供給其它 “自己的物件” 使用. //定義構造方法 function Animal(name,age) { this.name = name; this.age = age; } //原生物件中新增屬性 Animal.prototype.color="藍色"; //原生物件中新增方法 Animal.prototype.eat=function () { console.log(this.name+"大口乾飯!!!") } var cat=new Animal("小花貓",3); var cat1=new Animal("tom",5); console.log(cat); console.log(cat1); console.log(cat.name+" "+cat.age+" "+cat.color); console.log(cat1.name+" "+cat1.age+" "+cat1.color); cat.eat(); cat1.eat(); /* 不過前提是,你的物件屬性裡面,沒有定義color和eat()方法.不然會把原物件的覆蓋掉 在cat.color的時候,首先,我們檢查cat物件本身,從圖中我們知道,cat有 name和age屬性 和prototype指標屬性. 並沒有color,找不到以後,它會繼續搜尋原型物件裡面,看能否找到color屬性,如果有,就會呼叫原型物件的屬性.*/
執行過程:
在執行cat.color的時候,首先,我們檢查cat物件本身,從圖中我們知道,cat有 name和age屬性 和prototype指標屬性.
並沒有color,找不到以後,它會繼續搜尋原型物件裡面,看能否找到color屬性,如果有,就會呼叫原型物件的屬性.
3.獲取原型物件的方式
1、從 建構函式 獲得 原型物件:
建構函式.prototype
2、從 物件例項 獲得 父級原型物件:
方法一: 物件例項.__proto__ 【 有相容性問題,不建議使用】
方法二:Object.getPrototypeOf( 物件例項 )