构造函数的好处

本文探讨了如何通过工厂函数和构造函数简化JavaScript中的对象创建。首先展示了使用多个对象字面量的方式创建不同形状和颜色的水杯,然后提出使用工厂函数来减少代码重复,最后引入构造函数并解释其封装、继承和多态的特点,通过实例说明了如何用构造函数创建具有特定属性和方法的对象。此外,还介绍了构造函数的工作原理以及new操作符的作用。
摘要由CSDN通过智能技术生成
        /*
         我是厂家我要制造水杯,一种柱状形白色的,一种椭圆形红色的,是不是要两个对象去写,可以写!
        */
 var cup = {
            color: 'white',
            size: '300ml',
            shape: 'bar'
        }

 var cup = {
            color: 'black',
            size: '500ml',
            shape: 'circle'
        }
  // 作为一只奔跑的程序猿,怎么能上面这种呢,肯定要最简单做更多的事,
  //使用一个工厂函数,里面建Object.create({})一个对象,调用的时候传参数
/**
代码是否变简单
**/  
 function factory(color, size, shape) {
            let obj = Object.create({
                color: color,
                size: size,
                shape: shape
            })

            return obj
        }
        let obj1 = factory('black', '500ml', 'circle');
        let obj2 = factory('white', '300ml', 'bar')

构造函数比它更简单,是否理解了

//构造函数有三个特点 封装、 继承、 多态

        function CreateCup(color, size, shape) {
            this.color = color
            this.size = size
            this.shape = shape
        }
        let obj1 = new CreateCup('black', '500ml', 'circle');
        console.log(obj1);

写一个构造函数例子

  function Person(name, age) { //  构造函数 
            this.age = age;
            this.name = name;
            this.run = function() {
                console.log('我叫' + this.name + '今年' + this.age + '我跑步可快了');
            }
        }
        // prototype 原型
        Person.prototype.say = function() { //  把say  方法  挂载到Person 原型对象
            console.log('我叫' + this.name + '今年' + this.age); //引引加加 加加里面是变量
        }
        Person.prototype.eat = function() {
            console.log(this.name + '吃了一顿饭');
        }
        var obj = new Person('lang', '28'); // 实例化对象 // new 创建对象 传参 
        console.log(obj);
        obj.say();
        obj.eat();
        obj.run(); //实例过后才可以调方法和属性

效果

 

  构造函数其实就是一个函数 只是建议构造函数的首字母大写 函数在声明后会生成一个对象prototype, 在prototype中有一个constructor函数, 该函数是一个构造器,  所以prototype指向了包含constructor的对象 ,constructor 指向了构造函数本身

        // new 做了什么

        // 1、调用了函数

        // 2、生成了一对象

        // 3、修改函数内部的this指向 指向这个对象

        // 4、给对象添加对应的属性

        // 5、返回改对象

完!

热爱代码永不断,bug不要显,我要拿捏全栈

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

彩色之外

你的打赏是我创作的氮气加速动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值