免費(fèi)AI編程助手
JavaScript構(gòu)造函數(shù)
2018-01-06 19:14 更新
Javascript面向?qū)ο笤O(shè)計(jì) - JavaScript構(gòu)造函數(shù)
原型的共享性質(zhì)使它們成為定義方法的理想選擇一次給定類型的所有對象。
它將方法放在原型上更有效率然后使用它來訪問當(dāng)前實(shí)例。
例子
例如，考慮下面的新的Book構(gòu)造函數(shù):
function Book(name) { // ww w .j a v a2 s. com
this.name = name;
}
Book.prototype.writeLine = function() {
console.log(this.name);
};
var book1 = new Book("Javascript");
var book2 = new Book("CSS");
console.log(book1.name); // "Javascript"
console.log(book2.name); // "CSS"
book1.writeLine(); // outputs "Javascript"
book2.writeLine(); // outputs "CSS"
上面的代碼生成以下結(jié)果。
注意
上面的代碼生成以下結(jié)果。...
function Book(name) { // w ww .j a v a 2 s . c om
this.name = name;
}
Book.prototype.writeLine = function() {
console.log(this.name);
};
Book.prototype.favorites = [];
var book1 = new Book("Javascript");
var book2 = new Book("CSS");
book1.favorites.push("A");
book2.favorites.push("B");
console.log(book1.favorites); // "A,B"
console.log(book2.favorites); // "A,B"
上面的代碼生成以下結(jié)果。
筆記2
以下代碼顯示了如何向原型添加更多方法:
function Book(name) { /* w ww .ja va 2 s . c o m*/
this.name = name;
}
Book.prototype = {
writeLine : function() {
console.log(this.name);
},
toString : function() {
return "[Book " + this.name + "]";
}
};
上面的代碼在原型上定義了兩個(gè)方法writeLine()和 toString()。
有一個(gè)副作用需要注意:
function Book(name) { //w ww.java 2s . c o m
this.name = name;
}
Book.prototype = {
writeLine : function() {
console.log(this.name);
},
toString : function() {
return "[Book " + this.name + "]";
}
};
var book1 = new Book("Javascript");
console.log(book1 instanceof Book); // true
console.log(book1.constructor === Book); // false
console.log(book1.constructor === Object); // true
上面的代碼生成以下結(jié)果。
為了避免這種情況，在覆蓋原型時(shí)將構(gòu)造函數(shù)屬性恢復(fù)為正確的值:
function Book(name) { //from w ww. j a va 2s .com
this.name = name;
}
Book.prototype = {
constructor : Book,
writeLine : function() {
console.log(this.name);
},
toString : function() {
return "[Book " + this.name + "]";
}
};
var book1 = new Book("Javascript");
var book2 = new Book("CSS");
console.log(book1 instanceof Book); // true
console.log(book1.constructor === Book); // true
console.log(book1.constructor === Object); // false
console.log(book2 instanceof Book); // true
console.log(book2.constructor === Book); // true
console.log(book2.constructor === Object); // false
上面的代碼生成以下結(jié)果。
改變原型
由于特定類型的所有實(shí)例引用共享原型，我們可以擴(kuò)充所有這些對象。
[[Prototype]]屬性包含一個(gè)指向原型的指針，任何對原型的更改在引用它的任何實(shí)例上都可用。
我們可以隨時(shí)向原型添加新成員，并將這些更改反映在現(xiàn)有實(shí)例上。
function Book(name) { /*from w ww. ja v a 2 s. co m*/
this.name = name;
}
Book.prototype = {
constructor : Book,
writeLine : function() {
console.log(this.name);
},
toString : function() {
return "[Book " + this.name + "]";
}
};
var book1 = new Book("Javascript");
var book2 = new Book("CSS");
console.log("sayHi" in book1); // false
console.log("sayHi" in book2); // false
// add a new method
Book.prototype.sayHi = function() {
console.log("Hi");
};
book1.sayHi(); // outputs "Hi"
book2.sayHi(); // outputs "Hi"
上面的代碼生成以下結(jié)果。
內(nèi)置對象原型
上面的代碼生成以下結(jié)果。...
以下代碼顯示了如何通過修改Array.prototype為數(shù)組添加一個(gè)新方法。
Array.prototype.sum = function() { /* ww w. j a v a2 s . co m*/
return this.reduce(function(previous, current) {
return previous + current;
});
};
var numbers = [ 1, 2, 3, 4, 5, 6 ];
var result = numbers.sum();
console.log(result);
上面的代碼生成以下結(jié)果。
以下代碼顯示了如何為字符串值添加新方法。
String.prototype.capitalize = function() {
return this.charAt(0).toUpperCase() + this.substring(1);
};
var message = "hello world!";
console.log(message.capitalize());
上面的代碼生成以下結(jié)果。
以上內(nèi)容是否對您有幫助：
更多建議：