js 面向对象

作者: 大乔是个美少女 | 来源:发表于2018-01-20 11:34 被阅读0次

JS面向对象精要(二)_函数
JS面向对象精要(三)_理解对象
JS面向对象精要(四)_构造函数和原型对象
JS面向对象精要(五)_继承
js 面向对象和面向过程
面向对象OOP--JS
JavaScript笔记（一）
JS面向对象
2018-01-18
浅谈JS中的面向对象

image.png

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>面向对象</title>
</head>
<body>
    <script>
        // 类的声明
        function Animal() {
            this.name = "name";
        }

        // ES6的类名
        class Animal2 {
            constructor(){
                this.name = name;
            }
        }

        // 实例化
        console.log(new Animal, new Animal2)

        // 借助构造函数实现继承
        function Parent1 () {
            this.name = 'parent1';
            this.say = function() {}
        }
        function Child1() {
            Parent1.call(this); //apply
            this.type = 'Child1';
        }
        // parent1原型链上的东西并没有被child1继承
        Parent1.prototype.say = function(){}
        // Parent1的原型对象是Object，Child1上没有继承Object的say方法,
        // 这种方法继承不了构造函数原型链上的方法
        console.log(new Child1);

        // 借助原型链实现继承
        function Parent2 () {
            this.name = 'parent2';
            this.play = [1,2,3]
        }
        function Child2 () {
            this.type = 'child';
        }
        Child2.prototype = new Parent2();

        console.log (new Child2().__proto__);

        var s1 = new Child2();
        var s2 = new Child2();
        s1.play = [1,2,3,4]
        console.log(s1.play, s2.play);
    </script>
</body>
</html>