zoukankan      html  css  js  c++  java
  • ES6

    Class 其实是一个语法糖,他能实现的,ES5同样能实现

    ES5

      //手机
        function Phone(brand,price){
            this.brand = brand;
            this.price = price;
        }
        //添加方法
        Phone.prototype.call = function(){
            console.log("I can call someone")
        }
        //实例化对象
        let Huawei = new Phone("华为",4999);
        Huawei.call();
        console.log(Huawei); 
        //I can call someone     Phone {brand: "小米", price: 4999} obj
     

    ES6

       class Phone{
         brand: string;
         price: number; 
    //构造方法, 名字不能修改 constructor(brand,price) { this.brand = brand; this.price = price; } //方法必须使用该语法,不能使用ES5的对象完整形式 call(){ console.log("I can call someone") } } let Xiaomi = new Phone("小米", 4999); Xiaomi.call(); console.log(Xiaomi); //I can call someone Phone {brand: "小米", price: 4999} obj

    继承

    ES5 实现继承

    //手机
        function Phone(brand, price) {
            this.brand = brand;
            this.price = price;
        }
    
        //添加方法
        Phone.prototype.call = function () {
            console.log("I can call someone")
        }
    
        function SmartPhone(brand, price, color, size) {
            Phone.call(this, brand, price); //此处为了继承phone, 用call修改this指向,并传入参数
            this.color = color;
            this.size = size;
        }
    
        //设置子级构造函数的原型
        SmartPhone.prototype = new Phone;
        SmartPhone.prototype.constructor = SmartPhone;
    
        //声明子类的方法
        SmartPhone.prototype.photo = function () {
            console.log("I can take phone");
        }
    
        SmartPhone.prototype.playGame = function () {
            console.log("I can play games");
        }
    
        const xiaomi = new SmartPhone("小米", 3999, '黑色', '5.5inch');
        console.log(xiaomi)
    
    
    

    ES6

    class Phone{
            //构造方法, 名字不能修改
            constructor(brand,price) {
                this.brand = brand;
                this.price = price;
            }
    
            //方法必须使用该语法,不能使用ES5的对象完整形式
            call(){
                console.log("I can call someone")
            }
        }
    
        class SmartPhone extends Phone { //使用extends来继承
            brand: string;
         price: number; 
    //构造方法, 名字不能修改  constructor(brand, price, color, size) { super(brand,price);//类似与 Phone.call(this, brand, price); this.color = color; this.size = size; } //方法必须使用该语法,不能使用ES5的对象完整形式 //声明子类的方法  photo() { console.log("I can take phone"); } playGame() { console.log("I can play games"); } } const xiaomi = new SmartPhone("小米", 3999, '黑色', '5.5inch'); console.log(xiaomi);
      xiaomi.call();
      xiaomi.photo();
      xiaomi.playGame();

    同时子类可以复写父类的方法

    class Phone{
            brand: string;
         price: number; 
    //构造方法, 名字不能修改  constructor(brand,price) { this.brand = brand; this.price = price; } //方法必须使用该语法,不能使用ES5的对象完整形式  call(){ console.log("I can call someone") } } class SmartPhone extends Phone { //使用extends来继承 //构造方法, 名字不能修改  constructor(brand, price, color, size) { super(brand,price);//类似与 Phone.call(this, brand, price); this.color = color; this.size = size; } //方法必须使用该语法,不能使用ES5的对象完整形式 //声明子类的方法 photo = function () { console.log("I can take phone"); } playGame = function () { console.log("I can play games"); } call(){ console.log("I can make a video call"); } } const xiaomi = new SmartPhone("小米", 3999, '黑色', '5.5inch'); console.log(xiaomi) xiaomi.call(); xiaomi.photo(); xiaomi.playGame();
    
    
    
     
  • 相关阅读:
    uni-app 苹果内购支付及获取苹果支付成功信息
    nginx强制使用https访问(http跳转到https)
    最新IOS审核被拒原因TOP10 | 附带解决方法
    ethercat PREEMPT SMP
    client-go workqueue
    k8s apiserver 重启失败
    cni flannel iptables -t filter -D FORWARD -j REJECT --reject-with icmp-host-prohibited
    nginx configmap
    golang yaml LoadYAML
    not found: manifest unknown: manifest unknown
  • 原文地址:https://www.cnblogs.com/ningxin/p/14466459.html
Copyright © 2011-2022 走看看