js继承之构造函数继承
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<!-- 构造函数实现 -->
<script>
function Super(){
// console.log(this); // window
this.a=[1,2,3,4];
}
Super.prototype.say=function(){
console.log(222);
}
function Sub(){
// console.log(this); // sub1
// this.a=[1,2,3,4];
// 如果是在 Sub函数里面写上 this.a=[1,2,3,4]; 这样肯定就不会出现 引用值共享 问题
// 但是我们不可能每次把 Super 里面的东西复制一遍
// 但是上面的效果相当于 执行了一遍 Super
// Super();
// 但是这里涉及到的 this的值就会有不同,直接 Super() 的this 是window
// 注意 Super() 这个里面的 this 是 window
// 而Sub函数里面,Super() 外面的this 是 sub1
// 所以我们想Super里面的this也是指向 sub外面的 this,即内外保持一致的 this
// 因为我们的需求是要为 sub1 和 sub2 分别绑定a属性,不让他们共同引用
// 所以采用下面这个方式
// 这一步就是构造函数继承的关键
Super.call(this); // 将外部的this绑定到了内部的this,一样了
}
var sub1=new Sub();
var sub2=new Sub();
console.log(sub1);
console.log(sub2);
// sub1.a='333';
sub1.a.push(5);
console.log(sub1);
console.log(sub2);
/**
* 此时现在 sub1和 sub2 直接是 Sub 的实例,和 Super.prototype 没有任何关系
* 所以构造函数继承没办法拿到另一个原型上的方法,但是能解决共同引用的问题
*/
</script>
<!-- 构造函数继承:问题:没办法拿到原型上的方法
解决构造函数的额问题:使用组合继承(伪经典继承) -->
<script>
</script>
</body>
</html>
欢迎指正