Javascript 对象

2018-01-12 19:39 更新

Javascript面向对象设计 - Javascript对象


JavaScript中的对象是动态的。 我们可以添加和删除属性需要。

定义属性

有两种基本的创建对象的方法:

  • Use the Object constructor
  • Use an object literal.

例如:

var book1 = { 
    name : "Javascript" 
}; 

var book2 = new Object(); 
book2.name = "Javascript"; 

book1.website = "www.w3cschool.cn"; 
book2.website = "www.w3cschool.cn"; 

book1.name = "CSS"; 
book2.name = "HTML"; 

console.log(book1.name);
console.log(book1.website);
console.log(book2.name);
console.log(book2.website);

上面的代码生成以下结果。

注意

book1和book2都是具有name属性的对象。然后,为这两个对象分配一个网站属性。

我们可以在对象或更高版本的定义之后添加属性。

对象打开以进行修改,除非您另行指定。

当一个属性首次添加到对象时,JavaScript在对象上使用一个名为[[Put]]的内部方法。

[[Put]]方法在对象中创建一个存储来存储属性。

[[Put]] 在对象上创建一个属性。

该属性称为自有属性。

新添加的属性(自己的属性)表示对象的特定实例具有该属性。

属性(自己的属性)直接存储在实例上。

将新值分配给现有属性时,调用称为 [[Set]] 的单独操作。

[[Set]]操作将使用新的属性替换当前值。


检测属性

检查对象中是否存在属性使用运算符中的

运算符中的在特定的查找具有给定名称的属性对象,并返回true如果找到它。

以下代码显示了如何使用中的来检查book1对象中的一些属性:

var book1 = { 
    name : "Javascript" 
}; 

var book2 = new Object(); 
book2.name = "Javascript"; 

book1.website = "www.w3cschool.cn"; 
book2.website = "www.w3cschool.cn"; 

book1.name = "CSS"; 
book2.name = "HTML"; 

console.log("name" in book1);     // true 
console.log("age" in book1);      // true 
console.log("title" in book1);    // false 

上面的代码生成以下结果。

我们可以以同样的方式检查方法的存在。

以下向book1添加了一个新函数writeLine(),并在中使用确认功能的存在。

var book1 = { 
    name : "Javascript", 
    writeLine : function() { 
        console.log(this.name); 
    } 
}; 

console.log("writeLine" in book1);  // true 

上面的代码生成以下结果。

自有属性和创建属性

以下显示如何区分自己的属性和建筑属性。

操作符中的检查自己的属性和原型属性。

hasOwnProperty()方法存在于所有对象上仅当给定属性存在且是自己的属性时才返回true。

以下代码比较在中使用的结果 hasOwnProperty()在book1的不同属性:

var book1 = { 
    name : "Javascript", 
    writeLine : function() { 
        console.log(this.name); 
    } 
}; 

console.log("name" in book1);                     
console.log(book1.hasOwnProperty("name"));      

console.log("toString" in book1);               
console.log(book1.hasOwnProperty("toString"));  

上面的代码生成以下结果。

删除属性

将属性设置为 null 不会从对象中完全删除该属性。

这样的操作调用 [[Set]] ,值为null,只有替换属性的值。

delete 运算符完全从对象中删除一个属性。

delete 运算符在单个对象属性上工作,并调用内部操作名为 [[Delete]]

当删除操作成功时,它返回true。

以下代码显示如何使用delete操作符。

var book1 = { 
    name : "Javascript" 
}; 

console.log("name" in book1);     

delete book1.name;                

console.log("name" in book1);     
console.log(book1.name);     

上面的代码生成以下结果。

枚举

默认情况下,添加到对象的所有属性都是可枚举的。

我们可以使用for-in循环遍历这些属性。

可枚举属性的[[Enumerable]]属性设置为true。

以下循环输出对象的属性名称和值:

var property; 
var book1 = { 
    name : "Javascript" 
}; 

var property; 

for (property in book1) { 
    console.log("Name: " + property); 
    console.log("Value: " + book1[property]); 
} 

上面的代码生成以下结果。

Object.keys()方法检索ienumerable属性名称的数组,如下所示:

var book1 = { 
    name : "Javascript" 
}; 

var properties = Object.keys(book1); 

var i, len; 

for (i=0, len=properties.length; i < len; i++){ 
    console.log("Name: " + properties[i]); 
    console.log("Value: " + book1[properties[i]]); 
} 

上面的代码生成以下结果。

for-in循环枚举原型属性,而Object.keys()仅返回自己的(实例)属性。

并非所有属性都是可枚举的。

对象上的大多数本地方法都有其[[Enumerable]]属性集假。

我们可以通过使用propertyIsEnumerable()方法来检查属性是否可枚举,它存在于每个对象上:

var book1 = { 
    name : "Javascript" 
}; 

console.log("name" in book1);                          
console.log(book1.propertyIsEnumerable("name"));       

var properties = Object.keys(book1); 

console.log("length" in properties);                   
console.log(properties.propertyIsEnumerable("length"));

上面的代码生成以下结果。

以上内容是否对您有帮助:
在线笔记
App下载
App下载

扫描二维码

下载编程狮App

公众号
微信公众号

编程狮公众号