js-建構函式&原型的方法
js-建構函式&原型的方法
建構函式
定義自己的建構函式1 function Rectangle(w, h){ 2 this.width = w; 3 this.height = h; 4 }// 然後我們可以通過建構函式建立物件 var rect1 = new Rectangle(20, 60); 使用建構函式的目的是為了方便我們建立多個擁有相同屬性和方法的物件。 1.當我們使用 new 操作符呼叫函式時,函式內部會自動建立一個該型別的新物件
1 // 定義自己的建構函式 2 function Rectangle(w, h){ 3 this.width = w; 4 this.height = h; 5 this.getArea = function(){ 6 return this.width * this.height; 7 } 8 } 9 10 // 每一建構函式都有一個 prototype 屬性,屬性的值是一個 Object 型別的物件 11 // 我們可以通過 3 種方式獲取 prototype 屬性的值: 12 13 // 1. 通過建構函式直接獲取 14 console.log(Rectangle.prototype) 15 16 // 2. 通過物件(建構函式的例項)__proto__ 屬性獲取,不建議使用這種方式17 var rect1 = new Rectangle(20, 60); 18 console.log(rect1.__proto__) 19 20 // 3. 使用 Object.getPrototypeOf() 方法獲取 21 console.log(Object.getPrototypeOf(rect1))
獲取 prototype 屬性的值
1. 通過建構函式直接獲取
2. 通過物件(建構函式的例項)__proto__ 屬性獲取,不建議使用這種方式
3. 使用 Object.getPrototypeOf() 方法獲取
原型物件
怎樣遍歷出物件的屬性名和屬性值?
var obj1 = {
myName: '張俊娜',
age: 19,
gender: '女',
address: '鄭州'
};
for in 遍歷出物件的屬性名和屬性值
for (var propertyName in obj1) {
console.log(propertyName +' :'+obj1[propertyName])
}
使用 Object.keys() 獲取物件中的所有屬性名(鍵)
var Okey=Object.keys(obj1);
for (var i = 0; i < Okey.length; i++) {
console.log(Okey[i]+"==>"+obj1[Okey[i]])
}
物件的屬性可以分成幾種型別?
兩類:
資料屬性:資料屬性一般用於儲存資料值,
訪問器屬性:不包含資料值、多用於get/set操作
屬性的特性有哪些,分別代表什麼意思?
使用Object.getOwnPropertyDescriptor()獲取屬性的特徵。
資料屬性的特性:
是否可列舉(遍歷) enumerable: true
是否可配置(刪除) configurable: true
是否可寫 writable: true
屬性值 value: “XX”
訪問器屬性特徵:
是否可列舉(遍歷) enumerable: true
是否可配置(刪除) configurable: true
在讀取屬性時呼叫的函式 get
在寫入屬性時呼叫的函式 set
禁止擴充套件的物件、被封印的物件和被凍結的物件分別有哪些特點?
Object.isExtensible(obj); 判斷此物件是否是可擴充套件的(可新增屬性的)。
Object.preventExtensions(obj); 使物件變得不可擴充套件,即永遠不可新增新屬性。
不能新增新屬性
可以修改已有的屬性
可以刪除已有的屬性
可以訪問已有的屬性
可以列舉已有的屬性
Object.isSealed(obj); 判斷物件是否為封印
Object.seal(obj); 設定物件為封印
不能新增新屬性(不可擴充套件)
不能刪除已有屬性
可以修改已有的屬性
可以訪問已有的屬性
可以列舉已有的屬性
Object.isFrozen(obj); 判斷物件是否為凍結
Object.freeze(obj); 設定物件為凍結
不能新增新屬性(不可擴充套件)
不能刪除已有屬性
不能修改已有的屬性
可以訪問已有的屬性
可以列舉已有的屬性
怎樣判斷物件中是否有某個屬性?
點( . )或者方括號( [ ] )
通過點或者方括號可以獲取物件的屬性值,如果物件上不存在該屬性,則會返回undefined。當然,這裡的“不存在”指的是物件自身和原型鏈上都不存在,如果原型鏈有該屬性,則會返回原型鏈上的屬性值。
這種方式很簡單方便,侷限性就是:不能用在x的屬性值存在,但可能為 undefined的場景。
in 運算子
如果指定的屬性在指定的物件或其原型鏈中,則in 運算子返回true。
這種方式的侷限性就是無法區分自身和原型鏈上的屬性,在只需要判斷自身屬性是否存在時,這種方式就不適用了。
hasOwnProperty()
可以看到,只有自身存在該屬性時,才會返回true。適用於只判斷自身屬性的場景。
當讀取一個物件的屬性時,JavaScript引擎是怎樣查詢該屬性的?
當讀取一個物件的屬性時,JavaScript引擎首先在該物件的自有屬性中查詢屬性名字。如果找到則返回。
如果自有屬性中不包含該屬性,則JavaScript會沿著原型物件鏈搜尋原型物件中的屬性。
如果找到則返回,否則返回undefined。