Javascriptは対象に向かってプログラミングします.
2565 ワード
参考書:JavaScriptデザインモデルは、話をたくさん続ける前に、単品でextedを継承してみます.extedは単一オブジェクトの属性を継承し、単一オブジェクトの属性をコピーするプロセスです.例えば:
複数引き継ぎ、値タイプ属性に基づく複数引き継ぎ
//extend:
var extend = function (target, source) {
//
for (var property in source) {
//
target[property] = source[property];
}
//
return target;
}
テスト var book = {
name: "javascript",
alike: ['css', 'html']
}
var anotherBook = {
color: "red"
}
extend(anotherBook, book);
console.log(JSON.stringify(anotherBook));//{"color":"red","name":"javascript","alike":["css","html"]}
anotherBook.alike.push("vue");
anotherBook.name = "react";
console.log(JSON.stringify(anotherBook));//{"color":"red","name":"react","alike":["css","html","vue"]}
console.log(JSON.stringify(book));//{"name":"javascript","alike":["css","html","vue"]}
extedは値の種類の属性のみコピー、すなわち浅いコピーを行うことができます.参照タイプの属性にはクラス継承と同じ問題があります.jQueryなどのフレームワークの中に深くコピーすることができました.ソースオブジェクトの中の引用タイプをもう一度extedメソッドを実行します.複数引き継ぎ、値タイプ属性に基づく複数引き継ぎ
Object.prototype.mix = function () {
//
var arg;
//
for (var i = 0, len = arguments.length; i < len; i++) {
// , ,
arg = arguments[i];
//
for (var property in arg) {
// this ,
this[property] = arg[property];
}
}
}
テスト var book = {
name: "javascript",
alike: ['css', 'html']
};
var book1 = {
about: "book"
}
var anotherBook = {
color: "red"
}
anotherBook.mix(book, book1);
console.log(JSON.stringify(anotherBook));//{"color":"red","name":"javascript","alike":["css","html"],"about":"book"}
anotherBook.alike.push("vue");
anotherBook.name = "react";
console.log(JSON.stringify(anotherBook));//{"color":"red","name":"react","alike":["css","html","vue"],"about":"book"}
console.log(JSON.stringify(book));//{"name":"javascript","alike":["css","html","vue"]}