JavaScript起步(十二-创建对象)| 一起学系列

109 阅读3分钟

携手创作,共同成长!这是我参与「掘金日新计划 · 8 月更文挑战」的第12天,点击查看活动详情

  • 创建对象方法1:对象字面量🤭

    • 创建一个对象最简单的方式是使用对象字面量赋值给变量,类似数组

    • 对象字面量的语法:{}

    • 内部可以存放多条数据,数据与数据之间用逗号分隔,最后一个后面不要加逗号😳

    • 每条数据都是由属性名和属性值组成,键值对写法:k:v

    • k:属性名;v:属性值,可以是任意类型的数据,比如简单类型数据、函数、对象var obj = {k: v, k: v, k: v, k: v};

  • 调用对象内部属性和方法的语法

    • 用对象的变量名加点.调用某个属性名,得到属性值:person1.name;

    • 在对象内部用this加点.调用属性名,this替代对象

    • 用对象的变量名后面加[]调用,[]内部是字符串格式的属性名:person1[“name”];person1[“sayHi”]();

    • 调用方法时,需要在方法名后加()执行:person1.sayHi();

  • 更改对象内部属性和方法的语法

    • 更改属性的属性值方法:先调用属性,再等号赋值:person1.age = 19;

    • 增加新的属性和属性值:使用点语法或者[]方法直接定义新属性,等号赋值:person1.height = 180;

    • 删除一条属性:使用一个delete关键字,空格后面加属性调用:delete person1.sex; image.png

  • 创建对象方法2🤭:var person1 = new Object();

    • new Object()创建对象:Object()构造函数,是一种特殊的函数,主要用来在创建对象时初始化对象,即为对象成员变量赋初始值,总与new运算符一起使用在创建对象的语句中

    1.构造函数用于创建一类对象,首字母要大写

    2.构造函数要和new一起使用才有意义

    • new在执行时会做四件事情:

      • new会在内存中创建一个新的空对象

      • new会让this指向这个新的对象

      • 执行构造函数 目的:给这个新对象加属性和方法

      • new 会返回这个新对象

    • 缺点:创建多个对象时,容易重复、冗余 image.png

  • 创建对象方法3🤭:工厂函数创建对象 

    • 如果要创建多个类似的对象,可以将new Object()过程封装到一个函数中,将来调用函数就能创建一个对象,相当于一个生产对象的函数工厂,用来简化代码 image.png

    • 因为创建的是局部对象,所以必须要有返回值,因为最终结果要输出一个对象。创建对象的方法也是直接var p1 = createPerson(“zs”,18,true)

    • 另一种方法也属于工厂函数的方法 image.png

  • 创建对象方法4🤭:自定义构造函数

    • 比工厂方法更加简单

    • 自定义一个创建具体对象的构造函数,函数内部不需要new一个构造函数的过程,直接使用this代替对象进行属性和方法的书写,也不需要return一个返回值

    • 使用时,利用new关键字调用自定义的构造函数即可

    • 注意:构造函数的函数名首字母需要大写,区别于其他普通函数名 image.png

    • 构造函数的生成过程:在构造函数内部先创建一个新对象var instance = new Object()。然后将函数内部的this指向了这个新对象this = instance。再执行构造函数内部的代码。最后将新对象作为返回值

    • 通过构造函数生成的实例是可以找到自己当初的构造函数的。

    • 每个对象的constructor属性值就是生成这个对象的构造函数(constructor属性,构造器、构造函数)直接打点调用。