字符串新特性 （提高开发效率和代码的辨识度）
- 多行字符串(定界符)
var tmpData = {
tmp_title : 'tmp_title',
content : 'tmp_content',
};
var tmpFoo = function(){
return 'tmp_content_two';
};
var tmp =`
<section id="box-wrap">
<h2>${tmpData.title}</h2>
<div>
<p>${ tmpData.content }</p>
<p>${ tmpFoo() }</p>
</div>
</section>
`;
alert(tmp);
- 自动拆分字符串
var foo = function(template,name,age){
console.log(template);
console.log(name);
console.log(age);
}
const myName = "MF";
var getAge = function(){
return 99;
};
foo `My name is ${ myName }, I'm ${ getAge() }`;
参数类型
如果一个变量被指定了类型，再给变量赋值的时候，编辑器会根据类型做一些检查，减少开发时犯错误的几率。
这里的检查是静态类型检查，只是在ts的编译器中提示错误，并不意味着编译后的js代码中的变量变成了强类型。
var myName:string = "MF";
myName = 13;
以下的情况，编译器同样是会报错。因为编译器的类型推断机制。在声明一个新变量时会做类型检查，确定变量的类型。
var myName = "MF";
myName = 13;
如果不想限制新声明的变量的类型，可以用any关键字声明变量。
var myName:any = "MF";
myName = 13;
ts 支持的基本类型包括
- any
- string
- number
- boolean
- void (用于声明函数的返回值)
var foo1 = function(): void{
return 'aaa';
}
var foo2 = function(): number{
return 'aaa';
}
var foo3 = function(arg:string): number{
return 111;
}
foo3(12);
自定义类型
class Person{
name: string;
age:number;
}
var mf :Person = new Person();
mf.name = 'mf';
mf.age = 99;
默认参数（在参数声明的后面用等号指定参数的默认值）
var foo1 = function(a:string,b:string,c:string='ccc'){
console.log(a);
console.log(b);
console.log(c);
}
foo1('aaa','bbb');
var foo2 = function(a:string,b?:string,c:string='ccc'){
//可选参数不可以声明在必选参数的前面
console.log(a);
console.log(b);
console.log(c);
}
foo2('aaa');
函数新特性
Rest and Spread 操作符（用来声明任意数量的方法参数）
function foo(...args){
//可以传入任意数量的参数
args.forEach( (arg) => console.log(arg) );
}
foo(1,2,3);
//foo(4,5,6,7);
析构表达式（通过表达式将对象或数组拆解成任意数量的变量）
function getStock(){
return {
code: 'google',
price:'100',
}
}
var {code:codeX,price} = getStock();
console.log(codeX);
console.log(price);
function getStock(){
return{
code:'google',
price: {
price1:200,
price2:400,
}
}
}
var {price:{ price2 } } = getStock();
console.log(price2);
//用析构表达式从数组中取值
var array = [0,1,2,3,4];
var [num0,,num2] = array;
console.log(num0);
console.log(num2);
//var [, , num2, , ...others] = array;
//console.log(num2);
//console.log(others);
//用析构表达式拆分数组作为函数的参数
var array = [0,1,2,3,4];
function fn([num1,num2,...others]){
console.log(num1);
console.log(num2);
console.log(others);
}
fn(array);
for of 循环
var array = [0,1,2,3,4];
//for Each
array.forEach(i => console.log(i));
//for of
for(var i of array){
if(i> 2) break;
console.log(i)
}
//用for...of 拆分字符串
for(var n of 'uniplaza'){
console.log(n);
}
面向对象
类的定义
class Person{
//类的构造函数(只在类被实例化时调用一次)
constructor(public name:string){ }
// 访问控制符 public（默认）,
// private ,
// protected(可以在类的内部和子类里被访问 )
//name;
run(){
console.log('I'm running');
}
}
var p1 = new Person();
p1.name = 'batman';
p1.run();
类的继承 （ extend ，supper）
class Child extends Person{
constructor(name:string,id:number){
//super 关键字用于调用父类的构造函数
super(name);
}
school;
goSchool(){
super.run();
console.log(school);
}
}
var c1 = new Child('yyy',0001121);
