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);