JS高级中原型中方法继承时的小错误

最新推荐文章于 2024-05-24 23:45:01 发布

逸疏iiii

最新推荐文章于 2024-05-24 23:45:01 发布

阅读量21

点赞数 1

文章标签： javascript 开发语言 ecmascript 原型模式前端

本文链接：https://blog.csdn.net/weixin_51771816/article/details/132090499

版权

前言

在原型对象的方法的继承中的容易犯的小错误，这里我们先说一些需求，声明两个构造函数，将一个方法的放到其中一个原型对象中，让另外一个构造函数的实例对象可以直接访问

提示：以下是本篇文章正文内容，下面案例可供参考

一、首先拿出错误代码

这个错误就在于我们将狗的原型对象中提前定义了方法，那么为什么会得到这个错误呢？

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
/* 
有两个构造函数一个人的构造函数一个狗的构造函数 
我们的需求是在人的原型中定义一个方法狗也能够调用人的方法
*/
function person(){

}
person.prototype.per=function(){
        console.log('人的原型中的方法');
}

function dog(){

}
dog.prototype.tog = function(){
    console.log('狗的方法');
}
dog.prototype =   new person()
let d = new dog()


d.per()
d.tog()

    </script>
</body>
</html>

二、正确代码

这是因为我们定义了狗的方法在狗的原型对象中了，但是后来我们让狗的原型对象等于了人的实例对象，这样以来狗的之前的原型对象就不存在了，而我们在将狗的原型等于人的实例下面写就可以，因为我们把这个方法定义到了人的实例对象中，这个时候这个人的实例对象即是人的实例对象又是狗的原型对象，这里面还有一个容易出现的错误，比如将狗的实例对象的声明放在狗的原型对象等于人的实例对象之前也会出现错误，也是因为声明在那里他的原型对象就是之前的原型对象，而不能够得到我们之后定义的原型对象了

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
/* 
有两个构造函数一个人的构造函数一个狗的构造函数 
我们的需求是在人的原型中定义一个方法狗也能够调用人的方法
*/
function person(){

}
person.prototype.per=function(){
        console.log('人的原型中的方法');
}

function dog(){

}

dog.prototype =   new person()
let d = new dog()

dog.prototype.tog = function(){
    console.log('狗的方法');
}
d.per()
d.tog()

    </script>
</body>
</html>

逸疏iiii

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JS高级中原型中方法继承时的小错误

这是因为我们定义了狗的方法在狗的原型对象中了，但是后来我们让狗的原型对象等于了人的实例对象，这样以来狗的之前的原型对象就不存在了，而我们在将狗的原型等于人的实例下面写就可以，因为我们把这个方法定义到了人的实例对象中，这个时候这个人的实例对象即是人的实例对象又是狗的原型对象，这里面还有一个容易出现的错误，比如将狗的实例对象的声明放在狗的原型对象等于人的实例对象之前也会出现错误，也是因为声明在那里他的原型对象就是之前的原型对象，而不能够得到我们之后定义的原型对象了。
复制链接

扫一扫