JS操作对象属性（获取、添加、删除、修改对象属性） |
您所在的位置：网站首页 › js删除某个对象属性 › JS操作对象属性（获取、添加、删除、修改对象属性） |
属性也称为名值对，包括属性名和属性值。属性名可以是包含空字符串在内的任意字符串，一个对象中不能存在两个同名的属性。属性值可以是任意类型的数据。 定义属性1. 直接量定义在对象直接量中，属性名与属性值之间通过冒号分隔，冒号左侧是属性名，右侧是属性值，名值对（属性）之间通过逗号分隔。 示例1在下面示例中，使用直接量方法定义对象 obj，然后添加了两个成员，一个是属性，另一个是方法。 代码语言：javascript复制var obj = { x : 1, y : function () { return this.x + this.x; }}2. 点语法定义示例2通过点语法，可以在构造函数内或者对象外添加属性。 代码语言：javascript复制var obj = {};obj.x = 1;obj.y = function () { return this.x + this.x;}3. 使用 Object.defineProperty使用 Object.defineProperty() 函数可以为对象添加属性，或者修改现有属性。如果指定的属性名在对象中不存在，则执行添加操作；如果在对象中存在同名属性，则执行修改操作。 具体用法如下： Object.defineProperty(object, propertyname, descriptor); 参数说明如下： object：指定要添加或修改属性的对象，可以是 JavaScript 对象或者 DOM 对象。propertyname：表示属性名的字符串。descriptor：定义属性的描述符，包括对数据属性或访问器属性。Object.defineProperty 返回值为已修改的对象。 示例3下面示例先定义一个对象直接量 obj，然后使用 Object.defineProperty() 函数为 obj 对象定义属性，属性名为 x，值为 1，可写、可枚举、可修改特性。 代码语言：javascript复制var obj = {};Object.defineProperty(obj, "x", { value : 1, writable : true, enumerable : true, configurable : true});console.log(obj.x); //14. 使用 Object.defineProperties使用 Object.defineProperties() 函数可以一次定义多个属性。具体用法如下： object.defineProperties(object, descriptors); 参数说明如下： object：对其添加或修改属性的对象，可以是本地对象或 DOM 对象。descriptors：包含一个或多个描述符对象，每个描述符对象描述一个数据属性或访问器属性。示例4在下面示例中，使用 Object.defineProperties() 函数将数据属性和访问器属性添加到对象 obj 上。 代码语言：javascript复制var obj = {};Object.defineProperties(obj, { x : { //定义属性x value : 1, writable : true, //可写 }, y : { //定义属性y set : function (x) { //设置访问器属性 this.x = x; //改写obj对象的x属性的值 }, get : function () { //设置访问器 return this.x; }, }});obj.y = 10;console.log(obj.x); //10读写属性1. 使用点语法使用点语法可以快速读写对象属性，点语法左侧是引用对象的变量，右侧是属性名。 示例1下面示例定义对象 obj，包含属性 x，然后使用点语法读取属性 x 的值。 代码语言：javascript复制var obj = { //定义对象 x : 1}console.log(obj.x); //访问对象属性x，返回1obj.x = 2; //重写属性值console.log(obj.x); //访问对象属性x，返回22. 使用中括号语法从结构上分析，对象与数组相似，因此可以使用中括号来读写对象属性。 示例2针对上面示例，可以使用中括号来读写对象属性。 代码语言：javascript复制console.log(obj["x"]); //2obj["x"] = 3; //重写属性值console.log(obj["x"]); //3【注意事项】在中括号语法中，必须以字符串形式指定属性名，不能使用标识符。中括号内可以使用字符串，也可以使用字符型表达式，即只要表达式的值为字符串即可。示例3下面示例使用 for/in 遍历对象的可枚举属性，并读取它们的值，然后重写属性值。 代码语言：javascript复制for (var i in obj) { console.log(obj[i]); obj[i] = obj[i] + obj[i]; console.log(obj[i]);}在上面代码中，中括号中的表达式 i 是一个变量，其返回值为 for/in 遍历对象时枚举的每个属性名。 3. 使用 Object.getOwnPropertyNames使用 Object.getOwnPropertyNames() 函数能够返回指定对象私有属性的名称。私有属性是指用户在本地定义的属性，而不是继承的原型属性。具体用法如下： Object.getOwnPropertyNames(object); 参数 object 表示一个对象，返回值为一个数组，其中包含所有私有属性的名称。其中包括可枚举的和不可枚举的属性和方法的名称。如果仅返回可枚举的属性和方法的名称，应该使用 Object.keys() 函数。 示例4在下面示例中定义一个对象，该对象包含三个属性，然后使用 getOwnPropertyNames 获取该对象的私有属性名称。 代码语言：javascript复制var obj = {x : 1, y : 2, z : 3};var arr = Object.getOwnPropertyNames(obj);console.log(arr); //返回属性名：x,yz4. 使用 Object.keys使用 Object.keys() 函数仅能获取可枚举的私有属性名称。具体用法如下： Object.keys(object); 参数 object 表示指定的对象，可以是JavaScript 对象或 DOM 对象。返回值是一个数组，其中包含对象的可枚举属性名称。 5. Object.getOwnPropertyDescriptor使用 Object.getOwnPropertyDescriptor() 函数能够获取对象属性的描述符。具体用法如下： Object.getOwnPropertyDescriptor(object, propertyname); 参数 object 表示指定的对象，propertyname 表示属性的名称。返回值为属性的描述符对象。 示例5在下面示例中定义一个对象 obj，包含 3 个属性，然后使用 Object.getOwnPropertyDescriptor() 函数获取属性 x 的数据属性描述符，并使用该描述符将属性 x 设置为只读。最后，调用 Object.defineProperty() 函数，使用数据属性描述符修改属性 x 的特性。遍历修改后的对象，可以发现只读属性 writable 为 false。 代码语言：javascript复制var obj = {x : 1, y : 2, z : 3}; //定义对象var des = Object.getOwnPropertyDescriptor(obj, "x"); //获取属性x的数据属性描述符for (var prop in des) { //遍历属性描述符对象 console.log(prop + ':' + des[prop]); //显示特性值}des.writable = false; //重写特性，不允许修改属性des.value = 100; //重写属性值Object.defineProperty(obj, "x", des); //使用修改后的数据属性描述符覆盖属性xvar des = Object.getOwnPropertyDescriptor(obj, "x"); //重新获取属性x的数据属性描述符for (var prop in des) { //遍历属性描述符对象 console.log(prop + ':' + des[prop]); //显示特性值}一旦为未命名的属性赋值后，对象就会自动定义该属性的名称，在任何时候和位置为该属性赋值，都不需要定义属性，而只会重新设置它的值。如果读取未定义的属性，则返回值都是 undefined。 删除属性使用 delete 运算符可以删除对象的属性。 示例下面示例使用 delete 运算符删除指定属性。 代码语言：javascript复制var obj = {x : 1}; //定义对象delete obj.x; //删除对象的属性xconsole.log(obj.x); //返回undefined当删除对象属性之后，不是将该属性值设置为 undefined，而是从对象中彻底清除属性。如果使用 for/in 语句枚举对象属性，只能枚举属性值为 undefined 的属性，但不会枚举已删除属性。 使用方法方法也是函数，当函数被赋值给对象的属性，就被称为方法。方法的使用与函数是相同的，唯一的不同点是在方法内常用 this 引用调用对象，其实在普通函数内也有 this，只不过不常用。 使用点语法或中括号可以访问方法，使用小括号可以激活方法。 示例1与普通函数用法一样，可以在调用方法时传递参数，也可以设计返回值。 代码语言：javascript复制var obj = {};obj.f = function (n) { //定义对象的方法 return 10 * n;}var n = obj.f(5); //调用方法，设置参数为5console.log(n); //返回值50示例2在方法内 this 总是指向当前调用对象。在下面示例中，当在不同运行环境中调用对象 obj 的方法 f() 时，该方法的 this 指向时不同的。 代码语言：javascript复制纯文本复制代码语言：javascript复制var obj = { //定义对象 f : function () { //定义对象的方法 console.log(this); //访问当前对象 }}obj.f(); //此时this指向对象objvar f1 = obj.f; //引用对象obj的方法ff1(); //此时this指向对象window |
今日新闻 |
点击排行 |
|
推荐新闻 |
图片新闻 |
|
专题文章 |
| CopyRight 2018-2019 实验室设备网 版权所有 win10的实时保护怎么永久关闭 |