JS-对象

168 阅读5分钟

一.什么是对象?为什么需要对象?

1.1什么是对象?

对象一定是一个具体的事物

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

属性:事物的特征,在对象中用属性来表示

方法:事物的行为,在对象中用方法来表示

1.2为什么需要对象?

保存一个值可以使用变量,保存多个值可以使用数组,如果保存一个人的完整信息呢? 用数组的话会不够清晰,如

var arr=['小明','男',18,180];

而使用JS中的对象会更加的清晰。

二.创建对象的三种方式

创建对象的三种方式:

  1. 利用字面量创建对象
  2. 利用new object 创建对象
  3. 利用构造函数创建对象

2.1利用字面量创建对象

(1)利用对象字面量创建对象{}

a.var obj={} 创建一个空的字面量

b.里面的属性或者方法我们采取键值对的方式 键 属性名: 值 属性值

c.多个属性或方法之间用逗号隔开

d.方法冒号后面跟一个匿名函数

(2)使用对象

a.调用对象的属性,我们采用对象名.属性名的方式

console.log(obj.uname);

b.调用属性还有一种方法 对象名['属性名'] 必须加引号

console.log(obj['age']);

c.调用对象的方法sayhi,对象名.方法名() 千万别忘记添加小括号!!!

obj.sayhi();

字面量创建变量代码演示

var obj = {
            uname: '小明',
            age: 18,
            sex: '男',
            sayhi: function () {
                console.log('hi');
            }
        }

2.2利用new Object创建对象

a.创建一个新的对象

b.我们利用 等号=赋值的方法 添加对象的属性和方法

c.每个属性和方法之间用分号分隔开

new Object代码演示

var obj = new Object();  
        obj.uname = '张三丰';
        obj.age = 18;
        obj.sex = '男';

2.3利用构造函数创建对象

为什么需要构造函数?

a.因为前面两种创建对象的方式一次只能创建一个对象。 这样需要重复创建基本相同的对象,所以我们选择构造函数

b.因为我们创建一次创建一个对象,里面大量的方法和属性都是相同的,我们只能复制

c.因为我们可以利用函数的方法,重复这些相同的代码,我们就把函数称为构造函数

d.又因为这个函数不一样,里面封装的不是普通变量,而是对象

e.构造函数 就是把函数里面的一些相同属性和方法抽象出来放到函数里面

构造变量的语法结构:

function 构造函数名(){
            this.属性=值;
            this.方法=function(){}
        }
        new.构造函数名();

注意注意

1.构造函数名的首字母要大写

2.我们构造函数不需要return就可以返回结果

3.我们调用构造函数必须使用new

4.我们只要new Star()调用一个函数就创建一个对象

5.我们属性和方法前面必须添加this

构造函数创建对象代码演示

function Star(uname, age, sex) {
            this.name = uname;
            this.age = age;
            this.sex = sex;
            this.sing = function (sang) {
                console.log(sang);
            }
        }
        var ldh = new Star('刘德华', 18, '男');
        // console.log(typeof ldh);
        console.log(ldh.name);
        console.log(ldh['age']);
        ldh.sing('冰雨')
        var zxy = new Star('张学友', 19, '男');
        console.log(zxy.name);
        console.log(zxy['sex']);
        zxy.sing('李香兰');

构造函数和对象

1.构造函数 泛指的某一大类 它类似于java语言里面的类(class)

2.对象 特指 是一个具体的事物

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

new关键字执行的过程

1.new构造函数可以在内存中创建一个空的对象

2.this就会指向刚刚创建的空对象

3.执行构造函数里面的代码 给这空对象添加属性和方法

  1. 返回这个对象

三.变量与属性 函数与方法的区别

3.1变量与属性

相同点:他们都是用来存储数据的

不同点:

变量是单独声明并赋值的 使用时直接写变量名,单独存在

属性 在对象里面不需要声明 使用的时候,必须是对象.属性

###3.2 函数和方法

相同点:都是实现某种功能做某件事情

不同点:

函数是单独声明并且调用的 函数名()单独存在

方法 在对象里面 调用的时候 对象.方法

        // 变量
        var num = 10;
        var obj = {
            // 属性
            age: 10,
            // 方法
            fn: function () {

            }
        }

        // 函数
        function fn() {

        }

四.遍历对象

for in 遍历我们的对象

for(变量 in 对象) {

        }

我们使用for in里面的变量 我们喜欢写k 或者key

 var obj = {
            name: '小明',
            age: 18,
            sex: '男',
            fn: function () {

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

k变量输出得到的是属性名(age,name,sex...)

obj[k]得到的是属性值(‘小明’,18,‘男’...)

五.小结

1.对象可以让代码更清晰

2.对象是复杂数据类型object,我们前面学了五个简单数据类型,undefined,null,string,Boolean,number

3.本质:对象就是一组无序相关属性与方法的集合

4.构造函数泛指一大类,如苹果,不论什么种类统称为苹果

5.对象实例特指一个事物,如一个苹果

6.for(变量 in 属性)用于对象循环遍历操作