TypeScript 第三讲 ———— TypeScript 类的定义 继承 类的修饰符

前言

在讲typescript类之前，我们先了解一下JavaScript中的类的定义，以及使用，可以对比两者的不同。

这部分属于JavaScript高级部分

一、创建JavaScript对象

对象只是一种特殊的数据。对象拥有属性和方法。

创建新对象有两种不同的方法：

• 定义并创建对象的实例
• 使用函数来定义对象，然后创建新的对象实例

第一种创建直接的实例：

person=new Object();
person.name="张三";
person.age=50;
person.color="blue"; 

第二种方式：

function person(name,,age,eyecolor)
{
    this.name=name;
    this.age=age;
    this.eyecolor=eyecolor;
}
var myFather=new person("张三",50,"blue");

二、JavaScript 类

JavaScript 是面向对象的语言，但 JavaScript 不使用类。

在 JavaScript 中，不会创建类，也不会通过类来创建对象（就像在其他面向对象的语言中那样）。

JavaScript 基于 prototype，而不是基于类的。

function Person() {
  this.name = "张三"; //属性
  this.age = 20;
}
var p = new Person();
alert(p.name);

三、JavaScript prototype（原型对象）

所有的 JavaScript 对象都会从一个 prototype（原型对象）中继承属性和方法。

我们知道在一个已存在的对象构造器中是不能添加新的属性的

function Person(first, age, eyecolor) {
  this.Name = first;this.age = age;
  this.eyeColor = eyecolor;
}

要添加一个新的属性需要在在构造器函数中添加：

function Person(first, age, eyecolor) {
  this.Name = first;
  this.age = age;
  this.eyeColor = eyecolor;
  this.nationality = "English";
}

我们也可以使用 prototype 属性就可以给对象的构造函数添加新的方法：

function Person() {
  this.name = "张三"; //属性
  this.age = 20;
}
//使用原型链增加属性和方法
//原型链上面的属性会被多个实例共享
Persion.prototype.sex = "男";
Persion.prototype.work = function(){
   alert(this.name+"在工作");
}

var p = new Person();
alert(p.name);

四、类里面的静态方法

function Person() {
  this.name = "张三"; //属性
  this.age = 20;

  this.run = function(){
     alert(this.name+"在运动");
  }
}
//静态方法
Person.getInFo = function(){
       alert("我是静态方法");
}

//使用原型链增加属性和方法
//原型链上面的属性会被多个实例共享
Persion.prototype.sex = "男";
Persion.prototype.work = function(){
   alert(this.name+"在工作");
}

var p = new Person();
alert(p.name);

//调用静态方法
Person.getInFo();

五、JavaScript继承

1.对象冒充实现继承

function Person() {
  this.name = "张三"; //属性
  this.age = 20;

  this.run = function(){
     alert(this.name+"在运动");
  }
}

Persion.prototype.sex = "男";
Persion.prototype.work = function(){
   alert(this.name+"在工作");
}
function web(){
 Persion.call(this);//这种方法叫：对象冒充实现继承
}
var w = new web();
w.run();//对象冒充可以继承构造函数里的属性和方法，但没法继承原型链上面的属性和方法

对象冒充可以继承构造函数里的属性和方法，但没法继承原型链上面的属性和方法。

2.原型链实现继承

function Person() {
  this.name = "张三"; //属性
  this.age = 20;

  this.run = function(){
     alert(this.name+"在运动");
  }
}

Persion.prototype.sex = "男";
Persion.prototype.work = function(){
   alert(this.name+"在工作");
}
function web(){
 
}
web.prototype = new Person();//原型链实现继承
ver w = mew web();
w.run();
w.word();

原型链既可以继承构造函数里的属性和方法，又可以继承原型链上面的属性和方法。

3.原型链+构造函数组合=实现继承

function Person(name, age) {
  this.name = name; //属性
  this.age = age;

  this.run = function(){
     alert(this.name+"在运动");
  }
}

Persion.prototype.sex = "男";
Persion.prototype.work = function(){
   alert(this.name+"在工作");
}
function web(name, age){
    Person.call(this,name,age)//对象冒充继承    实例化子类可以给父类传参
 
}
web.prototype = new Person();//原型链实现继承
ver w = mew web("旺旺", 20);
w.run();

web.prototype = Person.pertotype;

六、typescript中的类