JS高级面向对象

JS面向对象编程

js本身是不支持面向对象编程的,它没有类,权限属性限制…但是由于JavaScript的灵活性,它可以通过函数的作用域来定义私有变量,外部不能访问到,通过函数创建类,通过prototype 可以达到面向对象编程的特性,继承,多态,封装。

ES5的面向对象写法

// 面向对象编程

var Book = function(id,name){

    // 私有属性
    var time = 2019;
    // 私有方法
    function checkTime(){
        console.log("私有方法Checktime")
    }
    // 特权方法--------通过this。方法名 = function(){}         可以访问私有属性和私有方法
    this.getTime = function(){
        console.log("获取类私有属性time------------"+time)
    }
    this.get_checkTiem = function(){
       checkTime()
    }

    // 公有属性
    this.book_kind = "故事书"
    // 公有方法
    this.book_methods = function(){
        console.log('我是公有方法')
    }
}
// 类的静态公有属性--------对象不能访问
Book.version = '1.2.1'
// 类的静态公有方法--------对象不能访问
Book.checkVersion = function(){
    if(Book.version =  '1.0.1'){
        console.log("版本是已经过期,请下载最新版本")
    }else{
        console.log("版本是最新的,请尽情使用")
    }
}
// 类的公有属性和公有方法------------对象不可访问
Book.prototype = {
    // 通过类的原型添加公有属性和方法
    book_title : false,
    display : function(){
        console.log("类的公有方法----------display")
    }
}





var ss = new Book(001,"一万个为什么")
console.log(ss.time)            //undefined
console.log(ss.checkTime)       //undefined
ss.getTime();                   //获取类私有属性time------------2019
ss.get_checkTiem()              //私有方法Checktime
console.log(ss.book_kind)       //故事书
console.log(ss.book_methods())  //我是公有方法
console.log(Book.version)       //1.2.1
console.log(Book.checkVersion())//版本是最新的,请尽情使用
console.log(ss.book_title)
ss.display()

ES6 面向对象写法

// 在ES6中引入了class,可以方便的创建类,和java挺相似的
class Food{
    // constructor相当于一个构造器
    constructor(name,price){
        this.name = name;
        this.price = price;
    }
    // 父类和子类同名时,用static来区分调用,只能通过类来调用
    static eat(){
        console.log("父类吃的功能")
    }
    play(){
        console.log("父类玩的功能")
    }
}
// 子类继承父类  通过extends继承
class subFood extends Food{
    constructor(name){
        // 子类继承父类后,必须调用super(),  否则报错
        super()
        this.name = name
    }
    eat(){
        console.log("子类的吃的方法")
    }
}

// 创建子类的实例对象
var ss = new subFood("拔丝红薯");
console.log(ss.name)
// 子类的实例对象调用父类的方法
ss.eat()
// 假如父类和子类方法或者属性同名时,实例化对象会优先调用子类的属性和方法
// 如果你想调用父类的方法或者属性时,你可以在父类方法或者属性前加上  static ,  变成静态方法或静态属性,它只能通过类.方法 / 类。属性来访问,不可以通过实例化对象去访问
subFood.eat()

你可能感兴趣的:(JavaScript高级,js面向对象)