您的位置:首页 > 其它

typescript的基础知识和特性!

2017-03-22 14:20 465 查看
多行:

原来js中:var   a="1231"+
  "232";才能换行

现在typescript:var  a=`123
       233`;就可以了!这个符号是数字键1左边的那个上标点!

字符串模版:

ts:var A = "123";

var fun1 = function () { 

    return "woqu";

}

console.log(`hello ${A}`);

js:var A = "123";

var fun1 = function () {

    return "woqu";

};

console.log("hello " + A);

自动拆分字符串:

ts:var test=function(a, name, age){

    console.log(a);

    console.log(name);

    console.log(age);

};

var getName = function() {

    return "wenzailong";

};

var getAge=function() { 

    return 16;

}

test`my name is ${getName()},my age is ${getAge()}`

js:

var test = function (a, name, age) {

    console.log(a);

    console.log(name);

    console.log(age);

};

var getName = function () {

    return "wenzailong";

};

var getAge = function () {

    return 16;

};

(_a = ["my name is ", ",my age is ", ""], _a.raw = ["my name is ", ",my age is ", ""], test(_a, getName(), 

getAge()));

var _a;

typescript的类型定义:

var a: string = "123";//字符串

var b: number = 123;//数字

var c: boolean = true;//boole

var man: any = "aaa";//任意类型

        man = 123;

var d = function (): void  {

   //不能有返回值

        }

 var e = function ():string {

   //返回值必须是string

     return "";

}

 var f = function (bb: string) { 

     //调用这个方法传入的参数必须是字符串

 }

f("1233");

//自己定义类型,方便赋值

class gg { 

    age: number;

    name: string;

}

var x: gg = new gg();

x.age = 12;

x.name = "woqu";

//设置参数的默认值

var a: string = "111";

//设置方法的默认值

var b = function (r: string, b: number, c: string = "asasasas") { 

    console.log(r);

    console.log(b);

    console.log(c);

}

//注意默认值方法一定要放最后面,不然会报错!

b("123",121);

//设可参数

var c = function (r: string, b?: number, c: string = "asasasas") { 

    console.log(r);

    console.log(b);

    console.log(c);

}

//注意默认值方法一定要放最后面,不然会报错!

c("123");

//可选参数也可以不传,注意后台会存空,小心空指针!

//可选参数一定要放在必选参数后面,不然会报错!

//rest and spread操作符

function fun1(...args) {

    args.forEach(function(arg){

        console.log(arg);

    })

}

fun1(21,23,231,213,213,123);

//断点generator函数

function* dosomething(){

  console.log("star");

  yield;

  console.log("second");

 

}

var ff=dosomething();

ff.next();

ff.next();

复杂generator例子:当一个值低于15的时候,跳出循环

function* getDo(stock){

  while(true){

    yield Math.random()*100;

  }

}

var price=getDo("IBM");

var limit=15;

var max=100;

while(max>limit){

  max=price.next().value;

  console.log(`the generator return ${max}`);

}

console.log(`buing at${price}`);

//析构表达式

//从对象中取值

function getStock(){

  return {

    code:"IBM",

    price:123,

    p:{

      p1:112,

      p2:2222,

      p3:3343

    },

    aaa:1233,

    dsdasdsdas:"sd"

  }

}

var { code,price,p:{p2} }=getStock();

//给变量取别名var {code:condex,price}=getStock();

console.log(code);

console.log(price);

console.log(p2);

//从数组中取值

var array1=[1,23,23,341,123,34];

var [num1,num2,,,num3,]=array1;

console.log(num1);

console.log(num2);

console.log(num3);

var [num1,num2,...others]=array1;

console.log(others);

//用在方法中

function aaa( [num1,num2,,,num3,]){

  console.log(num1);

console.log(num2);

console.log(num3);

}

aaa([1,23,23,341,123,34]);

//箭头表达式

var aaa=[12,23,23,41,33,123];

console.log(aaa.filter(value=>value%2==0));

//作用消除this表达式带来的this关键字问题!!!

function socket(name:string){

  this.name=name;

  setInterval(function(){

    console.log("name is:"+this.name);

  },1000);

}

var a=new socket("ibn");

var a=socket("ibn");

function socket(name:string){

  this.name=name;

  setInterval(()=>{

    console.log("name is:"+this.name);

  },1000);

}

var a=new socket("ibn");

试试俩个例子,效果很明显!

循环

var a=[1,23,24,324,23];

//for in 循环

for(var n in a){

  console.log(n);//键

  console.log(a
);//值

}

//forEach循环

a.forEach(value=>console.log(value));

//for of 循环

for(var n of a){

  if(n>50) break;//可以打断

  console.log(n);

}

//类的声明

class Person{

//这是构造函数,没次类被实例化就会运行,外部无法访问!

  constructor() { 

      console.log("haha haha");

  }

  public name;//默认是public

  private age;

   protected aaa(){

    console.log("name");

  }

}

//类的构造函数

constructor(name:string) { 

      console.log("haha haha");

  }

//如果上面没有定义name,下面就不能引用,会报错,除非你定义成constructor(public name:string)加了修饰符才是你

定义了一个name!

//如果构造函数带参数,你实例化的时候必须给参数, var a=new Person("1212");!

继承,class aa extends Person(){}  会继承父类的所有属性和方法!!

super: 子类在继承父类,重写父类构造函数的时候,

//父类 的构造

class aa extends Person(name:string){
this.name=name}

//子类的构造函数

class aa extends Person(name:string,age:number){
super(name);
this.age=age;

}

泛型:

var arry:Array<number>=[];

array[1]=[1111];

接口:

第一种写法

interface boy{
name:string;
age:number;

}

class person{

constructor(public config:boy){

}

}

var aaa = new person({

    name: "21312",

    age:123

});

第二种写法:

interface boy{
name:string;

    age: number;

    eat();

}

class person implements boy{

    name: "1233";

    age: 123;

    eat() { }

}//继承了接口,属性和方法都要重写一下

模块:

一个文件是就是一个模块

export:对外暴露;默认是不对外暴露

export var name;

import{模块名}from "/src";

这里就可以导入模块的暴露属性

console.log(name);

注解:

类型文件:不太懂,希望有大神可以描述一下!
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: