构造函数 And 类

2017-12-23  本文已影响0人  胡自鲜

构造函数

约定俗成:首字母大写;

    function Dog(name,sex){
        this.name = name;
        this.sex = sex;
        this.action = function(){
            console.log("吃、叫、撒欢");
        }
    }

调用构造函数;

实例化;关键字:new(把抽象类具体化,把类变成对象);
var xiaohei = new Dog("小黑","female");
console.log(xiaohei.name);
xiaohei.action();

new 具体做了什么?三件事

1 . 创建另一个空的对象

    var obj = {};

2 . 改变this指向:call aplly bind

    Dog.call(obj,"小黑","female");
    console.log(obj);

3 . 赋值原型

      obj.__proto__ = Dog.prototype;

构造函数的原型

对象是由自身和原型共同构成的;构造函数的原型prototype,属性写在构造函数里,方法写在原型上

 function Person(name,age,height){
       this.name = name;
       this.age = age;
       this.height = height;
  }
Person.prototype.action = function(){
    //this指实例化的对象 实例化对象共用this
    console.log(this);
    console.log("姓名是:"+this.name);
}
Person.prototype.hobby = function(){
    console.log(this);
    console.log("喜欢");
}
Person.prototype = function(){
    action:function(){
          console.log("run");
        }
}
var newPerson = new Person("张三",19,"178cm");

prototype和proto对比,一个实例化之前,表现形式不同而已

 console.log(Person.prototype === newPerson.__proto__); //true

通过原型找到构造函数 constructor

function Person(name){
    this.name = name;
}
console.log(Person.prototype.constructor);
image.png

类的特性:封装 ,继承,多态,重载

function Person(name){
    //私有属性;作用域
    var name = name;
    //共有属性;
    this.height = "183cm";
    //get方法,通过共有方法访问私有属性
    this.get = function(){
        return name;
    }
    //set方法:设置私有属性
    this.set = function(newName){
        name = newName;
        console.log(name);//李四
    }
}
var newPerson = new Person("张三");
console.log(newPerson.get());//张三
newPerson.set("李四");

继承 call apply bind

  function Dad(height){
    this.name = "张三";
    this.age = 58;
    this.height= height;
    this.money = "$1000000";
    this.hobby = function(){
          console.log("喜欢太极");
    }
}
function Son(height){
//继承的三种方法 call apply bind
    Dad.call(this,height,money);
 // Dad.apply(this,[height,money]);
 // Dad.bind(this)(height,money);
    this.action = function(){
        console.log("wan");
    }
}
var newSon = new Son("180cm");
console.log(newSon.height);
newSon.hobby();
newSon.action();
image.png

继承父类原型,涉及到传址问题,影响父级

Student.prototype = Person.prototype;
      //重写子级的方法会影响父级
    Student.prototype.hobby = function(){
        console.log("我是重写方法");
}

解决传值问题

function Link(){};
Link.prototype = Person.prototype;
Student.prototype = new Link();

ES6 类

class Person{
      //类最开始在加载的时候执行
      constructor(name,age){
              this.name = name;
              this.age = age;
        }
        hobby(){
            console.log("喜欢");
        }
        showName(){
        console.log(this.name);
    }
}
var zs = new Person("zs",28);
console.log(zs.age);
zs.showName();
            
//类的继承
class Student extends Person{
    constructor(name,age){
            //super传参,继承属性
            super(name,age);
        }
        action(){
            console.log("我是action函数");
        }
}
var newStudent = new Student("李四",222);
console.log(newStudent.name);
newStudent.hobby();
上一篇下一篇

猜你喜欢

热点阅读