创建对象的几种方法

字面量方式创建对象

写了几种字面量方式创建对象的方法~~~~


基本写法

1
2
3
4
5
6
7
8
9
10

var person = {
name:'July',
age:22,
from:Ningbo,
getName:function() {
console.log(this.name);
}
}


存在的问题

1.代码复用性差
2.如要创建大量的同类型的对象,则需要重复大量的代码。

内置构造函数创建对象

JS中的内置构造函数

String,Number,Boolean,Array,Date,Function,Object,RegExp

基本写法

1
2
3
4
5
6
7
8
9

var person = new Object();
person.name = "July";
person.age = 22;
person.from = 'Ningbo';
Person.say:function() {
console.log(this.name);
}


存在的问题

1.创建的对象复用性差,无法复用。
2.如果需要创建同一类型的对象,需要写大量重复性代码。

工厂函数创建对象

基本写法

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23

function createPerson(name,age,from,hobby) {
var person = new Object();
person.name = name;
person.age = age;
person.from = from;
person.hobby = hobby;
person.say = function() {
console.log(this.name);
};
return person;
};
//使用工厂函数创建对象
var person1 = createPerson('July',22,'Ningbo','eat');
var person1 = createPerson('小明',20,'Shanghai','run');
var person1 = createPerson('小红',15,'Xinjiang','sleep');
var person1 = createPerson('July',22,'Guangdong','read');
//打印调用对象的方法
console.log(person1.name);
console.log(person2.name);
console.log(person3.name);
console.log(person4.name);


工厂函数说明

工厂函数方式创建对象就是对内置构造函数创建对象的过程进行了封装,适用于大量生产同类型的对象。
{% codeblock %}
		function createPerson(name,age,from,hobby) {
			var person = new Object(); //原料
				//创建对象设置属性和方法,进行加工
				person.age = age;
				person.from = from;
				person.hobby = hobby;
				person.say = function() {
					console.log(this.name);
				};
				return person; //原料出厂
		}

{% endcodeblock %}

思路

把固定不变的封装起来,变化的为函数的参数

工厂函数创建对象实现过程

1.提供一个构造函数
2.在函数内部用new关键字创建一个对象
3.设置对象的属性和方法
4.返回对象

自定义构造函数创建对象

基本写法

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
function Person(name,age,from,hobby) {
// var this = new Object(); 默认创建一个对象并赋值给this
this.name = name;
this.age = age;
this.from = from;
this.hobby = hobby;
this.say:function() {
console.log(this.name);
}
// return this 默认返回一个对象
}
自定义构造函数创建对象
var p1 = new Person('July',22,'Ningbo','eat');
var p2 = new Person('小明',20,'Shanghai','run');
var p3 = new Person('小红',15,'Xinjiang','sleep');
var p4 = new Person('July',22,'Guangdong','read');


构造函数与new关键字

构造函数与普通函数的区别:函数的首字母大写。
构造函数的作用:完成对象的初始化。
new关键字的作用:用于创建对象(new Object());

自定义构造函数和简单工厂函数的对比

1.函数的首字母大号(用于区别构造函数和普通函数)
2.创建对象的过程是new关键字实现
3.在函数内部会自动创建新对象,并且赋值给this
4.自动返回创建出来的对象

构造函数的执行过程

1.使用new关键字创建对象
2.把新创建的对象赋值给this
3.在构造函数内部使用this为新创建的对象设置属性和方法
4.默认返回新创建的对象(普通函数如果不显示return则返回undefined)

构造函数的返回值

1.如果在构造函数中没有显示return,则默认返回新创建的对象
2.如果在构造函数中显示return
    1.return的是对象,则直接返回该对象,覆盖新创建的对象
    2.return的是null或是基本数据类型,则返回新创建的对象

构造函数的问题

每次创建对象,都要创建函数,对象方法内部实现的一模一样,则造成了资源浪费

对象类型

检查对象类型:instanceOf 获取对象的类型:Object.prototype.toString.call(obj)

对象的构造器属性

function Person(name) {
    this.name = 'July';
}
console.log(this.constructor);
属性的名称:constructor
属性的作用:指向创建对象的构造函数

构造函数的调用

1.构造函数可以像普通函数一样不通过new关键字来调用
2.在使用构造函数创建对象的时候,如果没有传递参数,则可以省略括号

this

1.如果使用new构造函数的方式调用,则this的指向内部创建的新对象
2.如果像普通函数一样调用构造函数,则this指向全局对象window
文章目录
  1. 1. 内置构造函数创建对象
  2. 2. 工厂函数创建对象
,
//