JavaScript对象的多种创建方式

2023年5月17日 128次阅读 来源: CHJ_1993

2017年2月21日20:37:56 CHJ_1993

对象在很多开发语言中其为重要，在之前我们学过如何创建字符串、数组、一个数字，等多种类型的数据，但是前面我们所创建的仅仅可以简单的认为是一下简单的数据类型。然而在JavaScript中数据类型常常被分为两种数据类型，简单数据类型和复杂类型。

在复杂数据类型中，对象（Object）占着一个其为重要的角色，那么如何创建一个对象呢 ？下面我来介绍集中方法。

1.对象字面量直接创建

我们学过 字符串的创建方法： var a = “”; 数组的创建方法： var arr = []; 这种就是字面量直接创建的方法

那么字符串，数组都可以用这么简单的方法创建，那么对象能不能这样创建呢？ 一样是可以的

格式： var obj = {};

下面我们先来看一段代码：

var obj = {}; //创建一个空的对象
//创建一个名为 dog 的对象，自定义的属性有 name 和 color
var dog = {
  name:"猫",
  color:"yellow"
}
alert(dog.name) //这样就可以输出dog的名字

看看上面简单吧,那么我们在之前学字符串的时候可以通过 new 关键字来创建，那么对象也可以通过这种方式创建

  1. 通过new 关键字创建

语法： var obj = new Object()

同样我们也可以通过这种方式来创建一个空的对象，然后想里面添加属性，下面来看代码

var person = new Object(); //创建一个名为 person 的一个空对象

//给person对象添加一些属性
person.name = '李二妹';
person.age = "20";
person.hair = "black";

通过这种方式创建，也是很方便，但是有时候没办法满足我们项目的需求，比如我们需要多个有一些相同基础属性的对象，那么我们一样的代码就要复制很多次，那么我们也可以通过函数(也可以叫工厂模式创建)的方式来创建

3.通过封装函数的方式创建对象

语法： function functionName(){创建对象的代码}

下面我们来看看通过封装函数的方式创建对象是如何完成的

//创建一个person对象，那么我们都知道人，都有姓名，性别，年龄等一些想同属性，如果我们创建多个人那么
//这种方式就很方便了
function createPerson(name,age,sex){
    var obj = new Object(); //通过new Object()方式创建一个对象
    obj.name = name;      //给该对象添加一些基础属性
    obj.age = name;
    obj.sex = sex;
    return obj;  //返回一个对象
}

var p1 = createPerson("张三");  //这样 就创建了一个p1对象

通过上面的方式，现在们可以知道用三种方式来创建对象了，那么你们有没有发现，现在这些对象如果的类型都是Object,那么如果我们又想定义一个对象，但是又不想是Object类型的呢？那么就来看接下来要介绍的一种方法。

4.自定义构造函数方式创建

什么是自定义构造函数方式创建呢？其实在JavaScript这种弱类型语言中，构造函数跟我们常常用的普通函数一样，都是通过function 关键字的，但是两者之间的区别是是什么：

构造函数： var con = new Constructor();

通过 new 关键字来使用

普通函数： functionName()

直接调用就是普通函数

说了这么多，大家还是懵懂，下面我们用代码来演示

//定义一个函数,此时只是一个普通的函数
function  Person(name,age,sex){
  this.name = name;
  this.age = age;
  this.sex = sex;
}

//通过new 关键词来调用
var p1 = new Person("张三",20,"男");  
//此时 p1 就是一个对象，同样Person 就是一个构造函数，
//注意 ： 此时p1的类型不是Object  而是Person

上面的就是利用创建函数创建一个对象，那么常用的四种函数的创建方式就是这样了

您的浏览，是我奋斗分目标

    原文作者：CHJ_1993
    原文地址: https://www.jianshu.com/p/1d2e6a327ef5
    本文转自网络文章，转载此文章仅为分享知识，如有侵权，请联系博主进行删除。
点赞