当前位置: 首页 > news >正文

JS 原型与继承2

//***-、原型、原型链、构造函数 prototype、 proto_、constructor

function Foo(){this.a=1} var foo = new Foo();
Object.getPrototypeOf(foo);//访问对象原型 效果等同于,foo. proto ,只是更推荐使用 Es6的 Object.getPrototypeof()方式
// constructor是原型上的一个属性,指向的是构造函数,如果重写了原型,就需要给他定义一个 constructor让它指向构造函数,否则实例的 constructor就会指向object// 重写构造函数原型,需要手动设置 constructor 为当前构造函数 Foo.prototype = {
aa:1,
bb:function(){
console.log(20);
constructor:Foo //很有必要

//***二、继承
//<->、原型链继承 function Super() {
this.a = 11l;
this.b = [1,2,3,4];
Super.prototype.say = function () {
console.log(222);

function Sub({}
Sub.prototype == new Super();//实现:原型链继承

var subl = new sub(); var sub2 = new sub();
//实现的继承结果: subl -- Sub.prototype -- new Super() -- Super.prototype -- Object.prototype

//该方式存在问题(引用值共享问题): subl.b.push(5);
console.log(subl.b);//[1,2,3,4,5]
console.log(sub2.b) ;// [1,2,3,4,5] sub2的也被修改了

//<二>、构造函数继承 function Super() {
this.a =11l;
this.b = [1,2,3,4];
Super.prototype.say= function (){
console.log(222);}
function Sub(){
Super.call(this);//实现:构造函数继承

var subl = new sub); var sub2 = new sub();
//解决引用值共享问题 subl.b.push(5);
console.log(subl.b);//[1,2,3,4,5] console.log(sub2.b) ;// [1,2,3,4]
//该方法存在问题(没办法拿到原型上的方法say方法 )

//<三>、组合继承(伪经典继承)
//***伪经典的原因在于,Super()执行了2次 function Super() {
this.a = 111;
this.b = [1,2,3,4];

Super.prototype.say=function(() {
console.log(222);

function Sub(){
Super.call(this);//实现:构造函数继承
Sub.prototype == new Super();//实现:原型链继承
var subl = new Sub(); var sub2 = new sub();
/1 该方式,既能解决引用值共享问题,又能拿到Super.prototype上的其他方法
// 因为,创建实例前,先给Sub指定原型,这时候已经先 newSuper()执行了。此时sub原型上的this.b 就是 [1,2,3,4]
11 创建实例时,再去 new Sub()时,通过 Super.call(this),就会把前一步构造函数上所有this,b全部覆盖,此时虽然值相同,但是已经是两个不同的引用值了
subl.b.push(5);
console.log(subl.b);//[1,2,3,4,5] console.log(sub2.b);//[1,2,3,4]
//***<四>、寄生组合继承(经典继承) function Super() {
this.a = 11l;
this.b = [1,2,3,4];
Super.prototype.say = function(){
console.log(222);

function Sub(){
Super.call(this);//实现:构造函数继承 ----> 要解决引用值共享功能,所以必须要这样做

//Sub.prototype == new Super();//实现:原型链继承// 要点:通过 object.creat(),绕开new Super()
Sub.prototype =0bject.creat(Super.prototype);//返回一个对象,指定当前赋值对象的原型为传入的参数 //实现:原型链继承

/ 注意:Object.creat(),是Ess的方法,ES3不支持,会有兼容性问题,需要些兼容性方案
***Object.creat 的兼容性方案 if(!Object.creat) {
Object.creat = function(proto) {
function F() {};
F.prototype = proto; return new f();

var subl = new sub(); var sub2 = new sub();
subl.b.push(5);
console.log(subl.b);//[1,2,3,4,5] console.log(sub2.b) ;// [1,2,3,4]

// 寄生组合继承,依然存在的问题:
/ Sub.prototype-Object.creat(Super.prototype);此时重写了sub的原型,如果在这句执行之前,往sun原型中添加了其他原型方法,就会被覆盖导致不可用而报错

//***<五>、圣杯模式继承:

//***<六>、extends 关键字,直接实现继承(ES6解决方案): class Super() {}
class Sub() extends Super {}
//<七>、拷贝继承

http://www.lryc.cn/news/118132.html

相关文章:

  • 账号登录相关的一点随笔
  • 常见的一些BUG
  • ChatGPT在智能社交网络分析和关系挖掘中的应用如何?
  • 你不了解的Dictionary和ConcurrentDictionary
  • c++类模板,嵌套类模板,模板链表,动态数组
  • 【Flutter】【基础】CustomPaint 绘画功能,绘制各种图形(二)
  • YOLOv5修改注意力机制CBAM
  • 计算机网络 网络层 概述
  • 算法练习--动态规划 相关
  • JAVA volatile 关键字
  • [Leetcode] [Tutorial] 回溯
  • STM32 CubeMX USB_MSC(存储设备U盘)
  • 湘大 XTU OJ 1214 A+B IV 题解:数位移动的本质+布尔变量标记+朴素模拟
  • 以商业大数据技术助力数据合规流通体系建立,合合信息参编《数据经纪从业人员评价规范》团标
  • 【论文阅读】Deep Instance Segmentation With Automotive Radar Detection Points
  • 易服客工作室:如何创建有用的内容日历
  • Excel革命,基于电子表格开发的新工具,不是Access和Power Fx
  • “崩溃”漏洞会影响英特尔 CPU 的使用寿命,可能会泄露加密密钥等
  • 17.电话号码的字母组合(回溯)
  • Redis小例子
  • ETLCloud+MaxCompute实现云数据仓库的高效实时同步
  • HTTP代理授权方式介绍
  • 《合成孔径雷达成像算法与实现》Figure3.4
  • qt5.15.2 使用mysql8.1
  • 广州华锐互动:VR3D课程在线教育平台为职业院校提供沉浸式的虚拟现实学习体验
  • clion run qt 问题汇总
  • 深入理解spring面经
  • 2023年,App运行小游戏,可以玩出什么创意?
  • 景嘉微电子2021笔试题
  • selenium官网文档阅读总结(day 4)