这次彻底理解了Object这个属性
2018-06-24 00:13:38来源:未知 阅读 ()
1.实例化Object对象
实例化Object对象的方式有两种:使用Object
构造器和使用对象的字面量。例如:
var person1 = {
name: '李四'
};
var person2 = new Object();
person2.name = '王二';
2.为实列添加属性
我们可以随时随地为对象添加属性,也可以随时修改属性的值。
var person1 = {
name: '小明'
};
var person2 = new Object();
person2.name = '小红';
//给对象添加属性
person1.age = 23;
person2.age = 25;
//修改属性的值
person1.name = '张三';
console.log(person1.name); //'张三'
person2.name = '李四';
console.log(person2.name); //'李四'
3.删除对象中的属性
var person1 = {
name: '张三'
};
person1.name = null;
console.log(person1.name); //'张三'
delete person1.name;
console.log(person1.name); //'undefined'
4.检查属性
由于对象的属性可以被随时随地被修改或删除,因此有时候我们需要检查对象的某个属性是否存在。使用下面的方式检查是不可靠的:
var person1 = {
name: '张三'
};
person1.name = '';//或者null/undefined
if (person1.name) {
console.log('存在');
} else {
console.log('不存在'); //'不存在'
}
使用这种方式可能会得不到正确的结果,如果属性的值是:对象,非空字符串,非零的数或者true,if
条件语句会把它们转换成true
。如果属性的值是:null,undefined,0,false,NaN,空字符串,if
条件语句会把它们转换成false
。检差对象中的属性是否存在的更可靠的方式是使用in
操作符:
var person1 = {
name: '张三'
};
person1.name = '';//或者null/undefined
if ('name' in person1) {
console.log('存在'); //'存在'
} else {
console.log('不存在');
}
5.遍历实列的属性
默认情况下,我们添加到对象上的属性都是可枚举的,这样的话我们就可以使用for-in
循环遍历它们。
var obj = {
name: '王志龙',
age: 23,
gender: '男',
address: '鹤壁'
};
var propertyName;
for (propertyName in obj){
console.log('属性名:' + propertyName);
console.log('属性值:' + obj[propertyName]);
}
for-in
循环每循环一次都会将一个属性名赋值给propertyName
,直到所有的属性都被遍历一遍为止。
如果我们只是想获取一个对象中的所有属性名,可以使用Object.keys()
方法。该方法会以数组的形式返回所有的属性名。
console.log(Object.keys(obj)); // ["name", "age", "gender", "address"]
6.属性的分类
属性的类型分两种:一种是数据属性,一个种是访问器属性。数据属性用来存储一个值,比如所上个例子中的name
。访问器属性不包含值,而是定义了一个get
和set
函数,当读取属性时,调用get
函数,当写属性时,调用set
函数。
下面是一个使用字面量的形式定义访问器属性的语法:
var obj = {
_myname: 'clw',
get name(){
console.log('get方法被调用了');
return this._myname + '1111';
},
set name(value){
console.log('set方法被调用了');
this._myname = value;
}
};
console.log(obj.name);
7.属性的内部
7.1共享的属性:
数据属性和访问器属性共享的内部特性有两个:一个是[[Enumerable]]
,这个特性决定了我们是否能够遍历该属性。另一个是[[Configurable]]
,这个特性决定了我们是否能够改变属性。默认情况下我们在对象上添加的属性都是可枚举、可配置的。
如果我们向改变属性的特性,可以使用Object.defineProperty()
方法。该方法接受3个参数:拥有被修改属性的对象、被修改的属性名、包含描述特性的对象。描述符和内部特性名称相同,但是没有方括号。例如,我们将一个属性改成不能枚举,不能配置:
var person1 = {
name: '张三',
age: 22
};
console.log(person1.propertyIsEnumerable('name'));
Object.defineProperty(person1, 'name', {
enumerable: false
});
console.log('name' in person1); //true
console.log(person1.propertyIsEnumerable('name')); //false
var properties = Object.keys(person1);
console.log(properties); //["age"]
//delete person1.name;
//console.log(person1.name); //'undefined'
Object.defineProperty(person1, 'name', {
configurable: false
});
delete person1.name;
console.log(person1.name); //'张三'
7.2访问器属性内部的特性:
var obj = {
_myname: 'clw',
get name(){
console.log('get方法被调用了');
return this._myname + '1111';
},
set name(value){
console.log('set方法被调用了');
this._myname = value;
}
};
//上面的代码等价于:
var obj2 = {
_myname: 'clw'
};
Object.defineProperty(obj, 'name', {
get: function() {
console.log('get方法被调用了');
return this._myname + '1111';
},
set: function(value) {
console.log('set方法被调用了');
this._myname = value;
},
configurable: true,
enumerable: true
});
7.3定义多个属性的内部特性:
定义单个属性的内部特性使用Object.defineProperty()
,定义多个属性使用的是Object.defineProperties()
,这个方法接受2个参数,第一个是属性所属的对象,第二个是包含被定义属性的对象。
var person1 = {};
Object.defineProperties(person1, {
name: {
value: '张三',
enumerable: true,
configurable: true,
writable: true
},
age: {
value: 23,
enumerable: false,
configurable: false,
writable: false
},
address: {
get: function(){
},
set: function(value){
},
enumerable: true,
configurable: true
}
});
console.log(person1.name); //'张三'
person1.name = '李四';
console.log(person1.name); //'李四'
console.log(person1.age); //23
person1.age = 500;
console.log(person1.age); //23
7.4获取属性内部的特性
获取属性的内部特性的方法有两个:Object.getOwnPropertyDescriptor()
和Object.getOwnPropertyDescriptors()
。
var person1 = {};
Object.defineProperties(person1, {
name: {
value: '张三',
enumerable: true,
configurable: true,
writable: true
},
age: {
value: 23,
enumerable: false,
configurable: false,
writable: false
},
address: {
get: function(){
},
set: function(value){
},
enumerable: true,
configurable: true
}
});
//获取对象中单个属性的内部特性
var descriptor = Object.getOwnPropertyDescriptor(person1, 'address');
//获取对象中所有属性的内部特性
var descriptors = Object.getOwnPropertyDescriptors(person1);
console.log(descriptors);
标签:
版权申明:本站文章部分自网络,如有侵权,请联系:west999com@outlook.com
特别注意:本站所有转载文章言论不代表本站观点,本站所提供的摄影照片,插画,设计作品,如需使用,请与原作者联系,版权归原作者所有
- 11个不常被提及的JavaScript小技巧 2019-04-29
- 我想这次我真的理解了 JavaScript 的单线程机制 2018-10-10
- (转载)彻底理解浏览器的缓存机制 2018-06-24
- js 打印 2018-06-24
- 这一次带你彻底了解Cookie 2018-06-24
IDC资讯: 主机资讯 注册资讯 托管资讯 vps资讯 网站建设
网站运营: 建站经验 策划盈利 搜索优化 网站推广 免费资源
网络编程: Asp.Net编程 Asp编程 Php编程 Xml编程 Access Mssql Mysql 其它
服务器技术: Web服务器 Ftp服务器 Mail服务器 Dns服务器 安全防护
软件技巧: 其它软件 Word Excel Powerpoint Ghost Vista QQ空间 QQ FlashGet 迅雷
网页制作: FrontPages Dreamweaver Javascript css photoshop fireworks Flash