fo对象(object)是 一组属性和方法的集合,对象内部属性都与此对象相关,属性可以为多种类型
简易对象创建:
var obj={
name:'姓名',
sex:'性别',
age:18
}
6.1 对象的创建
1. 对象字面量创建对象
var 对象名 = {
属性名: 属性值,
属性名: 属性值,
属性名: 属性值
}
例子:
var student = {
name:'宋'
sex:'男'
think : function(){
alert('我认为还是不行')
}
};
2. 对象属性的使用使用
调用对象属性
console.log(对象名.属性名)
console.log(对象名['属性名'])
console.log(student.name)
console.log(student['name']) //调用名字属性
[]
里必须加''
调用对象方法
对象名.方法名();
student.think();
3. 使用 new Object创建对象
创建空对象:
var student = new Object();
创建对象,但对象此时内容为空
添加属性和方法:
student.name = '宋';
student.sex = '男';
student.age = 18;
student.think = function(){
alert('我认为还是不行')
}
注意:
- Object() 函数的第一个字母大写
- new 关键字不能省略
4.工程模式创建对象
工厂模式是一种众所周知的设计模式,广泛应用于软件工程领域,用于抽象创建特定对象的过程。
function createPerson(name, age, job) { //创建函数,带有三个形参
let o = new Object(); //在函数内部声明对象
o.name = name; //调用函数时,将实参赋值给对象的属性
o.age = age;
o.job = job;
o.sayName = function() { //定义对象方法
console.log(this.name);
};
return o; //返回对象给函数
}
let person1 = createPerson("Nicholas", 29, "Software Engineer"); 将声明的对象赋值给变量
let person2 = createPerson("Greg", 27, "Doctor");
- 这里,函数 createPerson()接收 3 个参数,根据这几个参数构建了一个包含 Person 信息的对象。
- 可以用不同的参数多次调用这个函数,每次都会返回包含 3 个属性和 1 个方法的对象。
- 这种工厂模式虽 然可以解决创建多个类似对象的问题,但没有解决对象标识问题(即新创建的对象是什么类型)
5. 构造函数模式创建对象
构造函数
- 构造函数:是一种特殊的函数,主要用来初始化对象,即为对象成员变量赋初始值,它总与 new 运算符一起使用。我们可以把对象中一些公共的属性和方法抽取出来,然后封装到这个函数里面。
- 构造函数的封装格式:
构造函数实例:function 构造函数名(形参1,形参2,形参3) {
this.属性名1 = 参数1;
this.属性名2 = 参数2;
this.属性名3 = 参数3;
this.方法名 = 函数体;
}
function student(name,id,sex,grade){
this.name=name;
this.id=id;
this.grade=grade;
this.sayHi=function(){
alert('你好我是'+this.name);
}
}
构造函数调用格式:
var obj = new 构造函数名(实参1,实参2,实参3)
let my=new student('姓名','学号','性别','年级');
- 不能省略
new
- 构造函数首字母大写
- 函数内的属性和方法前面需要添加
this
,表示当前对象的属性和方法。 - 构造函数中不需要
return
返回结果。 - 当我们创建对象的时候,必须用 new 来调用构造函数。
new关键字的作用
- 在构造函数代码开始执行之前,创建一个空对象;
- 修改this的指向,把this指向创建出来的空对象;
- 执行函数的代码
- 在函数完成之后,返回this—-即创建出来的对象
构造函数内部的return
虽然构造函数不需要return返回结果,但构造函数中依然存在return
因为构造函数也是一个函数, 自然也可以有return语句, 不过和一般函数不太一样的是, 在构造函数中
- 如果return的是一个对象, 则会直接返回这个对象,
- 如果return的不是一个对象, 那在new时会忽略这个retrun, 转而返回this对象
注意: 如果不使用new命令, 此时构造函数是普通函数, 返回值的类型没有限制, 该是什么就是什么
6.2 对象的遍历
通过for-in
循环显示对象的所有属性
for (const propName in window) {
document.write(propName);
}
for (var 变量 in 对象名){}
console.log(变量) //输出变量里的 属性名
console.log(对象名[变量]) //此时k为变量里的 属性值
- 这个例子使用 for-in 循环显示了 BOM 对象 window 的所有属性。
- 每次执行循环,都会给变量 propName 赋予一个 window 对象的属性作为值,直到 window 的所有属性都被枚举一遍。
- 与 for 循环 一样,这里控制语句中的 const 也不是必需的。但为了确保这个局部变量不被修改,推荐使用 const。
- ECMAScript 中对象的属性是无序的,因此 for-in 语句不能保证返回对象属性的顺序。换句话说,76 第 3 章 语言基础 所有可枚举的属性都会返回一次,但返回的顺序可能会因浏览器而异。
- 如果 for-in 循环要迭代的变量是 null 或 undefined,则不执行循环体。
3. 实例成员和静态成员
实例成员
就是构造函数内部通过this添加的成员 如下列代码中uname age sing 就是实例成员,实例成员只能通过实例化的对象来访问
function Person(uname, age) {
this.uname = uname;
this.age = age;
this.sing = function() {
console.log('我会唱歌');
}
}
var unknow = new Person('another', 18);
console.log(unknow.uname);//实例成员只能通过实例化的对象来访问
静态成员
静态成员 在构造函数本身上添加的成员 如下列代码中 sex 就是静态成员,静态成员只能通过构造函数来访问
function Person(uname, age) {
this.uname = uname;
this.age = age;
this.sing = function() {
console.log('我会唱歌');
}
}
Person.sex = '男';
var unknow = new Person('another', 18);
console.log(Person.sex);//静态成员只能通过构造函数来访问