ECMACript 5 & ECMACript 6 & TypeCript 面向对象的区别

### 术语 ###

JavaScript 简称JS

ECMAScript 5简称ES5

ECMAScript 6简称ES6

TypeScript 简称TS

### 概述 ###

JavaScript由3部分组成：

1. ECMAScript：JS语言规范的标准
2. DOM(文档对象模型)：DOM树
3. BOM（浏览器对象模型）:浏览器的window等对象

以下讨论JS基于ES，不涉及DOM和BOM，故以下讨论JS<=>ES

### ES5 ###

#### 面向对象的本质 ####

js语言是通过一种原型（prototype）的方式来实现面向对象编程的

一切事物皆对象

----------
使用 instance of判断对象是否属于某类型

对象产生的方式：

概念：对象依靠构造器（constructor）利用原型（prototype）构造出来的，构造器本身也是对象。

声明构造器的两种方式：

1. 函数式声明

           function Class(){
            this.prop = "";
            var va = "";
            this.func = function(){};
        }
        Class.staticProp = "";
        Class.staticFunc = function(){};
        
        说明：this.prop为构造器的公开属性，va为私有属性，私有属性只能够在当前构造器函数内使用

2. prototype的使用

JS的构造器都具有prototype的属性，指定该属性的值，该构造器的实例对象将会自动继承

        function Class(){}
        Class.prototype={
            p1:"p1",
            f1：function(){}
        }


----------
#### 原型链 ####

在ES（JS）中，每个对象拥有一个指向构造器（constructor）prototype（原型）属性的隐式引用（implicit reference）。每一个prototype属性都有指向生成自己构造器（constructor）的prototype属性的隐式引用（原型的原型），从而形成了所谓的原型链。每一个对象的“__ proto __”（注意是双下划线）属性为隐式引用。

    function Person(){}
    var p = new Person();
    p.__proto__ === Person.prototype //true

#### 继承 ####

将children（子类，自构造器）的prototype指向super（父类、父构造器）的对象（实例）：赋值操作

- 可通过Sub.prototype = new Super（）;
- 可通过function Sub(){this.__proto__=new Super()};

这种简单通过prototype继承只能继承实例成员，而不能继承静态成员(类成员，构造器.成员)

继承会将父类的成员copy一份封装到子类里，而不会与父类共用所定义的成员。

### ES6 ###

#### class关键字 ####

ES6中提供的类实际只是ＪＳ原型模式的包装。

可以忽略function 关键字

除了能在函数（成员函数、constructor函数）内，其他地方地方不能使用this

#### 字面量对象 ####

- 可以在字面量对象里定义原型（__ proto __）,用以对象的继承（对象级别，非类（构造器）级别）
- 定义的方法可以忽略关键字function

#### 继承 ####

- 使用extends关键字继承
- 对应一次使用的字面量对象继承可以var sub = {__ proto __：super};
- 可以将类成员（静态成员）也继承下来

### TS ###

#### class关键字 ####

类似于ES6，兼容ES6

**新特性**

可以声明变量类型，以及函数返回的类型

    class Animal { 
        name:string;
        constructor(name:string) { 
            this.name = name;
        }
    }
    
    class Cat extends Animal { 
        name: string = "";
        age: number;
        constructor(name: string, age: number) {
            super(name);
         }
    }