js基础_35、构造函数修改

创建一个Person构造函数

—-在Person构造函数中，为每一个对象都添加了一个sayname方法，目前我们的方法是在构造函数内部创建的，也就是构造函数每执行一次就会创建一个新的sayname方法，也就是所有的实例的sayname方法都是唯一的。这样就导致了构造函数执行一次就会创建一个新方法，比如，执行1000次就会创建1000个新的方法，而1000个方法都是一模一样的，这完全没有必要，完全可以使所有的对象共享一个方法。

如下代码就是在构造函数内部声明的方法，这样并不好，因为会占用过多的内存资源。

<script>
            function Person(naem,age,gender){
                this.name=naem;
                this.age=age;
                this.gender=gender;
                this.sayname=function(){
                    console.log(this.name);
                }
            }
            var per=new Person('孙悟空',18,'男');
            var per2=new Person('猪八戒',28,'男');
            var per3=new Person('白骨精',20,'女');
            per.sayname();
            per2.sayname();
            per3.sayname();
            console.log(per.sayname==per2.sayname);
</script>

输出结果也可以证明每个实例里的方法是不一样的(方法相互独立)。

对代码进行如下修改，会提高效率，也就是将方法声明在构造函数外部，这样在调用构造函数时声明的实例里的方法只需要引用全局作用域里的函数即可。

<script>
            function Person(naem,age,gender){
                this.name=naem;
                this.age=age;
                this.gender=gender;
                this.sayname=fun;
            }
            var fun=function(){
                    console.log(this.name);
                }
            var per=new Person('孙悟空',18,'男');
            var per2=new Person('猪八戒',28,'男');
            var per3=new Person('白骨精',20,'女');
            per.sayname();
            per2.sayname();
            per3.sayname();
            console.log(per.sayname==per2.sayname);
</script>

因为方法声明在全局作用域，所以每个实例里的函数都是一样的。

以后我们创建构造函数时，可以将这些对象共有的属性和方法，统一添加到构造函数的原型对象中，这样不用分别为每个对象添加属性和方法，同时也不会污染(影响)到全局作用域就可以使每个对象都具有这些属性和方法了。

<script>
        function Person(naem,age,gender){
                this.name=naem;
                this.age=age;
                this.gender=gender;
            }
            //把所有对象共有的方法添加到构造函数的原型对象中。
            Person.prototype.sayname=function(){
                    console.log(this.name);
                }
            var per=new Person('孙悟空',18,'男');
            var per2=new Person('猪八戒',28,'男');
            var per3=new Person('白骨精',20,'女');
            per.sayname();
            per2.sayname();
            per3.sayname();
            console.log(per.sayname==per2.sayname);
</script>

上面代码输出结果和上图一致