js基礎 八種建立物件方法

2021-09-13 16:02:21 字數 4249 閱讀 9689

object建構函式

物件字面量表示

工廠模式

建構函式模式

原型模式

建構函式模式與原型模式結合

動態原型模式

寄生建構函式模式

var person1 = new object();

person1.name = "bob";

person1.age = '22';

person1.job = 'frontend';

person1.sayname = function ()

person1.sayname(); // bob

console.log(person1.age); // 22

var person2 = 

}person2.sayname(); // bob

function createperson(name, age, job) ;

return o;

}var person1 = createperson('bob', 22, 'frontend');

var person2 = createperson('lynn', 22, 'doctor');

console.log(person1.name); // bob

console.log(person2.name); // lynn

function person(name, age, job) 

/*** 與宣告函式在邏輯上是等價的

this.sayname = new function("console.log(this.name)");

*/}var person1 = new person('bob', 22, 'frontend');

var person2 = new person('lynn', 22, 'doctor');

console.log(person1.name); // bob

console.log(person2.name); // lynn

優點:

缺點:實現過程:

person1person2分別儲存著person的乙個不同的例項。這兩個物件都有乙個constructor(建構函式)屬性,該屬性指向person

console.log(person1.constructor === person); // true

console.log(person2.constructor === person); // true

物件的constructor屬性最初是用來標識物件型別的。但是,提到檢測物件型別,還是instanceof操作符要更可靠一些

console.log(person1 instanceof object); // true

console.log(person1 instanceof person); // true

console.log(person2 instanceof object); // true

console.log(person2 instanceof person); // true

我們在這個例子中建立的所有物件既是object的例項,同時也是person的例項,這一點通過instanceof操作符可以得到驗證,建立自定義的建構函式意味著將來可以將它的例項標識為一種特定的型別

可以將建構函式當作函式

// 當作建構函式使用

var person = new person("bob", 22, "frontend");

person.sayname(); //"nicholas"

// 作為普通函式呼叫

person("lynn", 22, "doctor"); // 新增到window

window.sayname(); //"greg"

// 在另乙個物件的作用域中呼叫

var o = new object();

person.call(o, "kristen", 25, "nurse");

o.sayname(); //"kristen"

缺點優化

建構函式建立的物件方法,實際上執行多次函式建立,會導致不同的作用域鏈和識別符號解析,如:

console.log(person1.sayname == person2.sayname);  //false
建立兩個完成同樣任務的function例項的確沒有必要;況且有this物件在,根本不用在執行**前就把函式繫結到特定物件上面。因此,大可像下面這樣,通過把函式定義轉移到建構函式外部來解決這個問題。

function person(name, age, job) 

// 把sayname函式抽離出外部函式

function sayname()

存在問題:

function person() 

person.prototype.name = 'bob';

person.prototype.age = 22;

person.prototype.job = 'frontend';

person.prototype.sayname = function ()

var person1 = new person();

console.log(person1.name); // bob

console.log(person1.age); // 22

console.log(person1.job); // frontend

console.log(person1.sayname()); // bob

console.log(person1.sayname === person2.sayname); // true

我們建立的每個函式都有乙個prototype(原型)屬性,這個屬性是乙個指標,指向乙個物件,而這個物件的用途是包含可以由特定型別的所有例項共享的屬性和方法。如果按照字面意思來理解,那麼prototype就是通過呼叫建構函式而建立的那個物件例項的原型物件。使用原型物件的好處是可以讓所有物件例項共享它所包含的屬性和方法。

function person(name, age, obj) 

person.prototype =

}var person1 = new person('bob', 22, 'frontend');

var person2 = new person('lynn', 22, 'doctor');

console.log(person1.name); // bob

console.log(person2.name); // lynn

console.log(person1.sayname === person2.sayname); // true

function person(name, age, obj) 

}}var person1 = new person('bob', 22, 'frontend');

var person2 = new person('lynn', 22, 'doctor');

console.log(person1.name); // bob

console.log(person2.name); // lynn

console.log(person1.sayname()); // bob

console.log(person2.sayname()); // lynn

console.log(person1.sayname === person2.sayname); // true

function createperson(name, age, job) ;

return o;

}var person1 = new createperson('bob', 22, 'frontend');

var person2 = new createperson('lynn', 22, 'doctor');

console.log(person1.name); // bob

console.log(person2.name); // lynn

JS基礎 物件建立

var obj new object 複製 var obj 複製 使用同乙個介面建立很多物件,會產生大量的重複 為了避免該情況,我們把建立物件的過程封裝在函式體內,通過函式的呼叫直接生成物件 工廠模式 因為ecmascript無法建立類,所以就用函式來封裝以特定介面物件的細節。本質就是在函式內通過n...

js建立物件方法

1.物件字面量 let xys console.log xys.age 22 2.使用new操作符和建構函式 1.系統內建物件 var obj1 new object var obj2 new array 建立乙個陣列物件 var obj2 new date 建立乙個日期物件 var obj3 ne...

JS建立物件的三種方法

工廠模式 function person name,age,job return obj var person person five 17,web person.sayname 工廠模式定義好形參之後,new乙個物件,然後return回去 即可在外部呼叫函式,然後傳入實參。即可使用函式內部的方法建...