前端開發JS 物件與原型

2022-05-10 20:46:09 字數 2871 閱讀 1774

27、建立物件

①工廠模式批量建立物件  缺點:無法物件識別,即所有物件都是object型別;方法記憶體空間浪費/封裝不太完善

function sayname()

function createobject(name, age, gender);

return obj;    //或者直接返回物件

}var o1 = createobject('zhangsan', 12, 'man');

var o2 = createobject('lisi', 15, 'woman');

var dog = createobject('erha', 4, 'man');

console.log(o1, o2, dog);

//通過例項找建構函式

console.log(o1.constructor);     //object

②建構函式模式建立物件 

自定義建構函式     問題:方法記憶體空間浪費/封裝不太完善

function sayname()

function person(name, age, gender)

var p1 = new person("terry",11,"man");

console.log(p1)

console.log(p1.constructor);    //[function: person]

function dog(name, age, color)

var d1 = new dog("erha",2,"red");

console.log(d1)

console.log(d1.constructor);   //[function: dog]

③原型模式建立物件 

問題: 例項的資料隔離不安全,因為裡面的資料共享

function person(){}

person.prototype.name = 'zhangsan';

person.prototype.friends = ;

person.prototype.sayname = function();

var p1 = new person();

consoe.log(p1.name);    //zhangsan

var p2 = new person();

consoe.log(p1.name);    //zhangsan

p1.friends.push('terry');

console.log(p1.friends);  //['terry']

console.log(p2.friends);  //['terry']

console.log(p1.sayname === p2.sayname);   //true

④組合使用建構函式模式和原型模式 

//每個例項自有的放到建構函式中,例項共享的放到原型物件中

function person(name, age, gender)

person.prototype =

}var p1 = new person("terry",11,"man");

console.log(p1);

console.log(p1.constructor);   //;

console.log(obj); //

讀取屬性的特性 object.getownpropertydescriptor();獲取指定屬性的描述符該方法接受兩個引數, 第乙個為屬性所在的物件,第二個為要讀取其描述符的屬性名稱

//獲取屬性的描述資訊

console.log(object.getownpropertydescriptor(obj, 'name'));   //

要修改屬性預設的特性,必須使用ecmascript5的object.defineproperty()方法 defineproperty(屬性所在的物件,屬性的名字,乙個描述符物件);

//修改屬性的描述資訊

object.defineproperty(obj, 'name',

//設定屬性不可修改

writable:false,             -------->obj.name = 'lisi'; console.log(obj.name); //zhangsan

//設定屬性值

value:'terry',              --------->console.log(obj.name);     //terry

//設定屬性是否可以刪除delete,是否可以重新定義,是否可以配置

configurable:false,         --------->別人就不能改變這個屬性

})④訪問器屬性      沒有值,有get方法和set方法, configurable的屬性預設為false

var obj = ;

object.defineproperty(obj, 'weight', ,

set:function(param),

//enumerable:true,

});/*object.defineproperty(obj, '_weight', );*/

console.log(obj.weight);   //95

obj.weight = 130

console.log(obj.weight);   //125

console.log(obj._weight);   //130

console.log(obj);  //  

console.log(object.getownpropertydescript(obj, 'weight'));

console.log(object.getownpropertydescript(obj, '_weight'));

前端開發之原型與原型鏈

什麼是原型和原型鏈 1 原型分為顯式原型和隱式原型。顯示原型對應的是prototype屬性,隱式原型對應的是 proto 屬性。2 所有物件 萬物皆物件 都有 proto 屬性,包括函式 示例等,只有函式才有prototype屬性。3 prototype屬性值其實也是乙個物件,型別為object。它...

JS 物件 JS原型 原型鏈

參考學習 js物件 構造器函式 建立物件的函式。物件分為普通物件和函式物件。所有物件都有 proto 屬性 函式物件不止有 proto 屬性,還有prototype屬性 稱為原型物件 1.new function 產生的物件都是函式物件。2.所有函式物件的 proto 都指向function.pro...

JS原型物件

原型prototype 將函式定義在全域性作用域中的缺點 1.會汙染全域性作用域的命名空間,如 函式functiona 那麼在全域性作用域中就不能再出現functiona這個命名了。2.定義在全域性作用域中不安全。因此,就用到了主角 原型 1.所有的函式都有原型物件 2.當函式以建構函式的形式呼叫時...