1. 程式人生 > >Object擴充套件物件

Object擴充套件物件

1. Object.create(prototype,[descriptors])         作用: 以指定物件為原型建立新的物件               為新的物件指定新的屬性,並對屬性進行描述               -value 指定值               -writable 標識當前屬性值是否是可修改的,預設為false               -configurable 標識當前屬性是否可被刪除,預設為false               -enumerable 標識當前屬性是否可用for in列舉,預設false

var obj = {name:'Yoona',age:28};
var obj1 = Object.create(obj,{
    sex:{
        value:'女',
        writable:false,// 是否可修改
        configurable:false,// 是否可修改
        enumerable:false, // 是否可列舉
    }
})

 console.log(obj1)  可以看到obj1有sex屬性,其原型上有obj的屬性,所以obj1是以obj為原型建立的物件,它的新屬性為sex.

var obj = {name:'Yoona',age:28}
	var obj1 = {}
	obj1 = Object.create(obj,{
		sex: {
			value: '女',
			writable: false ,// 是否可修改
			configurable: false,// 是否可被刪除
			enumerable: false // 是否可列舉
		}
	})
	console.log(obj1)
	console.log(obj1.sex)// 女
	obj1.sex = '男';// 改變sex屬性的值
	console.log(obj1.sex);//女 並沒有改變
	delete obj1.sex;//刪除sex屬性
	console.log(obj1)// 並沒有刪除
	for(var i in obj1){// 列舉obj1物件
		console.log(i)// name age 並沒有sex
	}

   

var obj = {name:'Yoona',age:28}
	var obj1 = {}
	obj1 = Object.create(obj,{
		sex: {
			value: '女',
			writable: true ,// 是否可修改
			configurable: true,// 是否可被刪除
			enumerable: true // 是否可列舉
		}
	})
	console.log(obj1)
	console.log(obj1.sex)
	obj1.sex = '男'
	console.log(obj1.sex)
	delete obj1.sex
	console.log(obj1)

當writable,configurable,enumerable的值為true時:sex的值可以修改,也可以刪除

var obj = {name:'Yoona',age:28}
	var obj1 = {}
	obj1 = Object.create(obj,{
		sex: {
			value: '女',
			writable: true ,// 是否可修改
			configurable: true,// 是否可被刪除
			enumerable: true // 是否可列舉
		}
	})
	console.log(obj1)
	console.log(obj1.sex)
	obj1.sex = '男'
	console.log(obj1.sex)
	//delete obj1.sex
	//console.log(obj1)
	for(var i in obj1){
		console.log(i)
	}

sex屬性也可以枚舉出來

2. Object.defineproperties(object,description)         作用: 為指定物件定義擴充套件多個屬性             -get 用來獲取當前屬性值的回撥函式             -set 修改當前屬性值的觸發的回撥函式,並且實參即為修改後的值             存取器屬性: setter getter  一個用來存值 一個用來取值

var obj2 = {firstName: 'Taylor',lastName: 'Swift'}
Object.defineProperties(obj2,{
	fullName: {
		get: function(){// 獲取擴充套件屬性的值 獲取擴充套件屬性的值時自動呼叫
			return this.firstName + ' ' + this.lastName
		},
		set: function(data){// 監聽擴充套件屬性,當擴充套件屬性發生變化時會自動呼叫,並將變化的值作為實參注入set函式
			var names = data.split(' ')
			this.firstName = names[0]
			this.lastName = names[1]
		}
	}
})
console.log(obj2)
console.log(obj2.fullName)
obj2.fullName = 'Taylor Smith'
console.log(obj2.fullName)

3. 物件本身的兩個方法         get propertyName(){} 用來得到當前屬性值的回撥函式         set propertyName(){} 用來監視當前屬性值變化的回撥函式

var person = {
		firstName: 'Taylor',
		lastName: 'Swift',
		get fullName(){
			return this.firstName + ' ' + this.lastName
		},
		set fullName(data){
			var names = data.split(' ')
			this.firstName = names[0]
			this.lastName = names[1]
		}
	}

	console.log(person)
	person.fullName = 'Kristen Stewart'
	console.log(person)