属性复制单继承多继承

最新推荐文章于 2023-12-26 17:55:05 发布

原创最新推荐文章于 2023-12-26 17:55:05 发布 · 152 阅读

0 ·

CC 4.0 BY-SA版权

本文介绍如何使用JavaScript实现浅拷贝，并通过遍历来完成对象的多继承，包括单继承和多继承属性复制的方法。

1. jq里面的extend可以深复制，我这里写的extend只能浅复制，只能复制值类型的属性，引用类型不可复制

// 单继承  对象属性复制（浅复制，只能复制值类型的属性，引用类型无法复制）
// 修改克隆对象的属性  原对象的属性也会改变
var extend = function(target,source){
	// 遍历源对象中的属性
	for(var property in source){
		// 将源对象中的属性复制到目标对象中
		target[property] = source[property];
	}
	// 返回目标对象
	return target;
}

var book = {
	name:'js',
	alike:['css','html','javascript'],
	f:function(){
		console.log(1);
	}
}

var book1 = {
	color:'red'
};
book1 = extend(book1,book);
console.log(book1);
book1.f();//1

2. 多继承利用遍历来继承多个对象的属性



// 多继承  属性复制
var mix = function(){
	var i = 1,//从第二个参数起为被继承的对象
		len = arguments.length,//获取参数长度
		target = arguments[0],//第一个对象为目标对象
		arg;//缓存参数对象
	// 遍历被继承的对象
	for (; i < len; i++) {
		arg = arguments[i];//缓存当前对象
		for(var property in arg){
			// 将被继承对象的属性复制到目标对象中
			target[property] = arg[property];
		}
	}
	return target;

}

var book = {
	name:'js',
	alike:['css','html','javascript'],
	f:function(){
		console.log(1);
	}
}

var book1 = {
	color:'red'
};

var book2 = {
	time:2014,
}
console.log(mix(book,book1,book2));//三者的属性都复制了

直接绑定到原生对象Object中所有对象都可以拥有这个方法

// 多继承  属性复制  绑定到原生对象object上  这样所有的对象就可以拥有这个方法了
Object.prototype.mix = function(){
	var i = 0,//从第二个参数起为被继承的对象
		len = arguments.length,//获取参数长度
		arg;//缓存参数对象
	// 遍历被继承的对象
	for (; i < len; i++) {
		arg = arguments[i];//缓存当前对象
		for(var property in arg){
			// 将被继承对象的属性复制到目标对象中
			this[property] = arg[property];
		}
	}
}

var book = {
	name:'js',
	alike:['css','html','javascript'],
	f:function(){
		console.log(1);
	}
}

var book1 = {
	color:'red'
};

var book2 = {
	time:2014,
}
var newBook = {};
newBook.mix(book,book1,book2);//三者的属性都复制了并赋值给Object的mix中
console.log(newBook);//三者的属性都复制了