js面向对象学习

最新推荐文章于 2022-08-09 15:00:06 发布

南北极之间

最新推荐文章于 2022-08-09 15:00:06 发布

阅读量99

点赞数

分类专栏：前端开发

本文链接：https://blog.csdn.net/qq_22182989/article/details/96993541

版权

前端开发专栏收录该内容

570 篇文章 53 订阅

订阅专栏

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<script>
    // <!--对象直接量：-->
    var obj = {
        name: "yukky",
        do: function () {
            console.log("大家好，我是：" + this.name);
        }
    };
    console.log(obj["name"]);
    console.log(obj["do"]);
    obj.do();
    //使用new关键字
    var obj2 = new Object();
    obj2.name = "yukky江222";
    obj2.do = function () {
        console.log("222大家好，我是：" + this.name);
        console.log("222大家好，我是：" + obj2.name);
    }
    obj2.do();
    console.log(obj2);

    //构造函数定义对象
    function Student(name, age) {
        this.name = name;
        this.age = age;
        this.study = function () {
            console.log(this.name + "正在学习");
        }
    }

    var stu1 = new Student('yukky', "18");
    stu1.study();
    console.log(stu1);

    //原型的方式定义
    function Student2(name, age) {
        Student2.prototype.name = name;
        Student2.prototype.age = age;
        Student2.prototype.study = function () {
            console.log(this.name + "正在学习222222222");
        };
    };
    var stu2 = new Student2("yukky22222", "18")
    stu2.study();
    console.log(stu2);
    console.log(stu2.__proto__ === Student2.prototype);

    //工厂模式
    function create(name, age) {
        var stu3 = new Object();
        stu3.name = name;
        stu3.age = age;
        stu3.study = function () {
            console.log(this.name + "正在学习66666666");
        };
        return stu3;
    };
    var objc = [];
    for (var i = 0; i < 100; i++) {
        objc[i] = create();
    }
    console.log(objc);

    var objc2 = objc[0];
    console.log(objc2);//{name: undefined, age: undefined, study: ƒ}

    objc2.name = "A";
    console.log(objc[0]);//{name: "A", age: undefined, study: ƒ}
    console.log(objc2);//{name: "A", age: undefined, study: ƒ}
</script>
</body>
</html>