对象的创建及继承

本文介绍了JavaScript中创建对象的几种方法,包括字面量、工厂模式、构造函数、原型、构造器+原型以及ES6的class。同时,详细讨论了继承的概念,包括原型链继承、call继承、组合式继承和ES6的super及extends。每种方式都有其优缺点,如字面量创建适用于少量对象,构造函数可能导致函数重复等。
摘要由CSDN通过智能技术生成

JS中创建对象的方法
1、字面量创建对象(缺点:初始化的值都是一样的,优点:可以实现共享)
缺点就是:他们用同一个接口创建很多对象和,会产生大量的重复代码,如果你有500个对象,那么你就要输入500次很多相同的代码。
注意:在一个对象的方法中,如果有this,通过这个对象调用时方法中的this指的是对象

<script>
	let obj = {
	name:"wc";
	age"12;
	weight:this.age+10;//这个this表示window 
	}
	console.log(obj.weight)//NaN
</script>

2、使用工厂模式创建对象(可以产生很多对象,可以批量创建对象)
缺点:无法判断对象原型

<script>
	function creatRect(w,h){
	var obj = {};
	obj.width = w ;
	obj.height = h ;
	obj.getS = function(){
	return this.width * this.height ;
		}
	return obj;
	}
	var rect1 =creatRsct(1,2);
	console.log(rect1.getS());
	varr rect2 = creatRect(3,4);
	console.log(rect2.getS());
</script>

3、通过构造函数创建
构造函数执行的流程:
1 创建一个新的对象(遇到new 的时候)
2 将构造函数的作用域赋给新的对象(因此this就指向这个对象)
3 执行构造函数中的代码(为这个对象添加属性)
4 返回新对象
缺点:每个对象里面都有公用的函数,意味着每个实例都会重新创建这个函数。如果方法的数量很多,就会占用很多不必要的内存。

function Person(name,age,job)
{ this.name = name; 
this.age = age; 
this.job = job; 
this.sayName = function(){ alert(this.name); }; 
}
var person1 = new Person('Nike',29,'teacher');
var person2 = new Person('Arvin',20,'student');

4、原型创建对象
缺点:创建的对象中的每个属性都是共享的。对于一些实例的私有属性如name若使用共享的方式则没法对每个实例进行区分

function Person(){}
Person.prototype={
name:"NIke",
age:11,
sayName:function(){
alert(this.name);
 }
};

5、通过构造器+原型对象来创建
特点:将私有属性放在constructor构造函数里面,共有的方法放在原型

<script>
	function Rect(w,h){
	this.w = w ;
	this.h = h ;
	}
	Rect.prototype.getS = function(){
	return this.w;
	}
	var rect1 = new Rect(1,2);
</script>

6、ES6中通过class来创建类

JS中的继承
通过某种方式让一个对象去继承另一个对象的属性和方法。
1,原型链继承 (有两种实现方式)
(1)Chid.prototype = Parent.prototype
弊端:Chid.prototype.constructor 指向Parent,需要手动更改为Chid 。
(2)Child.prototype = new Parent()让子类的原型对象指向父类对象
弊端:Chid.prototype.constructor 指向Parent,需要手动更改为Chid。

<script>
	child.prototype = new Parent ;//这之后可以访问到父类的公有和私有属性
</script>

2、call继承(只能继承父类的私有属性)

<script>
	Parent.call(this);//其中this指向空对象  此代码会让Parent的this也指向这个空对象,从而可以访问到Parent的私有属性
</script>

3、组合式继承(子类可以继承父类的私有和公有属性)

<script>
	Parent.call(this);//继承私有属性
	Child.prototype = Object.creat(Parent.prototype);//让子类的原型对象指向父类的原型对象 只不过用的是通过Object.creat又克隆的一份,这样可以避免增添属性造成的错误
	Child.prototype.constructor = Child;//可以手动指向一下,避免代码出错
</script>

4、ES6中的继承
super:类似于call继承,只能继承私有属性
extends:类似于公有继承

<script>
	class Parent{
	constructor(){
	this.a=1;
			}
	}
	class Child extends Parent{
	constructor(){
	super();
	this.b=2;
			}
	}
</script>

创建对象方法详细介绍
对象详细介绍

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值