前面我们提过对象的基本概述,对象的创建基本方法如下:

var obj={
    name:"孙悟空",
    age:18,
    gender:"男",
    sayName:function()
     {
     alert(this.name);
     }
                     
    };
    obj.sayName();

但是如果要创建大量的对象,这样写可实在是太慢了
所以下面来介绍搞效率的创建方法

工厂方式批量生产对象

通过该方法可以大批量的创建对象

function createPerson(name,age,gender)
{
    //创建一个新的对象
    var obj=new Object();
    //添加属性
    obj.name=name;
    obj.age=age;
    obj.gender=gender;
    obj.sayName=function()
     {
           alert(this.name);
     };
    //将其返回
    return obj;
    }
var obj3=createPerson("saber",14,"女");
var obj2=createPerson("八戒",50,"男");
console.log(obj3);
console.log(obj2);
obj2.sayName();
obj3.sayName();

通过上述方式虽可以实现高效率生产对象,但是我们使用的构造函数都是Object,所以创建的对象都是object这个类型,就导致我们无法区分出多种不同类型的对象。
所以我们就用另一种方式

构造函数

构造函数就是普通函数,创建方式与普通的函数方式一样,不同的是构造函数习惯首字母大写,构造函数就是调用方式与普通函数不同,普通函数就是直接调用,而构造函数就需要new关键词来调用。

构造函数流程:

  1. 立刻创建一个新的对象。
  2. 将新建的对象设置为函数中this ,在构造函数中可以使用this来引入新建的对象。
  3. 逐行执行函数中的代码。
  4. 将新建的对象作为返回值返回。

创建一个Person类:

function Person(name,age,gender)
{
 this.name=name;
 this.age=age;
 this.gender=gender;
 this.sayName=function()
 {
   alert(this.name);
 }
}
//通过构造函数创建对象
var per=new Person("孙悟空",18,"男");
var per2=new Person("猪八戒",25,"男");
console.log(per);
console.log(per2);

使用同一个构造函数创建的对象,我们称之为一类对象,也将构造函数称之为一个类,我们将通过一个构造函数创建的对象,称之为该类的实例,比如dog就是Dog类的实例。上边的per就是Person类的实例。

使用instanceof来检查一个对象是否属于一个类的实例
语法:对象 instanctof 构造函数
如果是就返回true,否则flase

console.log(dog instanceof Person);
console.log(dog instanceof Object);
//所有的对象和Object做检查时都会返回true

完善构造函数

之在Person构造函数中为每一个对象都添加了一个sayName方法,目前我们的方法是在构造函数中创建的。也就是构造函数每执行一次就会创建一个sayName方法,也就是所有的实例sayName方法都是唯一的。但这完全没必要,完全可以使对象共享一个方法,解决方法,将方法在全局作用域中定义。
其实可以这样理解,之前在构造函数中创建方法就像我们给每个学生配一个厕所,一旦学生多了,这样实现会很困难的(代码中就是影响效率),但是你厕所相对于每个学生来说功能是一样的,那么为什么我们不建一个公共厕所来解决这个问题。

当然会想到将函数在全局空间中定义

function Person(name,age,gender)
{
    this.name=name;
    this.age=age;
    this.gender=gender;
    this.sayHello=fun;
}

function fun()
{
  alert("大家好,我是"+this.name);
}

但是将函数在全局空间中定义,污染了全局作用域的命名空间,而且也不安全。

所以我们可以通过原型对象来改良构造函数

function Person(name,age,gender)
{
    this.name=name;
    this.age=age;
    this.gender=gender;
    //添加一个方法,现在不用这样了
    //this.sayHello=fun;
}

//使用原型对象,
Person.prototype.sayHello=function()
{
    alert("大家好,我是"+this.name);
}

var per=new Person("渣渣辉",38,"男");
var per2=new Person("塔基八六亿",45,"男");
console.log(per2.sayHello());
console.log(per.sayHello());

这样在创建大量的对象时就会大幅代码的执行效率了。
原型对象的详解

Last modification:April 5th, 2020 at 10:16 pm
如果觉得我的文章对你有用,请随意赞赏