构造函数

最新推荐文章于 2024-03-11 18:19:46 发布

一份蛋炒饭

最新推荐文章于 2024-03-11 18:19:46 发布

阅读量71

点赞数

分类专栏： js 文章标签： javascript

本文链接：https://blog.csdn.net/weixin_52019215/article/details/113787029

版权

js 专栏收录该内容

39 篇文章 1 订阅

订阅专栏

这篇博客深入探讨了JavaScript中的构造函数及其在对象实例化中的应用。通过示例，解释了如何使用构造函数创建具有特定属性和方法的对象，并讨论了`this`关键字在不同上下文中的行为。此外，还提到了方法的共享和优化，如通过全局函数避免重复创建相同的方法。最后，介绍了`instanceof`操作符用于检查对象是否属于某个类的实例。

摘要由CSDN通过智能技术生成

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <script>
        // function creatDog(name, age) {
        //     var obj = new Object();
        //     obj.name = name;
        //     obj.age = age;
        //     obj.sayHello = function() {
        //         // alert('汪汪');
        //     };
        //     return obj;
        // }
        // //创建一个狗对象
        // var dog = creatDog('旺财', 3);
        // dog.sayHello();
        // console.log(dog);
        //使用批量创建的对象 都是object  导致无法区分出多种不同类型的对象
        //   构造函数
        //   创建一个构造函数  专门区分对象
        //   构造函数是一个普通的函数，和其他函数无区别
        //   不同 的是构造函数首字母经量大写
        // function Person(name, age, gender) {
        //     this.name = name;
        //     this.age = age;
        //     this.gender = gender;
        //     this.sayName = function() {
        //         console.log(123312);
        //     };
        // }
        // var per = Person(); //undefined

        // var per = new Person(); //构造函数和普通函数的调用方法不同，
        // console.log(per);
        //普通函数直接调用，构造函数需要使用new关键字调用

        //构造函数执行流程
        //  1 立刻创建新的对象
        //  2 将新建的对象设置位函数中的this，在构造函数中可以使用this来引用新建对象
        //  3 指向函数中代码

        //  4 将新的对象作为返回值返回

        // var per1 = new Person('zhangxueyou', 18, 'man');
        // var per2 = new Person('guofucheng', 38, 'man');
        // var per3 = new Person('liming', 28, 'man');
        // console.log(per1);
        // console.log(per2);
        // console.log(per3);

        //创建一个对象dog
        // function Dog() {}
        // var dog = new Dog();
        // console.log(dog);

        //使用同一个构造函数创建的对象我们称位一类对象，也将构造函数称为一个类
        //我们将通过一个构造函数创建对象，称为该类的实例

        //使用instanceof可以检查一个对象是否是一个类的实例
        //yes  返回true
        // 语法： 对象 instanceof 构造函数
        // console.log(per1 instanceof Person); //true
        // console.log(dog instanceof Person); //false

        // console.log(per1 instanceof Object); //true
        // console.log(dog instanceof Object); //true
        //所有的对象都是Object的后代
        //所以任何对象和Object在instanceof检查时都返回true

        //this
        // 1 当以函数的形式调用时，this是window
        // 2 当以方法的形式调用时，this指向调用者
        // 3 当以构造函数的形式调用时，this是新创建的那个对象


        //创建一个Person构造函数
        //    在Person构造函数中，为每一个对象都添加了一个sayHello方法
        //    目前我们的方法是在构造函数中创建的
        //       也就是构造函数每执行一次就会创建一个新的sayHello方法
        //    也是所有实例的sayHello都是唯一的
        //   这样导致构造函数执行一次就有一个新的方法
        //     执行一万次就会创建一万个新的方法，而一万个方法是一样的
        //     完全没有必要，完全所有的对象共享一个方法
        //将sayHello方法在全局作用域中定义
        function fun() {
            alert(132);
        };

        function Person(name, age, gender) {
            this.name = name;
            this.age = age;
            this.gender = gender;
            this.sayHello = fun;
        }
        //创建一个Person的实例
        var per = new Person('zhoujielun', 18, 'man');
        var per1 = new Person('yaotintingting', 18, 'man');
        per.sayHello();
        per1.sayHello();
        console.log(per.sayHello == per1.sayHello); //false(不执行91)
        console.log(per.sayHello == per1.sayHello); //true(执行91)
    </script>
</body>

</html>