1. 程式人生 > >js物件中原型(prototype)的使用方法、替換以及注意事項

js物件中原型(prototype)的使用方法、替換以及注意事項

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script>
        function Person(name, age, gender) {
            this.name = name;
            this.age = age;
            this.gender = gender;
        }

        //----------------------原型的使用方法--------------------
        //1.利用物件的動態特性給原型物件新增成員
        //2.直接替換原型物件

        //存在的問題:
        //如果使用第二種方式使用原型,那麼會出現如下問題:
        //在替換原型之前建立的物件的原型 和 在替換原型物件之後的建立的物件的原型 不是同一個!
        //如下:
        Person.prototype.sayHello = function () {
            console.log("Nice to meet you all");
        }
        var p = new Person("劉能", 18, "male");
            p.sayHello();//Nice to meet you all

        //替換了原型物件
        Person.prototype = {
            msg : "你猜我在不在"
        };

        var p1 = new Person("xzy",18,"male");
        console.log(p1.msg);
        p.sayHello();   //35行=不能打印出()只有22行打印出來‘Nice to meet you all’列印了兩遍 說明不是同一個原型



        //----------------------替換原型物件---------------
        function Person(){

        }

        Person.prototype.sayHello = function () {
            console.log("-------nice to meet you------");
        }

        var p = new Person();

        Person.prototype.sayHello=function() {
           alert(1);
        };
        // var p = new Person;
        p.sayHello();



    </script>
</head>
<body>

</body>
</html>