JavaScript中几个主要的知识点(1) ---- 面向对象

JavaScript中几个最重要的大知识点

  1. 面向对象

  2. DOM事宜

  3. 异步交互ajax

面向对象

在JS中可以把恣意的援用和变量都看成是一个对象。面向对象的重要三个表现情势:

  • 封装

  • 继续

  • 多态

1. 封装
1.1 单例情势
var obj={
    name: "sam",
    age: 12,
    method: function(){
        var objName=this.name;
        return objName;
    },
    ale: function(){
        var that=this;
        function sum(num1,num2){
            this.num=that.age;
            return num1+this.num+num2;
        }
        console.log(sum(1,2));
    }
}

单例情势有不污染全局变量和勤俭window栈内存的长处

var main={
    init:function(){
        this.changeName();
    },
    changeName:function(){
        var that=this;
        var oBody=document.body;
        oBody.onclick=function(){
            that.changeValue();
        }
    },
    changeValue:function(){
        document.getElementById("one").value="sam";
    }
}

main.init();
1.2 工场情势

可以疾速地依据差别需求,传入差别参数,来返回差别的对象,瑕玷是不能推断对象的范例

function self(name,age,sex){
    var person={};
    person.name=name;
    person.age=age;
    person.sex=sex;
    if(sex=="man"){
        person.job="coder";
    }
    if(sex=="woman"){
        person.job="beatiful";
    }
    return person;
}
var mine=self("sam",22,"man");
console.log(mine.job);
1.3 组织函数情势

组织函数情势可以处理工场情势不能推断对象范例的瑕玷,组织函数情势可以自定义类,组织具有雷同属性和要领的实例

function Person(){
    this.eat="food";
    this.sleep="night";
    this.say=function(){
        console.log("I am person,I can speak");
    }
}
var person1=new Person();
person1.say();

call()和apply()要领

  • call()要领:
    让挪用对象实行,然后第一参数是谁,挪用对象的this就转变指向是谁,后边跟参数,顺次对应传入

  • apply()要领:
    让挪用对象实行,然后第一参数是谁,挪用对象的this就转变指向是谁,后边跟参数,以数组的情势传入

2.继续
2.1 原型继续

把被继续者的组织函数赋值给继续者的prototype,注重需要给继续者的prototype手动增加constructor属性

function A(){
    this.name="A";
    this.sayHi=function(){
        console.log("Hi!I am A");
    }
}

function B(){
    this.name="B";
    this.age=22;
    this.sayHi=function(){
        console.log("Hi,I am B");
    }
}
B.prototype.work=function(){
    console.log("I can play");
}

A.prototype=new B();
A.prototype.constructor=A;
var a=new A();
console.log(a);
2.2 call / apply 继续

把被继续者设置的私有属性,克隆一份作为继续者私有的

function A(){
    this.name="A";
    this.age=22;
    this.sayName=function(){
        console.log("I am A");
    }
}

function B(){
    A.call(this);
}

var b=new B();
console.log(b);
2.3 假装对象继续

继续者继续了被继续者私有和公有的属性和要领

function A(){
    this.x=100;
}
A.prototype.getX=function(){
    console.log(this.x);
}

function B(){
    var temp=new A();
    for(var key in temp){
        this[key]=temp[key];
    }
}

var b=new B();
console.log(b);
3. 多态

javascript中没有严厉的多态,由于JS中没有重载,雷同名字的函数不能同时存在,后定义的重名函数会掩盖先定义的函数(纵然两个形参不雷同)。我们可以写一个通用要领来模仿面向对象言语的多态

function simPoly(){
    if(arguments.length==1){
        return function(){
            console.log(1);
        }
    }
    if(arguments.length==2){
        return function(){
            console.log(2);
        }
    }
}

simPoly(1,2)();
    原文作者:折丹
    原文地址: https://segmentfault.com/a/1190000009915955
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞