JavaScript里的对象是什么?

JavaScript是一种基于对象的脚本语言。它不仅可以创建对象,也可以使用现有的对象。

那关于对象的创建有哪些方法呢?

第一种、直接创建法。

创建格式为:var 变量名={key1:value1,key2:value2…..}

Value:可以是数据,也可以是方法。

例如:创建一个学生对象,包含:name,age。

Var Student={

                  name:“王一”,

                  age:18,

                   eat:function(){

                            console.log(123)

                        }

}

Console.log(Student)

显示结果

       这种创建对象的方法虽然比较容易,但是存在一个很严重的问题。如果需要创建若干个相同属性的对象,是不是就需要把这个内容手动创建若干次。这样一来我们的工作量就会增加很多。那有没有好的方法来解决重复创建相同属性对象的方法呢?下面我们介绍第二种对象创建方法。

第二种、工厂模式创建法

工厂模式: 通过函数创建对象。

创建方法:将创建对象的过程封装到函数内部 ,然后直接调用函数进行对象创建。

        function Student(name,age){

                 var s=new Object()

                 s.name=name

                 s.age=age

                 s.eat=function(){

                   console.log(this.name+”正在吃”)

                }

                return s

           }

调用这个函数3次生成3个学生。

var s1=new Student("王一",21);

var s2=new Student("王二",21);

var s3=new Student("王三",21);

运行结果:

       这样批量复制问题解决了。接下来大家再思考这样一个问题,如果还要再创建一个老师的函数,通过工厂模式生成出来的对象能区分出谁是老师,谁是学生吗?

下面实际举个例子:

学生对象:

        function Student(name,age){

            var s=new Object()

            s.name=name

            s.age=age

            s.eat=function(){

                console.log(this.name+'正在吃')

            }

            return s

        }

老师对象:

        function Teach(name,age){

            var t=new Object()

            t.name=name

            t.age=age

            t.eat=function(){

                console.log(this.name+'正在吃')

            }

            return t

        }

        var s1=Student("王一",21)

        var t1=Teach("张三",30)

        判断是否属于老师

        console.log(t1 instanceof Teach)

 运行结果为:false!

       大家是不是很惊讶!这正是工厂模式的最大弊端没有办法对对象进行分类。那我们要怎么解决这个问题呢?

第三种、构造函数创建法

         其它编程语言中,想要创建对象,可以通过类创建。但是JavaScript中没有类这个概念。后来就有人通过构造函数创建出模拟类。在加上JS中this的指向性改变生成不同对象。

创建方法:

        

输出结果:

         这时生成的对象类已经不在是之前的object了。那这时我们在对它进行分类会是什么结果呢?

运行结果:

       通过第三种方法我们解决了对象的分类问题。

       哈哈。又到了找茬环节。这两个类都有一个吃东西的方法,也就意味着每个类产生的对象里都有这个相同的方法,是不是会大量占用内存空间。那有没有办法帮助我们节约有限的存储空间呢。相同的方法存储在一个公用的地方,需要时才去调用。

第四种、原型创建法

         大家先来下图是之前构造函数创建的对象都有一个prototype的属性---原型对象。

那这两个对象会相等吗?下面我们实例化出来来个对象看看比较结果是不是True。

运行结果:

        实验结果证明通过同一个构造函数创建出来的对象原型是相等的。

         那这个prototype需要怎么创建呢?

         创建方法:函数名.prototype.方法名=function(){ 具体方法 }

         下面创建一个原型对象

        

         输出结果:

         还有人会问那实例化出来的和prototype出来的原型对象是一样的吗?

         我们接着再做测试。

         实验程序如下:

        运行结果:

        实验证明是一样的。所以我们也用实例化方法对对象        里面的方法进行修改。

        我们把上面的例子稍微修改一下。

运行结果

        通过结果。我们也发现实例化对象不需要重复创建。相同类的对象也可以调用修改后的方法。

Logo

为开发者提供学习成长、分享交流、生态实践、资源工具等服务,帮助开发者快速成长。

更多推荐