js继承
1-------构造函数方式
2-----构造函数+原型方式
3----constructor
4-----构造函数的相关问题
1-------构造函数方式
<script>
// 对象就是把事物共有的属性提炼出来
// 构造函数,创建对象 function 构造函数名字(构造函数名字首字母一般要大写){}
function Student(name,age){
this.name=name;
this.age=age;
this.eat=function(){
console.log(this.name+'晚上吃了什么呀?');
}
}
// 实例化对象
/*
调用new关键字的时候,
第一步:首先生成一个空对象
第二步:构造函数中的this指向当前对象
第三步:执行构造函数代码
*/
var stu=new Student('zs',12);
stu.eat()
var stu1=new Student('LS',14);
stu1.eat();
// 书写Product构造函数
var p=new Product('口红',200,'404');
p.buy();
</script>
2-----构造函数+原型方式
<script>
// 构造函数+原型方式
function Product(title,color){
this.title=title;
this.color=color;
// this.buy=function(){
// console.log('buy')
// }
}
// 每一个构造函数,都有一个prototype属性/对象,该属性所有的方法和属性都能被构造函数继承
Product.prototype.buy=function(){
console.log('buy')
}
Product.prototype.joinCar=function(){
console.log('加入购物车')
}
// 一般情况下,属性类的放置在构造函数内部,方法类的放置在prototype内部
var flight=new Product('无人机','银色');
var kh=new Product('口红','404');
// 如果实例对象没有自己对应的方法,会去构造函数的prototype内部寻找。如果能找到就会执行该方法
flight.buy();
flight.joinCar()
console.log(flight.buy==kh.buy);
</script>
3----constructor
function Product(title,color){
this.title=title;
this.color=color;
this.buy=function(){
alert('确认购买'+this.title)
}
}
Product.prototype.buy=function(){
console.log('buy')
}
Product.prototype.joinCar=function(){
console.log('加入购物车')
}
var p=new Product('口红','401');
console.log(p)
// 相当于重写了Product.prototype 丢失了constructor
Product.prototype={
// 可以手动加上constructor
constructor:Product,
buy:function(){
console.log('buy')
},
joinCar:function(){
console.log('joinCar')
}
}
var p=new Product('口红','401');
console.log(p.constructor==Product)
4-----构造函数相关问题
<script>
function Product(title,color){
this.title=title;
this.color=color;
this.buy=function(){
alert('确认购买'+this.title)
}
}
Product.prototype.buy=function(){
console.log('buy')
}
Product.prototype.joinCar=function(){
console.log('加入购物车')
}
var flight=new Product('无人机','银色');
var kh=new Product('口红','404');
console.log(flight)
// 如果实例对象有自己的方法,执行自己的方法,不会再向上寻找。
// flight.buy();
// 实例对象的__proto__指向构造函数的prototype
console.log(flight.__proto__==Product.prototype);
flight.__proto__.joinCar=function(){
console.log('这是修改以后的加入购物车')
}
flight.__proto__.buy=function(){
console.log('这是修改以后的购买')
}
console.log(flight)
// flight.buy()
flight.joinCar();
var cat=new Product('小猫','黄色');
cat.buy();
cat.joinCar();
***// 实例对象.hasOwnProperty('属性')可以判断属性是自有的还是继承来的
console.log(cat.hasOwnProperty('buy'))
console.log(cat.hasOwnProperty('joinCar'))
console.log(cat.hasOwnProperty('title'))
var arr=new Array();
// 可以通过constructor找到实例对象的构造函数 在某些情况,不太好用
console.log(arr.constructor==Array)
console.log(cat.constructor==Product);
// 官方推荐的 使用 a instanceof b构造函数 判断a是否是通过b构造函数构造出来的
console.log(arr instanceof Array);***
</script>