js面向对象入门

  一般咱们写js以及调用:javascript

function init(){
        console.log("init")
    }
function load(){
        console.log("load")
    }
init();
load();

    在页面的script标签对里定义两个function,而后执行一下函数名便可。若是咱们还要定义一些变量,或者别的函数啥的 ,则继续按照语法往下写。长此以往,这个页面函数不可胜数,分不清哪些函数是同属一个功能,哪些函数同属另外一个功能,这样很明显不友好,我以前就在几千行的js中找某个功能的N个方法,大多在一块,个别不在,很难找,特费劲。html

  大概是出身后端的缘由,对面向对象有必定的理解,后来知道javascript也能够面向对象编程,一些写法天然也就有所变化了~java

  既然是面向对象编程,那么一切皆对象,咱们就用对象这个点来阐述下面要讲到的面向对象编程。git

  什么是对象?=>万物皆对象。github

  对象的特征是什么=>具备一系列的属性和方法。编程

  因此咱们在进行面向对象编程的时候,重点看属性和方法。后端

  javascript建立对象有三种方式,分别是字面量方式、函数方式、原型方式:设计模式

    //字面量方式
    var obj1={
        init:function(){
            console.log("init1")
        }
    };
    obj1.init();
    //函数方式
    var obj2=function(){
        this.init=function(){
            console.log("init2")
        }
    }
    var obj2=new obj2();
    obj2.init();
    //原型方式
    function Obj3(){}
    Obj3.prototype.init=function(){
        console.log("init3");
    }
    var obj3=new Obj3();
    obj3.init();

  字面量方式的本质实际上是javascript的语法糖,var obj1={} 等价于 var obj1 = new Object();函数

  函数方式也不复杂,能够理解为一个类,类里面就有属性和方法,当对这个类进行实例化,也就是new操做的时候,会生成一个具有类的属性和方法的对象。this

  原型方式涉及到javascript中的原型和原型链,这块比较深度, 目前不作多说,仅需知道便可。


  关于使用面向对象进行编程,我很早时候写了一个栗子在github,https://github.com/lovemoqing/UploadImg/blob/master/UploadImg.html 能够点开看看。

  ...

  小结一写,在面对业务庞杂的js代码时,在编写之初就应该设计好对象,以及对象的属性和方法,通常一个功能点对应一个对象,这样在编写js的时候,根据对象的划分,代码会很是优雅,也方便后续查找和维护。总之,写法只是一个入门,面向对象还有不少待深刻的地方,好比javascript设计模式等。

相关文章
相关标签/搜索