美文网首页
对象的创建方法总结

对象的创建方法总结

作者: 云凡的云凡 | 来源:发表于2020-12-28 18:36 被阅读0次

     // 1.对象字面量或者对象直接量
          var obj = {
              name:'张三',
              sex:'male'
          }
          obj.name='李四'
    

       // 2.构造函数,构造函数写出来之后可以通过new关键字去实例化一个对象
        // 2.1用系统内自带的构造函数
    
        var obj = new Object()  //跟对象字面量相等
        obj.name='张三'
        obj.sex='男的'
        console.log(obj);
    

    对象和构造函数是两码事,对象是通过实例化构造函数new出的对象实例。对象是通过实例化构造函数而创建的一个对象实例。

            // 3.1自定义构造函数(模块化、插件、组件化)
            function Person() {
                this.name = "张三";
                this.sex = '男';
                this.walk = function () {
                    console.log('am walking');
                }
            }
            // new 之后才会用this
            var girl1 = new Person()
            var girl2 = new Person()
            console.log(girl1);//Person {name: "张三", sex: "男", walk: ƒ}
            console.log(girl2);//Person {name: "张三", sex: "男", walk: ƒ}
            girl1.name = 'marry'
            // 通过构造函数构造出来的对象相互之间不影响,完全是两个对象
            // 通过这种方法去写程序复用性就高了,每一次都是new出不同的对象
            console.log(girl1); //Person {name: "marry", sex: "男", walk: ƒ}
            console.log(girl2);  //Person {name: "张三", sex: "男", walk: ƒ}
    
        0// 3.自定义构造函数(模块化、插件、组件化)
            function Person() {
                this.name = "张三";
                this.sex = '男';
                this.weight = 120
                this.walk = function () {
                    this.weight--
                    console.log(this.weight);
                }
                this.eat = function () {
                    this.weight--
                    console.log(this.weight);
                }
            }
            var girl1 = new Person()
            var girl2 = new Person()
            girl1.walk()//119
            girl1.walk()//118
            console.log(girl2.weight);//120
    
    
           //3.2构造函数的参数
            function Person(name, sex, weight) {
                this.name = name;
                this.sex = sex;
                this.weight = weight
                this.walk = function () {
                    this.weight--
                    console.log(this.weight);
                }
                this.eat = function () {
                    this.weight--
                    console.log(this.weight);
                }
            }
            // 创造了两个完全不同的女孩,她们之间是完全不影响的
            var girl1 = new Person('ww', '女', 145)
            var girl2 = new Person('aa', '女', 146)
            console.log(girl1);//Person {name: "ww", sex: "女", weight: 145, walk: ƒ, eat: ƒ}
            console.log(girl2);//Person {name: "aa", sex: "女", weight: 146, walk: ƒ, eat: ƒ}
    

    以对象形式传参,更好维护

          //3.2 以对象形式传参,更好维护
          function Person(opt) {
                this.name = opt.name;
                this.sex = opt.sex;
                this.weight = opt.weight
                this.walk = function () {
                    this.weight--
                    console.log(this.weight);
                }
                this.eat = function () {
                    this.weight--
                    console.log(this.weight);
                }
            }
            // 创造了两个完全不同的女孩,她们之间是完全不影响的
           //参数以属性名排,开发的时候这么做
            var girl1 = new Person({
                name: 'qq', sex: '女', weight: '123'
            })
            var girl2 = new Person({
                name: 'uu', sex: '女', weight: '124'
            })
            console.log(girl1);//Person {name: "qq", sex: "女", weight: "123", walk: ƒ, eat: ƒ}
            console.log(girl2);//Person {name: "uu", sex: "女", weight: "124", walk: ƒ, eat: ƒ}
    

            //4.1  this 没有实例化的时候指向window,实例化之后指向 实例化的那个对象
           function Car() {
                this.color = 'red'
            }
            Car()//this 指向window·
           //new 是为了改变this指向
            var car = new Car()  //this 指向car
    
            // 4.2 构造函数原理,构造函数实例化仅仅是系统内部给了我一个 new,
           //new 的作用就是把 this 造出来以后指向实例化,this 是隐式的
           //new 就是把原本指向 window 的this 转向 实例化对象
            // 4.2.1
            function Car(color, brand) {
                // this.color = 'red'
                var me = {}
                me.color = color
                me.brand = brand
                return me
            }
    
            var car = Car('red', 'byd')
            console.log(car);//{color: "red", brand: "byd"}
    
            // 4.2.2
            function Cars(laojia, nling) {
                // this.color = 'red'
                this.laojia = laojia
                this.nling = nling
                return this
            }
    
            var car = Car('jx', '22')
            console.log(car);//{color: "jx", brand: "22"}
    
            // 4.2.3
            function Carss(xuexiao, address) {
                this.xuexiao = xuexiao
                this.xuexiao = xuexiao
            }
    
            var car = new Car('shizhuan', 'ganzho')
            console.log(car);//{color: "shizhuan", brand: "ganzho"}
    

    相关文章

      网友评论

          本文标题:对象的创建方法总结

          本文链接:https://www.haomeiwen.com/subject/bkqtgktx.html