原型的书写方法，以及方法之间的访问

最新推荐文章于 2021-04-19 08:47:03 发布

杏黄的三叶草

最新推荐文章于 2021-04-19 08:47:03 发布

阅读量249

点赞数

分类专栏： Web前端JavaScript

本文链接：https://blog.csdn.net/dwjdj/article/details/104385115

版权

Web前端JavaScript 专栏收录该内容

40 篇文章 0 订阅

订阅专栏

利用原型来共享数据

不需要共享的数据写在构造函数中,需要共享的数据写在原型中

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<script>
    function Person(name,age) {
        this.name=name;
        this.age=age;
    }
    Person.prototype.height="180";
    Person.prototype.play=function () {
        console.log("我们都喜欢玩耍");
    };
    Person.prototype.eat=function () {
        console.log("但是我们跟喜欢吃好吃的");
    };
    //实例化对象,并初始化
    var person=new Person("张雨生",18);
    console.dir(Person);
    console.dir(person);
</script>
</body>
</html>

原型简单语法的书写

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<script>
    // function Person(name,age) {
    //     this.name=name;
    //     this.age=age;
    // }
    // Person.prototype.height="180";
    // Person.prototype.weight="50kg";
    // Person.prototype.play=function () {
    //     console.log("我们都喜欢玩耍");
    // };
    // Person.prototype.eat=function () {
    //     console.log("但是我们跟喜欢吃好吃的");
    // };

    function Person(name,age) {
        this.name=name;
        this.age=age;
    }
    Person.prototype={
        //需要手动修改构造器的指向
        constructor:Person,
        height:"180",
        weight:"50kg",
        play:function () {
            console.log("我们都喜欢玩耍");
        },
        eat:function () {
            console.log("但是我们跟喜欢吃好吃的");
        }
    };
    var person=new Person("张雨生",18);
    console.dir(Person);
    console.dir(person);
</script>
</script>
</body>
</html>

实例对象的方法是可以相互调用的

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<script>
    function Person(name,age) {
        this.name=name;
        this.age=age;
        this.play=function () {
            console.log("我们都喜欢玩耍");
            this.eat();
        };
        this.eat=function () {
            console.log("但是我们跟喜欢吃好吃的");
        };
    }
    Person.prototype={
        //需要手动修改构造器的指向
        constructor:Person,
        height:"180",
        weight:"50kg"
    };
    var person=new Person("张雨生",18);
    person.play();//实例对象的方法是可以相互调用的
</script>
</body>
</html>

在这里插入图片描述

原型中的方法也是可以相互调用的

不能互调，不然会进入死循环

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<script>
    //原型中的方法,是可以相互访问的
    function Animal(name,age) {
        this.name=name;
        this.age=age;
    }
    //原型中添加方法
    Animal.prototype.eat=function () {
        console.log("动物吃东西");
        this.play();
    };
    Animal.prototype.play=function () {
        console.log("玩球");
        this.sleep();
    };
    Animal.prototype.sleep=function () {
        console.log("睡觉了");
    };
    var dog=new Animal("小王",20);
    dog.eat();
</script>
</body>
</html>

杏黄的三叶草

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
原型的书写方法，以及方法之间的访问

利用原型来共享数据不需要共享的数据写在构造函数中,需要共享的数据写在原型中<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body><...
复制链接

扫一扫