← 返回首页
Javascript基础教程(二十六)
发表时间:2020-03-31 00:03:08
讲解Javascript的构建对象

javascript 创建对象简单说,无非就是使用对象或各种自定义对象,当然可以使用JSON;但写法有很多种,也能混合使用。

我们给出以下四种常见的创建对象的方式: - 对象字面量的方式 - 构造函数法 - 使用工厂方式 - 混合模式(原型和构造函数)

Javascript中以下三种方式都可以创建一个空对象:


  let person1 = {}; //创建了一个对象。
  let person2 = new Object(); //创建了一个对象。
  let person3 = Object.create(Object.prototype);//Object.create

  console.log(person1);
  console.log(person2);
  console.log(person3);

1.字面量创建对象

字面量创建对象的缺点:一次性对象,不方便修改,不利于提高效率,一般不建议使用。 字面量创建的对象从object.prototype继承而来的属性。

<script>
   let person = {};
   person.name = '张三';
   person.age = 18;
   person.addr = '西安市';
   console.log(person);
   console.log(person instanceof Object);
</script>

运行结果:

但是上面的写法还不够标准,推荐下面的定义方式:

<script>
   let person = {
       name: '张三',
       age :18,
       addr: '西安市',
       sayHello:function(){
           console.log("hello,my name is "+this.name);
       }
   };
   person.sayHello();
   console.log(person);
   console.log(person instanceof Object);
</script>

运行结果:

2.构造函数法

用构造函数可以创建特定类型的对象,同时也可以创建自定义的构造函数。 注意:如果不写new,这就是一个普通函数(方法调用),它返回undefined。但是,如果写了new,它就变成了一个构造函数,它绑定的this指向新创建的对象,并默认返回this。

<script>
   function Person(name,age,addr){
       this.name = name;
       this.age = age;
       this.addr = addr;
       this.sayHello=function(){
           console.log("hello,my name is "+this.name);
       }
   }
   let person = new Person('张三',18,'西安市');
   person.sayHello();
   console.log(person);
   console.log(person instanceof Object);
   console.log(person instanceof Person);
</script>

运行结果:

3.使用工厂方式

例如:

<script>
    let person = new Object();
    person.name = '张三';
    person.age = 18;
    person.addr = '西安市';
    person.sayHello=function(){console.log("hello,my name is "+this.name);};
    person.sayHello();
    console.log(person);
    console.log(person instanceof Object);
</script>

其运行效果与字面量创建对象方式一样。

4.混合模式

<script>
    function Person(name,age,addr){
        this.name = name;
        this.age = age;
        this.addr = addr;
    }
    Person.prototype.sayHello=function(){console.log("hello,my name is "+this.name);}
    let person = new Person('张三',18,'西安市');
    person.sayHello();
    console.log(person);
    console.log(person instanceof Object);
</script>

其运行效果与构造函数方式一样。

Javascript创建对象如此灵活,真让人又爱又恨。其实,Javascript创建对象的方式还远远不止这四种,感兴趣的同学可以搜索更多相关资料。