【JS】面向对象-创建对象

本文介绍了JavaScript中创建对象的四种常见方式:字面量、内置构造函数、工厂函数以及自定义构造函数。通过示例代码详细阐述了每种方式的使用,并强调了自定义构造函数与new关键字的结合在对象创建中的重要性。
摘要由CSDN通过智能技术生成
<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
<script>
    /*
    * 创建对象的方式
    * 1.字面量方式创建对象 太麻烦,pass
    * var obj={....}
    * 可以后期动态添加
    * 2.内置构造函数创建对象 太麻烦,pass
    * var obj=new Object()
    * 可以后期动态添加
    * 3.工厂函数创建对象
    * 3.1 创建一个工厂函数
    * 3.2 使用工厂函数创建对象
    * 4.使用自定义函数构建对象
    * 4.1 创建一个自定义函数
    * 4.2 使用自定义构造函数创建对象
    * */
    //  1.字面量方式创建对象
    // var obj = {
    //     name: 'Tom',
    //     age: 18,
    //     sayHi: function () {
    //         console.log("Hello,World!")
    //     }
    // }
    //2.内置构造函数创建对象
    // var obj2 = new Object()
    // obj2.name = 'jack'
    // obj2.age = 18
    // obj2.sayHi = function () {
    //     console.log("Hello,World!")
    // }
    // 3.工厂函数创建对象
    //  3.1 创建一个工厂函数
    // 3.2 使用工厂函数创建对象
    // function createObj(name,age) {
    //     //    手动创建一个对象
    //     var obj = {}
    //     obj.name = name
    //     obj.age = age
    //     obj.sayHi = function () {
    //         console.log("Hello,World!")
    //     }
    //     return obj
    // }
    //
    // var obj1 = createObj('Jack',21)
    // var obj2 = createObj('Rose',23)
    // console.log(obj1)
    // console.log(obj2)
    // 4.使用自定义函数构建对象
    // * 4.1 创建一个自定义函数
    // * 4.2 使用自定义构造函数创建对象
    //构造函数会自动创建对象并返回
    //this 指向当前实例
    function createObj(name, age) {
        this.name = name
        this.age = age
        this.sayHi = function () {
            console.log("Hello,World!")
        }
    }

    //构造函数在使用时需要和new关键字连用
    var obj1 = new createObj('Jack', 32)
    var obj2 = new createObj('Rose', 23)
    console.log(obj1, obj2)

</script>
</body>
</html>
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值