对象:在Javascript中,是具有属性和方法的数据。
有七种方式:直接创建方式、对象初始化器方式、构造函数方法、prototype原型方式、混合的构造函数/原型方式、动态原型方式和工厂模式。其中前五种较常用。
参数列表表示可以写多个参数,用逗号隔开。
- 直接创建方式(注意对象变量名后面的点)
语法:
var 对象变量名 = new Object();
对象变量名. property1 = value1;
…;
对象变量名. propertyN = valueN;
对象变量名. methodName1 = function([参数列表]){
//函数体
}
…;
对象变量名. methodNameN = function([参数列表]){
//函数体
}
举例
var student=new Object();
student.name="晓琳";
student.age=18;
student.doHomework=function(name){
console.log(this.age+"岁的"+name+"正在做作业");
}
student.music=function(){
console.log(this.age+"岁的"+this.name+"正在听音乐");
}
student.doHomework(student.name);//调用函数,输出18岁的晓琳正在做作业
student.music();//输出18岁的晓琳正在听音乐
其中**this.age**指代了对象属性里的**18**,总是指代这一个属性18,在调用时,不用加括号里的属性。
- 对象初始化器方式(注意属性之间用逗号隔开,最后一个不加逗号,属性与属性值间用【冒号】,不是等号)
语法
var 对象变量名 = {
property1 : value1,
property2 : value2,
…,
propertyN : valueN,
methodName1 : function([parameter_list]){
//函数体
},
…,
methodNameN : function([parameter_list]){
//函数体
}
}
举例
var student={
name:"洲洲",
age:23,
guitar:function(name){
console.log(this.age+"岁的"+name+"喜欢弹吉他");
},
dance:function(name){
console.log(name+"喜欢跳舞");
}
}
student.guitar(student.name);//输出23岁的洲洲喜欢弹吉他
student.dance(student["name"]);//输出洲洲喜欢跳舞
- 构造函数方式【构造函数用大写】
- 缺点–属性和方法混合在一起;优点–便于赋值
function 构造函数([参数列表]){
this.属性 = 属性值;
…
this.属性N = 属性值N;
this.函数1 = method1;
…
this.函数N = methodN;
}
function method1([参数列表]){
//函数体
}
…
function methodN([参数列表]){
//函数体
}
举例
function Student(age){
this.name = "小王";
this.age = age;
this.doHomework = doHomework;
}
function doHomework(name){
console.log(name+"正在学习......");
}
var student = new Student(89);
var name = student.name;//调用属性
var age = student.age;
console.log(name+":"+age);
student.doHomework(name);//调用方法
或
function 构造函数([参数列表]){
this.属性 = 属性值;
…
this.属性N = 属性值N;
this.函数1 = function([参数列表]){
//函数体
} ;
…
this.函数N = function([参数列表]){
//函数体
} ;
}
举例
function Actor(name,age){
this.name=name;
this.age=age;
this.dance=function(){
console.log(this.age+"岁的"+this.name+"喜欢跳舞");
}
this.music=function(){
console.log(this.name+"喜欢音乐");
}
}
var actor1=new Actor("鲸鱼",25);
var actor2=new Actor("洲洲");
actor1.dance();//输出25岁的鲸鱼喜欢跳舞
actor2.music();//输出洲洲喜欢音乐
- prototype原型方式【构造器首字母要大写】
- 优点:方法与构造函数分离;缺点:不便于赋值。
function 对象构造器( ){
}
对象构造器.prototype.属性名=属性值;
对象构造器.prototype.函数名 = function([参数列表]){
//函数体
举例
function Children(){
}
Children.prototype.name="宇宙";
Children.prototype.age=18;
Children.prototype.travel=function(){
console.log(this.age+"岁的"+this.name+"总是想去旅行");
}
var child=new Children();
child.travel();//输出18岁的宇宙总是想去旅行
- 混合的构造函数与原型方式
- 结合了构造函数式与原型式的优点;运用构造函数式定义属性——便于赋值;运用原型式定义方法——使得属性和方法得以分离。
function 对象构造器([参数列表]){
}
对象构造器.prototype.函数名 = function([参数列表]){
//函数体
}
举例
function Family(name,age){
this.name=name;
this.age=age;
}
Family.prototype.cook=function(){
console.log(this.age+"岁的"+this.name+"喜欢做饭。");
}
Family.prototype.guitar=function(){
console.log(this.age+"岁的"+this.name+"爱好吉他");
}
var member1=new Family("大海",18);//调用属性
var member2=new Family("因子",18);
member1.cook();//输出18岁的大海喜欢做饭。
member2.guitar();//输出18岁的因子爱好吉他