JavaScript 对象属性
JavaScript 对象属性
属性是任何 JavaScript 对象最重要的部分。
JavaScript 属性
属性指的是与 JavaScript 对象相关的值。
JavaScript 对象是无序属性的集合。
属性通常可以被修改、添加和删除，但是某些属性是只读的。
访问 JavaScript 属性
访问对象属性的语法是：
objectName.property // person.age
或者：
objectName["property"] // person["age"]
或者：
objectName[expression] // x = "age"; person[x]
表达式必须计算为属性名。
例子 1
person.firstname + " is " + person.age + " years old.";
完整实例：
<!DOCTYPE html>
<html>
<body>
<h1>JavaScript 对象属性</h1>
<p>访问对象属性有两种不同的方法：</p>
<p>您可以使用 .property 或 ["property"]。</p>
<p id="demo"></p>
<script>
var person = {
firstname:"Bill",
lastname:"Gates",
age:62,
eyecolor:"blue"
};
document.getElementById("demo").innerHTML = person.firstname + " is " + person.age + " years old.";
</script>
</body>
</html>
运行结果：
Javascript 对象属性 访问对象属性有两种不同的方法： 您可以使用 .property 或 ["property"]。 Bill is 62 years old.
可以使用本站在线JavaScript测试工具测试上述代码运行效果：http://www.phpcodeweb.com/runjs.html
例子 2
person["firstname"] + " is " + person["age"] + " years old.";
完整实例：
<!DOCTYPE html>
<html>
<body>
<h1>JavaScript 对象属性</h1>
<p>访问对象属性有两种不同的方法：</p>
<p>您可以使用 .property 或 ["property"]。</p>
<p id="demo"></p>
<script>
var person = {
firstname:"Bill",
lastname:"Gates",
age:62,
eyecolor:"blue"
};
document.getElementById("demo").innerHTML = person["firstname"] + " is " + person["age"] + " years old.";
</script>
</body>
</html>
运行结果：
Javascript 对象属性 访问对象属性有两种不同的方法： 您可以使用 .property 或 ["property"]。 Bill is 62 years old.
可以使用本站在线JavaScript测试工具测试上述代码运行效果：http://www.phpcodeweb.com/runjs.html
JavaScript for...in 循环
JavaScript for...in 语句遍历对象的属性。
语法
for (variable in object) {
要执行的代码
}
for...in 循环中的代码块会为每个属性执行一次。
循环对象的属性：
示例代码：
var person = {fname:"Bill", lname:"Gates", age:62};
for (x in person) {
txt += person[x];
}
完整实例：
<!DOCTYPE html>
<html>
<body>
<h1>JavaScript 对象属性</h1>
<p id="demo"></p>
<script>
var txt = "";
var person = {fname:"Bill", lname:"Gates", age:62};
var x;
for (x in person) {
txt += person[x] + " ";
}
document.getElementById("demo").innerHTML = txt;
</script>
</body>
</html>
运行结果：
Javascript 对象属性 Bill Gates 62
可以使用本站在线JavaScript测试工具测试上述代码运行效果：http://www.phpcodeweb.com/runjs.html
添加新属性
您可以通过简单的赋值，向已存在的对象添加新属性。
假设 person 对象已存在 - 那么您可以为其添加新属性：
示例代码：
person.nationality = "English";
完整实例：
<!DOCTYPE html>
<html>
<body>
<h1>JavaScript 对象属性</h1>
<p>您可以向现有对象添加新属性。</p>
<p id="demo"></p>
<script>
var person = {
firstname:"Bill",
lastname:"Gates",
age:62,
eyecolor:"blue"
};
person.nationality = "English";
document.getElementById("demo").innerHTML =
person.firstname + " is " + person.nationality + ".";
</script>
</body>
</html>
运行结果：
Javascript 对象属性 您可以向现有对象添加新属性。 Bill is English.
可以使用本站在线JavaScript测试工具测试上述代码运行效果：http://www.phpcodeweb.com/runjs.html
您不能使用预留词作为属性名（或方法名）。请使用 JavaScript 命名规则。
删除属性
delete 关键词从对象中删除属性：
示例代码：
var person = {firstName:"Bill", lastName:"Gates", age:62, eyeColor:"blue"};
delete person.age; // 或 delete person["age"];
完整实例：
<!DOCTYPE html>
<html>
<body>
<h1>JavaScript 对象属性</h1>
<p>您可以删除对象属性。</p>
<p id="demo"></p>
<script>
var person = {
firstname:"Bill",
lastname:"Gates",
age:62,
eyecolor:"blue"
};
delete person.age;
document.getElementById("demo").innerHTML =
person.firstname + " is " + person.age + " years old.";
</script>
</body>
</html>
运行结果：
Javascript 对象属性 您可以删除对象属性。 Bill is undefined years old.
可以使用本站在线JavaScript测试工具测试上述代码运行效果：http://www.phpcodeweb.com/runjs.html
delete 关键词会同时删除属性的值和属性本身。
删除完成后，属性在被添加回来之前是无法使用的。
delete 操作符被设计用于对象属性。它对变量或函数没有影响。
delete 操作符不应被用于预定义的 JavaScript 对象属性。这样做会使应用程序崩溃。
属性值
所有属性都有名称。此外它们还有值。
值是属性的特性之一。
其他特性包括：可列举、可配置、可写。
这些特性定义了属性被访问的方式（是可读的还是可写的？）
在 JavaScript 中，所有属性都是可读的，但是只有值是可修改的（只有当属性为可写时）。
（ECMAScript 5 拥有获取和设置所有属性特性的方法）
原型属性
JavaScript 对象继承了它们的原型的属性。
delete 关键词不会删除被继承的属性，但是如果您删除了某个原型属性，则将影响到所有从原型继承的对象。
