创建对象的几种方式：
1.字面量方式
2.工厂模式
3.构造函数模式
4.原型模式
一：对象字面量方式
var obj1 = {};
obj1.name = '张三';
obj1.age = '1';
obj1.sex = '男';
var obj2 = {};
obj2.name = '李四';
obj2.age = '2';
obj2.sex = '男';
console.log(obj1);
console.log(obj2);
缺点：创建多个对象时，需要重复代码，不能复用。
二：工厂模式(利用函数创建对象)
function createFactory(id, name, sex, age) {
// 创建空对象
var obj = new Object;
//添加属性
obj.id = id;
obj.name = name;
obj.sex = sex;
obj.age = age;
//返回对象
return obj;
}
var obj3 = new createFactory('01', '王五', '男', '1');
var obj4 = new createFactory('02', '王六', '女', '2');
console.log(obj3);
console.log(obj4);
作用：批量创建同类型对象，降低代码冗余度。
缺点:创建出的新对象，不知道是什么Person或者Animal类型，需看函数内部代码。
三：构造函数模式(利用类创建对象)
构造函数是一种特殊的函数，主要用来初始化对象，即为对象成员变量赋初始值，它总与 new 一起使用。一般情况下我们会把公共的属性定义到构造函数里面，而公共的方法放到原型对象身上。
知识点：
new 在执行时会做四件事情
1.在内存中创建一个新的空对象。
2.让构造函数中的 this 指向这个新的对象。
3.执行构造函数里面的代码，给这个新对象添加属性和方法。
4返回这个新对象（所以构造函数里面不需要 return ）。
function Person(uname, age) {
this.uname = uname
this.age = age
this.sing = function () {
console.log('我会唱歌')
}
}
var person1 = new Person('刘德华', 3);
var person2 = new Person('张学友', 4)
console.log(person1);
person1.sing();
console.log(person2);
person1.sing();
console.log(person1.sing == person2.sing);
注意：person1.sing和person2.sing这两个方法不是同一个Function实例，因为每次定义函数时，都会初始化一个对象。在实例化时，如果不想传参数，那么构造函数后面的括号可加可不加，var person1=new Person也可以实例化。只要有 new 操作符，就可以调用相应的构造函数。
作用：用于创建特定类型对象。
缺点：每创建一个实例都要开辟一个内存空间来存放同一个方法，浪费内存。可通过第四中方法原型方法来解决此问题。
构造函数模式与工厂模式的区别：
1.构造函数没有显示的创建对象。
2.将属性和方法添加到this上。
3.没有return。
4.构造函数名字的第一个字母大写。
5.构造函数需与new一起使用，来创建对象。
四：原型模式(利用函数的prototype创建对象)
function Person1(uname, age) {
this.uname = uname
this.age = age
}
Person1.prototype.sing=function(songName){
console.log(this.uname+'会唱'+songName);
}
var person3 = new Person1('刘德华', 3);
var person4 = new Person1('张学友', 4)
console.log(person3);
person3.sing('爱你一万年');
console.log(person4);
person4.sing('吻别');
console.log(person3.sing == person4.sing);
注意：person3.sing 和 person4.sing是通过__proto__属性继承Person1.prototype上的sing方法。
平常工作中，构造函数模式和原型模式组合使用比较多。
作用:原型对象上面定义的属性和方法可以被对象实例共享。
相关原型链链接请参考：原型链_xiaoxiao无脸男的博客-CSDN博客
以下是全部代码：文章来源：https://www.toymoban.com/news/detail-400710.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script>
//一：字面量方式
var obj1 = {};
obj1.name = '张三';
obj1.age = '1';
obj1.sex = '男';
var obj2 = {};
obj2.name = '李四';
obj2.age = '2';
obj2.sex = '男';
console.log(obj1);
console.log(obj2);
//二：工厂模式
function createFactory(id, name, sex, age) {
// 创建空对象
var obj = new Object;
//添加属性
obj.id = id;
obj.name = name;
obj.sex = sex;
obj.age = age;
//返回对象
return obj;
}
var obj3 = new createFactory('01', '王五', '男', '1');
var obj4 = new createFactory('02', '王六', '女', '2');
console.log(obj3);
console.log(obj4);
//三：构造函数模式
function Person(uname, age) {
this.uname = uname
this.age = age
this.sing = function () {
console.log('我会唱歌')
}
}
var person1 = new Person('刘德华', 3);
var person2 = new Person('张学友', 4)
console.log(person1);
person1.sing();
console.log(person2);
person1.sing();
console.log(person1.sing == person2.sing);
//四：原型模式
function Person1(uname, age) {
this.uname = uname
this.age = age
}
Person1.prototype.sing=function(songName){
console.log(this.uname+'会唱'+songName);
}
var person3 = new Person1('刘德华', 3);
var person4 = new Person1('张学友', 4)
console.log(person3);
person3.sing('爱你一万年');
console.log(person4);
person4.sing('吻别');
console.log(person3.sing == person4.sing);
</script>
</body>
</html>
文章来源地址https://www.toymoban.com/news/detail-400710.html
到了这里，关于前端中对象的几种创建方式的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！
