首先全局安装 typescript
compiler // 转译typescript
tsc // typesript命令
一、字符串新特性
// 多行字符串
var a = `aaa
ddd
`
// 字符串模版
var getName = function() {
return "pawn"
}
console.log(`hello${getName}`)
// 自动拆分字符串
function test(tem, name, age) {
console.log(tem)
console.log(name)
console.log(age)
}
var name = 'pawn'
var getAge = function() {
return 18;
}
test`my name is ${name}, i am ${getAge()}`
二、参数新特性
参数类型：在参数名称后面使用冒号来指定参数的类型
默认参数：在参数后面用等号来指定参数的默认值
可选参数：在方法的参数声明后面用问号来标明此参数为可选参数
var myname: string = "zxh" // 指定类型
myname = 13; // 错误提醒类型是num
var alias = "xxxx";
alias = 14; // 错误提醒（在声明时，会默认字符类型为声明时的类型）
var aabc: any = "xixi"; // 这时接下来就可以赋任何类型的值了
function test(): void{ // void代表此函数没有返回值，如果加了return，会报错
}
function test(): string{ // 声明string类型返回值
}
function test(name:string){ // 给参数声明类型
}
class Person { // 自定义类型
name: String;
age: number;
}
var zhangsan: Person = new Person();
zhangsan.name = "zhangsan"
zhangsan.age = 18
function test(a:string, b:string, c:string = "lisi"){ // 带默认值的参数一定要声明在最后面
console.log(a);
console.log(b);
console.log(c);
}
function test(a:string, b?:string, c:string = "lisi"){ // b是可选参数,同上，必填参数不能在可选参数后面
console.log(a);
console.log(b);
console.log(c);
}
三、函数新特性
Rest and Spread操作符：用来声明任意数量的方法参数
generator：控制函数的执行过程，手工暂停和恢复代码执行
destructuring析构表达式：通过表达式将对象或数组拆解成任意数量的变量
// Rest and Spread操作符
function test(...args){ // 函数调用时可传任意参数进来
}
function fun1(a,b,c){
console.log(a)
console.log(b)
console.log(c)
}
var args = [1,2]
fun1(...args);
var args2 = [1,2,3,4,5]
fun1(...args2);
// generator
function* doSomething(){
console.log("start")
yield;
console.log("end")
}
var f1 = doSomething(); // 必须声明成一个变量去调用，否则不生效
f1.next();
f1.next()
function* getStock(stock){
while(true){
yield Math.random()*100
}
}
var priceStock = getStock("IBM"); // 必须声明成一个变量去调用，否则不生效
var limitPrice = 15
var price = 100
while(price>limitPrice){
price = priceStock.next().value
console.log(price)
}
// destructuring析构表达式
function getStock(){
return {
code: "IBM",
price: 100
}
}
var {code:codex,price} = getStock()
var arr1 = [1,2,3,4]
var [,,num1,num2] = arr1
var [num1,num2,...others] = arr1
var myArray = [1,2,3,4]
myArray.desc = "five number"
四、表达式与循环
箭头表达式：用来声明匿名函数，消除传统匿名函数的this指针问题
forEach(), for in和for of
myArray.forEach(value => console.log(value))
for (var value in myArray) { // 输出键值对,且不可打断（跳出循环）
console.log(value)
}
for (var value of myArray) { // 输出值,且可以打断（跳出循环）
if (value > 2) break;
console.log(value)
}
for (var value of "eerrgs") {
console.log(value)
}
五、面向对象特性
泛型： 参数化的类型，一般用来限制集合的内容
模块：模块可以帮助开发者将代码分割为可重用的单元。开发者可以自己决定将模块中的哪些资源（类、方法、变量）暴露出去供外部使用，哪些资源只是在模块内使用
接口：用来建立某种代码约定，使得其他开发者在调用某个方法或创建新的类时必须遵守接口所定义的代码约定
注解：注解为程序的元素（类、方法、变量）加上更直观更明了的说明，这些说明信息与程序的业务逻辑无关，而是供指定的工具或框架使用的
类型定义文件：类型定义文件用来帮助开发者在TS中使用已有的js工具包，如jquery（typings插件自动检测）
// 类
class Person {
constructor(public name:string) {
}
eat() {
console.log(this.name)
}
}
var p1 = new Person("batman");
p1.eat();
var p2 = new Person("superman");
p2.eat();
// 继承
class Person{
}
class Dog extends Person{
}
// 泛型
var workers: Array<person> = [] // 只能放Person的数组
workers[0] = new Person("张三")
workers[1] = new Dog("李四")
workers[2] = 333 // 报错
// 接口
interface IPerson{
name: string;
age:number;
}
class Person{
constructor(public config: IPerson){ // 作为方法参数的类型声明
}
}
var p1 = new Person({ // 必须按照Person规定的传，不能错传或多传
age: "张三",
name: 18
})
interface Animal{
eat()
}
class Sheep implements Animal{ // 必须实现Animal中的方法
eat(){
console.log("吃草")
}
}
import {prop1,func1,Clazz1} from "./module"
// ./module内容
export var prop1;
var prop2;
export function func1(){
}
function func2(){
$(".xxx").hide()
}
export class Clazz1{
}
class Clazz1{
}
网友评论