真实生活中的对象,属性和方法。
真实生活中,一辆汽车是一个对象。对象有它的属性,如重量和颜色等,方法有启动停止等。
对象 | 属性 | 方法 |
---|---|---|
car.name = Fiat; car.model = 500; car.weight = 850kg; car.color = white; |
car.start( ); car.drive( ); car.brake( ); car.stop( ); |
所有汽车都有这些属性,但是每款车的属性都不尽相同。
所有汽车都拥有这些方法,但是它们被执行的时间都不尽相同。
JavaScript 对象
在 JavaScript中,几乎所有的事物都是对象:字符串、数值、数组、函数...
此外,JavaScript 允许自定义对象。
JavaScript 提供多个内建对象,比如 String、Date、Array 等等。
对象只是带有`属性`和`方法`的特殊数据类型。
- 布尔型可以是一个对象。
- 数字型可以是一个对象。
- 字符串也可以是一个对象
- 日期是一个对象
- 数学和正则表达式也是对象
- 数组是一个对象
- 甚至函数也可以是对象
以下代码为变量 car
设置值为 "Fiat" :
var car = "Fiat";
对象也是一个变量,但对象可以包含多个值(多个变量)。
var car = {type:"Fiat", model:500, color:"white"};
-
在以上实例中,3 个值 ("Fiat", 500, "white") 赋予变量
car
。 -
在以上实例中,3 个变量 (type, model, color) 赋予变量
car
。JavaScript 对象是变量的容器。
对象定义
创建新对象有两种不同的方法:
- 定义并创建对象的实例
- 使用函数来定义对象,然后创建新的对象实例
创建直接的实例
person = new Object();
person.firstname = "John";
person.lastname = "Doe";
person.age = 50;
person.eyecolor = "blue";
替代语法(使用对象 literals):
var person = {
firstName:"John",
lastName:"Doe",
age:50,
eyeColor:"blue"
};
使用对象构造器
使用函数来构造对象:
function person(firstname,lastname,age,eyecolor)
{
this.firstname = firstname;
this.lastname = lastname;
this.age = age;
this.eyecolor = eyecolor;
}
在JavaScript中,this通常指向的是我们正在执行的函数本身,或者是指向该函数所属的对象(运行时)
一旦您有了对象构造器,就可以创建新的对象实例,就像这样:
var myFather=new person("John","Doe",50,"blue");
var myMother=new person("Sally","Rally",48,"green");
对象属性
可以说 "JavaScript 对象是变量的容器"。
但是,我们通常认为 "JavaScript 对象是键值对的容器"。
键值对通常写法为 name : value
(键与值以冒号分割)。
键值对在 JavaScript 对象通常称为 对象属性。
对象键值对的写法类似于:
- PHP 中的关联数组
- Python 中的字典
- C 语言中的哈希表
- Java 中的哈希映射
- Ruby 和 Perl 中的哈希表
访问对象属性
你可以通过两种方式访问对象属性:
objectName.propertyName;
objectName["propertyName"];
把属性添加到 JavaScript 对象
您可以通过为对象赋值,向已有对象添加新属性:
假设 personObj 已存在 - 您可以为其添加这些新属性:firstname、lastname、age 以及 eyecolor:
person.firstname="John";
person.lastname="Doe";
person.age=30;
person.eyecolor="blue";
x=person.firstname; //输出John
对象方法
对象的方法定义了一个函数,并作为对象的属性存储。
对象方法通过添加 ()
调用 (作为一个函数)。
该实例访问了 person
对象的 fullName()
方法:
name = person.fullName();
如果你要访问 person
对象的 fullName
属性,它将作为一个定义函数的字符串返回:
name = person.fullName;
例如:
var person = {
firstName: "John",
lastName : "Doe",
id : 5566,
fullName : function()
{
return this.firstName + " " + this.lastName;
}
};
document.getElementById("demo1").innerHTML = "不加括号输出函数表达式:" + person.fullName; //输出:function () { return this.firstName + " " + this.lastName; }
document.getElementById("demo2").innerHTML = "加括号输出函数执行结果:" + person.fullName(); // 输出:John Doe
访问对象方法
你可以使用以下语法创建对象方法:
methodName : function() { code lines }
你可以使用以下语法访问对象方法:
objectName.methodName()
通常 fullName()
是作为 person
对象的一个方法, fullName
是作为一个属性。
有多种方式可以创建,使用和修改 JavaScript 对象。
同样也有多种方式用来创建,使用和修改属性和方法。
把方法添加到 JavaScript 对象
方法只不过是附加在对象上的函数。
在构造器函数内部定义对象的方法:
function person(firstname,lastname,age,eyecolor)
{
this.firstname=firstname;
this.lastname=lastname;
this.age=age;
this.eyecolor=eyecolor;
this.changeName=changeName;
function changeName(name)
{
this.lastname=name;
}
}
changeName()
函数 name
的值赋给 person
的 lastname
属性。
myMother=new person("Sally","Rally",48,"green");
myMother.changeName("Doe");
document.write(myMother.lastname);
JavaScript 类
JavaScript 是面向对象的语言,但 JavaScript 不使用类。
在 JavaScript 中,不会创建类,也不会通过类来创建对象(就像在其他面向对象的语言中那样)。
JavaScript 基于 prototype
,而不是基于类的。
JavaScript for...in 循环
JavaScript for...in
语句循环遍历对象的属性。
语法
for (variable in object)
{
执行的代码……
}
注意: for...in
循环中的代码块将针对每个属性执行一次。
实例
var person={fname:"Bill",lname:"Gates",age:56};
for (x in person)
{
txt=txt + person[x];
} //txt 输出为 BillGates56
for (x in person){
txt=txt + x;
} //txt 输出为 fnamelnameage
来源: