JS第十讲--对象-CSDN博客

本文链接：https://blog.csdn.net/liuzizhoufaith/article/details/122831765

十、对象

(一)对象导读

(二)对象的概念

对象是一个具体的事物,万物皆对象.

如:班主任不是对象,咱们班的班主任是对象.

对象是一组无序的相关属性和方法的集合.所有的事物都是对象.例如字符串,数值,数组,函数等.

对象是由属性和方法组成的:

属性:事物的特征,在对象中用属性表示(用名词)
方法:事物的行为,在对象中用方法表示(用动词)

保存一个值用变量,保存一组值用数组,保存一组不同类型的信息用对象.

(三)用字面量创建对象

创建对象有三种方式:

利用字面量创建对象
利用new Object创建对象
利用构造函数创建对象

利用字面量创建对象:

对象字面量:就是花括号{}里面包含了表达这个具体事物(对象)的属性和方法.

创建对象:
```
var obj={
    uname: '张三丰',
    age: 18,
    sex: '男',   //这三个是属性
    sayHi: function(){
        console.log('hi');
    }           //这个是方法
};
```
里面的属性或方法采用键值对的形式.属性名:属性值

多个属性名和方法中间用逗号隔开

方法冒号后面跟的是匿名函数

使用对象
- 调用对象的属性
  
  (1) 对象名.属性名
```
console.log(obj.uname);
```
  (2) 对象名['属性名']
```
console.log(obj['age']);
```
- 调用对象的方法 sayHi 对象名.方法名千万别忘记添加小括号
```
obj.sayHi();
```

(四)变量属性方法函数的区别

变量与属性:

相同点:
- 都是用来存储数据的
不同点:
- 变量单独声明并赋值,单独存在
- 属性是在对象中,不需要声明.使用时必须是对象.属性

方法和函数:

相同点:
- 都是实现某种功能

不同点:
- 函数是单独生命并调用,单独存在函数名()
- 方法在对象里,调用时是对象.方法()

(五)用new Object创建对象

与new Array()原理一致

使用方法:

var obj=new Object(); //创建了一个空对象
obj.uname='张三丰'; //追加属性
obj.age=18;
obj.sex='男';
obj.sayHi=function(){
    console.log('hi');
}

利用等号赋值的方法,添加对象的属性和方法

每个后面是分号结尾

调用方法与字面量创建的一样.

(六)构造函数

前面两种创建对象的方式都是只能创建一个对象,如果想创建一组具有相同属性类型的对象,就需要构造函数.

这个函数不一样,里面封装的不是普通代码,而是对象.它就是把对象里面一些相同的属性和方法抽象出来封装到函数里面.

构造函数:是一种特殊的函数,主要用来初始化对象,即:为对象成员变量赋初值.它总与new运算符一起使用.我们可以把对象中一些公共的属性和方法抽取出来,然后封装到这个函数里面.

利用构造函数创建对象:

语法:

function 构造函数名(){
    this.属性=值;
    this.方法=function(){
        方法体;
    }
}
//使用:
var 对象=new 构造函数名();

四大天王共同属性:名字,年龄,性别. 共同方法:唱歌

function Star(uname,sex,age){
    this.name=uname;
    this.age=age;
    this.sex=sex;
    this.sing=function(sang){
        console.log(sang);
    }
}
var liu=new Star('刘德华','男',18);
console.log(liu.name);
liu.sing('冰雨');

注意:

构造函数名字首字母要大写!!!

构造函数不需要return就可以返回结果

调用构造函数必须使用new
我们只要new Star()一次,就创建了一个对象
我们的属性和方法前面前面必须写this,this指向在创建的对象

(七)构造函数和对象的联系

对象是一个具体的事物

构造函数时泛指的某一大类,类似于java里的类(class)

我们利用构造函数创建对象的过程,也称为对象的实例化

因此,对象也叫实例

(八)new关键字执行过程

当构造函数遇到new之后,会在内存中创建一个空的对象.
this就会指向刚才创建的空对象
执行构造函数里的代码给这个空对象添加属性和方法
返回这个对象.

构造函数不需要return是因为new关键字默认返回一个对象

(九)遍历对象

var obj={
    name: 'liu',
    sex: 'male',
    age: 18
};

如何输出这个对象的所有属性?

for...in语句,可以遍历对象

for(var 变量 in 对象){
    
}

于是乎:

for(var k in obj){
    console.log(k); //输出变量,得到的是属性名
    console.log(obj[k]); //obj[k],得到的是属性值
}

for...in里面的变量名,一般用k或者key

如果里面有方法,也会遍历出来.