js 构造函数原理理解

构造函数内部原理

1、创建一个this对象
2、给this添加属性
this.xxx = ‘’ ‘’
3、返回this对象

function Person(name, age) {
	// this = {} 隐式地创建一个this对象
	this.age = age;
	this.name = name
	// retrun this; 隐式地返回this对象
}
var person = new Person('幽幽子', 10);
// 于是创建了一个对象 pserson: Person {name: '幽幽子', age: 10} 
// 给person添加一个属性
person.sex = 'male';
// 于是person的值变为:person: Person{name: '幽幽子', age: 10, sex: '男'}
// 再new一个person
var person2 = new Person('紫紫', 20);
// 此时person2的值为:person2: Person{name: '紫紫', age: 20}
// 注意: person2的属性里面没有sex,因为person和person2是两个相互独立的对象
// 构造函数Person相当于一个工厂,工厂生产的person都一样,拥有一样的属性和方法,
但每个person又相互独立互不影响,
他们可以分别添加自己后天的属性和方法,但只属于自己,并不共用。
如person添加了sex属性,但person2不会受影响,因此person2没有sex这个属性
// 当显示地改变构造函数的返回值
function Person(name, age) {
	// var this = {};
	this.name = name;
	this.age = age;
	return {};
}
var person = new Person('紫紫', 10);
// 此时person的值是一个空对象 Object {}

function Person(name, age) {
	// var this = {};
	this.name = name;
	this.age = age;
	return 123;
}
var person = new Person('紫紫', 10);
// 此时person的值是一个对象:person: Person{name: '紫紫', age: 10}
// 解释:可以隐式地改变构造函数的返回值,但是只能是引用类型地值(对象、数组、function),
原始值类型(number, string, undefined, null, Boolean)无效,返回的仍然是原来的this对象
(有 new 就不能返回原始值)
// 自己模拟一个构造函数
function Student(name, age) {
	var that = {};
	that.name = name;
	that.age = age;
	return that;
}
var student = Student('幽幽子', 10);
// student {name: '幽幽子', age: 10};

补充
创建对象地方式
1、直接创建一个对象
var obj = {}
obj.name = ‘幽幽子’
2、构造函数方式
a: 系统自带构造函数 Number()String()…
b: 自定义构造函数,如上面定义地Person

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值