typescript的基础知识和特性!

多行:
原来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[n]);//值
}
//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);




注解:
类型文件:不太懂,希望有大神可以描述一下!



评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值