js面向对象编程基础

js面向对象


对象的引用

类型比较方式
     对象比较时,值跟引用地址都相同时才相等。
类型赋值方式
     对象赋值时,值跟引用地址都进行赋值操作。
浅拷贝与深拷贝
     实现对对象的复制操作。

var obj={name:'hello'};
var obj2=copy(obj);
function copy(obj){
	var  result={};
	for(var attr in obj){
		result[attr]=obj[attr];
	}
	return result;
}
//由于是copy的对象的子项不存在引用问题 属于浅copy
var obj={name :{age:20}}  //对象内存在对象所以
var obj2=copy(obj)
	obj2.name,age=30
//当执行copy这个函数 得到结果 obj.name.age=30;
//为了保证obj其值不改变 达到深copy效果 copy代码如下 需要进行递归
function copy(obj){
	var result={};
	for(var attr in obj){
		if(typeof obj[attr]=='object'){
			result[attr]=copy(object[attr]);
		}else{
			result[attr]=object[attr];
		}
	}
	return result;
}
//修改obj2 obj2.name.age=40; obj.name.age 不会改变达到深copy
//由于 使用obj=obj2 对象引用在内存中属于同一个地址值, obj2改变obj 也跟着变
// 为了解决这问题我们引入 copy(obj)方法

原型和原型链

原型

注: 原型链的最外层为Object.prototype,可通过控制台进行查看

function Foo(name){
	this.name=name;
}
Foo.prototype.showName=function(){
	console.log(this.name)
}
var obj=new Foo('hello');
var obj2=new Foo('hi');
console.log(obj.showName == obj2.showName)
//true  
__proto__:内部属性: 查找当前对象的原型对象
obj.__proto__==Foo.prototype;//true
console.log(Foo.prototype.__proto__==Object.prototype);//true;

原型链 举个栗子
function Foo(name){
//this.name=name;
}
//第一种情况Foo.prototype.name=‘hi’;
Object.prototype.name=‘nihao’;
Foo.prototype.showName=function(){
console.log(this.name);
};
var obj=new Foo(‘hello’);
console.log(obj.name);
//nihao
//第二种情况
Foo.prototype.name=‘hi’;
var obj=new Foo(‘hello’);
console.log(obj.name);
//hi

系统对象与包装对象

系统对象
JavaScript语言本身就是基于面向对象的程序,最大的对象为window对象。内置了很多系统对象,如:数组、时间、正则等。
包装对象
基本类型如:字符串、数字、布尔值等都具备对应的包装对象。可以通过包装对象来获取提供的属性 与方法。

var arr=[1,2,3];
//我们可以覆盖系统自带的方法
	Array.prototype.push=function(){
			//this->[1,2,3]
			for(var i=0;i<arguments.length;i++){
				this[this.length]=arguments[i];
			}
			return this.length;
	};
	arr.push(4,5,6);
	console.log(arr);
	
	var obj=new String(' hello ');
	//obj.trim();
	自己重写 String trim 函数
String.prototype.trim=function(){
	return this.replace(/^\s+|\s+$/g,' ');
};
console.log(obj.trim());

var str='hello';
str.trim()->new String()->trim()

data = pd.read_csv(
    'https://labfile.oss.aliyuncs.com/courses/1283/adult.data.csv')
print(data.head())

面向对象相关语法

在JavaScript中提供了很多跟面向对象相关的语法。这些语法可以辅助我们进行面向对象开发。

 constructor
 		原型对象下唯一默认自带的属性,属于查看对象的构造函数。
 instanceof
 		左边是实例对象,右边构造函数。它会检查右边构建函数的原型对象,是否在左边对象的原型链上。
 in与for...in
 		in运算符返回一个布尔值,表示一个对象是否某个属性。for...in循环可获得对象的所有可枚举属性。
function Foo(){
}		
//Foo.prototype.constructor=Foo;
 Foo.prototype={
		showName:function(){},
		constructor: Foo
	};		 	
     var obj=new Foo();
	 console.log(obj.constructor);
	
function Foo(){
}
var obj=new Foo();
console.log(obj instanceof Object); //true
console.log(obj instanceof Foo);//true
//第一种情况
console.log(obj instanceof Bar);//false;
<script>
//第二种情况 创建一个函数
function Bar(){};
Foo.prototype=Bar.protoype;
var obj=new Foo();

console.log(obj instanceof Bar);//true
<script/>

in 与for…in
in运算符返回一个布尔值,表示一个对象是否具有某个属性。for…in 循环可获得对象的所有可枚举属性。
function Foo(){
this.name=‘hello’;
}
var obj=new Foo();

console.log(‘name’ in obj); //属性需要引号包括起来

		继承方式
			拷贝继承
			类式继承
			非构造函数继承
		多态
			重写继承的方法。
			配置对象。
//
function Foo(){  //父类
			this.name='hello';
}
			Foo.prototype.showName=function(){
				console.log(this.name);
};
function Bar(){
	Foo.call(this);
	this.age=20;
}
extend(Bar,Foo);
Bar.prototype.showAge=function(){
	console.log(this.age);
}
function extend(subs,sups){
		for(var attr in sups.prototype){
			subs.prototype[attr]=sups.prototype[attr];
		}
}
var obj1=new Foo();
var obj2=new Bar();
console.log(obj1);
console.log(obj2);	//拷贝继承
//类式继承
function Foo(){  //父类
			this.name='hello';
};
Foo.prototype.showName=function(){
				console.log(this.name);
};
function Bar(){
	Foo.call(this);
	this.age=20;
}
extend(Bar,Foo);
Bar.prototype.showAge=function(){
	console.log(this.age);
};
function extend(subs,sups){
	var F=function(){};
	F.prototype=sups.prototype;
	subs.prototype=new F();
	subsprototype.constructor=subs;
}

var obj1=new Foo();
var obj2=new Bar();
console.log(obj1);
console.log(obj2);

//非构造函数 继承操作
var foo={
	name:'hello'
};
var bar=extend(foo);
function extend(sups){
	var result={};
	for(var attr in sups){
		result[attr]=sups[attr];
	}
	return result;
}
console.log(bar);
bar.name='hi';
console.log(bar);
console.log(foo);	

var  foo= {
	name:'hello'
	};
var bar=extend(foo);
function extend(sups){
	function F(){}
	F.prototype=sups;
	return new F();
}
console.log(bar);
bar.name='hi';
console.log(bar);
console.log(foo);			
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值