极客教程-前端开发让前端飞

从基础代码深入js面向对象

2016-09-27  本文已影响236人  cbw100

认识面向对象

1、面向对象中的概念:

基本面向对象

var person={
    name:"cll",
    age:22,
    run:function(){
        console.log("running")
  }
}
console.log(person.name);

函数构造器构造对象

function Person(){

}
Person.prototype={
    name:"cll",
    age:22,
    run:function(){
        console.log("running")
  }
}
var p=new Person();
p.age
p.name
p.eat()

深入js面向对象(面向对象的书写格式)

1、第一种写法:

function People(name){
    this._name=name;
}
People.prototype.say=function(){
    console.log("hello"+this._name);
}
function Student(name){
     this._name=name;
}
Student.prototype=new People(); //实现继承
var superSsay=Student.prototype.say;
Student.prototype.say=function(){  //复写父类的say方法
    superSsay.call(this);  //调用父类的say方法
    console.log("stu-hello"+this._name);
}
var s =new Student('cll');
s.say();

如果要将变量封装,则采用闭包,代码如下:

(function(){
    var n='cll';
    function People(name){
    this._name=name;
  }
    People.prototype.say=function(){
    console.log("hello"+this._name+n);
  }
  window.People=People;
})();
//同理,student也这样封装。

2、第二种写法:

function Person(name){
    var _this={}
    _this.name=name;
    _this.sayHello=function(){
      console.log('Hello');
   }
   return _this;
}
function Teacher(name){
    var _this=Person(name);
    var surperSay=_this.sayHello;
    _this.sayHello=function(){
      surperSay.call(_this);
      console.log('Thello'+this._name);
    }
    return _this;
}
var t=Teacher('cll');
t.sayHello();

假如要封装变量也是采用上面闭包的形式.

上一篇下一篇

猜你喜欢

热点阅读