JS中面向对象简单入门

一，对于面向的简单理解

为了大家对面向对象有一个清晰的认识，我先说一些面向对象的东西。话说为什么要有面向对象的思想？也就是好好的面向过程的程序设计不用，干嘛搞出个面向对象(OO)？我的理解是为了满足工程开发的需要，增加代码的重复利用率(通过继承等)，可以提高开发速度。另外也符合人的思考逻辑，面向过程的代码相对比较难看，很难一眼看出来其中的逻辑，面向对象的代码较好维护。

JavaScript的开发方式我认为也只有两种，一是面向过程，二是面向对象。用面向过程就是来一个问题，写一个函数来解决，这就产生了很多的代码，而且你以前也得代码比较难重复利用（也可以重复利用，但是当你代码写多了，你记得清吗），当然对于相似的操作也可以写一个公共函数库（貌似JQuery就是的吧？不对请指出），这比较好容易理解。而面向对象呢？开发的过程中我们会发现，网页元素有很多操作都是相似的，而且网页中有很多模块都是差不多的，这就让人很容易联想到了用面向对象开发。再来说说提高代码重复利用率的好处。

二，面向对象的封装问题

常规情况下，对于对象的封装将属性封装在构造函数的内部，将行为定义到构造函数的prototype上面

 var Person = function(name, age) {// 构造函数中只封装属性
            this.name = name;
            this.age = age;
        }
        Person.prototype.run = function() {};
        Person.prototype.sleep = function() {};
        Person.prototype.play = function() {};

prototype 的使用

Array.prototype.getMax = function() {
            var _max = this[0];
            for(var i = 0; i < this.length; i++) {
                if(this[i] > _max) {
                    _max = this[i];
                }
            }
            return _max;
        }
        var _arr = [1,3,4,2,21,4,65,6,2,4];
        console.log(_arr.getMax());

三，面向对象的继承问题

1，什么是继承：在继承中，会出现两个类型【父类、子类，子类继承父类的属性和行为】

2，继承是用来做什么的：继承是通过子类继承父类实现父类中代码的重复利用！

3，继承的使用注意事项：
尽量让一个父类有一个或者多个子类
一个子类只继承一个父类

4，继承的第一种方式：通过apply/call实现假继承
apply/call方法都是通过改变函数中第一个参数的指向来达到扩展代码功能的目的
唯一的区别就是apply和call后面的参数不一样！

var Animal = function(name, color) {
            this.name = name;
            this.color = color;
        }
        Animal.prototype.eat = function() {console.log("吃肉");}

        var Cat = function(name, color, age, type) {
            // Animal.apply(this, [name, color]);
            Animal.call(this, name, color);
            this.age = age;
            this.type = type;
        }
        Cat.prototype.caches = function() {console.log("抓老鼠..");}

        var cat = new Cat("tom", "黑色", 48, "猫科");
        console.log(cat);

2.通过prototype和空对象进行间接继承

var _extends = function(Child, Parent) {
            var F = function() {};
            F.prototype = Parent.prototype;
            Child.prototype = new F();
            Child.prototype.constructor = Child;
        }

        var Animal = function(name,age) {
            this.name = name;
            this.age = age;
        }
        Animal.prototype.play = function() {console.log("play gaming!");}

        var Cat = function(name, age, color) {
            this.color = color;
        }
        _extends(Cat, Animal);
        var cat = new Cat();
        console.log(cat);

秒客网

JS中面向对象简单入门

相关文章