对js构造函数,原型,原型对象的理解(1)

那我就开门见山咯

构造函数

构造函数虽然好用,但是存在浪费内存的问题;
比如
我写了一个构造函数,里面有许多属性,也有方法,

 function Star(name, age) {
            this.name = name;
            this.age = age;
            this.sing = function() {
                console.log('我会唱歌');
            }
        }
        var zs = new Star('张山', 10);
        var ls = new Star('李四', 10);
       

因为sing方法是复杂数据类型,当我创建一个实例对象的时候,会在开辟一个内存空间来储存我们的复杂数据类型, 可想而知我的内存浪费了多少啊.你们说惨不惨.

证明一下

console.log(zs.sing === ls.sing);  //Flase

他们比较的时候,比较的是地址,可见 这两个实例的同一个方法并不一样

这里我只是创建两个实例对象就要开辟2个内存空间了,那我要是创建很多个实例对象呢呢?那岂不是更惨

问题来了,那我们怎么解决
它来了 他=它来了 它真的来了

构造函数的原型 prototype

构造函数通过原型分配的函数是所有对象共享的==
每一个构造函数都有一个prototype属性,它指向的另一个对象.prototype它也是一个对象,它所拥有的的属性和方法,都会被构造函数所拥有

所以啊,我们就可以吧那些不变的方法,直接定义到prototype对象的身上,这样所有对象的实例都可以共享这些方法了,不再需要开辟内存空间了

function Star(name, age) {
            this.name = name;
            this.age = age;
        }
       Star.prototype.sing = function(){
        	 console.log('我会唱歌');
        }
        var zs = new Star('张山', 10);
        var ls = new Star('李四', 10);

这样我就把sing方法放到了原型对象prototype身上了,然后我再创建这两个实例,那我这两个实例能不能使用这个sing方法呢,我们来看看

 zs.sing();		//我会唱歌
 ls.sing();		//我会唱歌

看到是可以使用的,已经实现共享了.再看一下他们在不在同一内存空间

console.log(zs.sing === ls.sing);//true

很好,他们终于团圆了,不在异地了,哈哈

这样成功的解决了内存浪费问题,不再需要开辟内存空间了节约内存资源,这就是我们原型的作用

提个问
1.原型是啥?
它是一个对象, prototype是原型对象;
2.原型的作用?
共享方法

最后记住一句话
**一般情况下,我们会把公共的一些属性定义到构造函数里面.公共的方法我们会放到原型对象身上.**这样就再开辟内存空间,节约内存了.

也许有些人就会问了
我sing方法已经放到了Star的原型对象prototype身上了,可是我zs,ls这两个实例没有这个方法,为什么还能访问得到呢

function Star(name, age) {
            this.name = name;
            this.age = age;
        }
       Star.prototype.sing = function(){
        	 console.log('我会唱歌');
        }
        var zs = new Star('张山', 10);
        var ls = new Star('李四', 10);
        ls.sing(); //我会唱歌
        zs.sing();	//我会唱歌

下一章我们来解决这个问题;期待喔
感谢大家支持