-
模块可以帮助开发者将代码分割为可重用的单元。开发者可以自己决定模块中哪些资源（类、方法、变量）暴露出去供外部使用，哪些资源只在模块内使用。ts里一个文件就是一个模块。 export : 导出，对外暴露 import : 导入，引入外部资源 eg: //a.ts export var prop1; var prop2; export function func1(){ } function func2(){ } export class Clazz1(){ } class Clazz2(){ } //b.ts import {prop1,func1,Clazz1} from "./a"; console.log(prop1) func1(); new Clazz1();查看全部
-
接口：用来建立某种代码约定，使得其它开发者在调用某个方法或创建新的类时必须遵循接口所定义的代码约定。 第一种用法： interface IPerson{ name;string; age:number; } class Person{ constructor(public config:IPerson){ } } var p1=new Person({name:"zhangsan",age:18});//必须符合接口的格式，为接口中的属性赋值 第二种用法： interface Animal{ eat(); } class Sheep implements Animal{ //implements关键字代表该类实现该接口，该类必须定义接口中的方法 eat(){ console.log("i eat grass"); } } class Tiger implements Animal{ eat(){ console.log("i eat feet"); } }查看全部
-
参数化的类型，一般用来限制集合的内容 例子： class Person { public name; eat() { console.log(this.name) } } class Employee extends Person{ constructor(name:string,public code:string) { super() } work() { super.eat(); this.doWork(); } private doWork() { console.log('www') console.log(this.code) } } var work: Array<Person> = []; //申明work这个数字包含的数据只能是Person类型的 work[0] = new Person() work[1] = new Employee('jimmy', '13') //子类也属于父类，不会报错 work[2]=1 //1不属于Person类型，会报错查看全部
-
（1）类的声明和访问控制符 class Person { public aaa;//访问控制符public:默认，在类内外部可以访问 private bbb = 'b'; //访问控制符private:只能在类内部可以访问 protected ccc='cc';//访问控制符protected:在类内部和类的子类中可以访问 eat() { console.log(this.aaa+this.bbb) } } var p1 = new Person(); p1.aaa = 'a'; p1.eat(); （2）构造函数 class Person { constructor(public name:string) { } /*等同于: name constructor(name:string) { this.name=name; } */ eat() { console.log(this.name) } } var p1 = new Person('hhh'); p1.eat(); （3）类的继承 class Person { constructor(public name:string) { } eat() { console.log(this.name) } } class Employee extends Person{ constructor(name:string,public code:string) { super(name) } work() { super.eat(); this.doWork(); } private doWork() { console.log(this.code) } } var e1 = new Employee("name",'13'); e1.work(); 用extends关键字申明继承关系，继承父类的全部属性和方法。 子类在声明constructor方法时一定要加super关键字，参数为父类构造函数必须要传的参数，如无则不传。另外子类可以通过super调用父类定义的方法。查看全部
-
1、forEach var myArray=[1,2,3,4]; myArray.desc='four number'; myArray.forEach(value=>console.log(value))//1,2,3,4 特点：忽略属性值，不能直接break;跳出循环 2、for in for(var n in myArray){ console.log(n) //0,1,2,3,desc console.log(myArray[n]) //1,2,3,4,'four number' } 3、for of for(var n of myArray){ console.log(n) //1,2,3,4 特点：忽略属性值，能直接break;跳出循环 } 4、for of循环字符串 for(var n of 'four number'){ console.log(n) //字符串中每个字符打印出来 }查看全部
-
//一行表达式 var sum = (arg1,arg2) => arg1 + arg2 //多行表达式，效果和以上写法等同 var sum = (arg1,arg2) => { return arg1 + arg2 } //无参数 var sum = () => { } //一个参数 var sum = arg1 => { console.log(arg1) } //综合例子 var myArray=[1,2,3,4,5]; console.log(myArray.filter(value=>value%2==0)); //消除传统匿名函数的this指针问题例子 function getStock(name:string){ this.name = name; setInterval(function () { console.log("name is:" + this.name) },1000); } var stock = new getStock("IBM") //打印不出this.name function getStock2(name:string){ this.name = name; setInterval(()=>{ console.log("name is:" + this.name) },1000); } var stock=new getStock2("IBM") //可以正常打印出this.name查看全部
-
函数新特性之destructuring析构表达式： 通过表达式将对象或数组拆解成任意数量的变量 例如： function getStock(){ return{ code:"IBM", price:100}} var {code,price} = getStock(); 等同于 var stock = getStock(); var code = stock.code; var price = stock.price; 变量名要一样，如果非要用别的名称可以使用：{code:codex,price}取别名的方式 如果对象中的属性又是一个对象，例如： function getStock(){ return{ code:"IBM", price:{ price1:200, price2:400 }}} 这时候，{code,price}中，price取到的就是一个对象，包含price1:200,price2:400,如果非要取其中的一个值的话，可以再使用一个析构表达式：{code,price:{price2}}就可以以取出price2的值了。如果getStock中还有其他属性，是不影响这个取值的。 从数组中取值到本地变量 var arr1 = [1,2,3,4]; var [number1,number2] = array1; 与对象的析构不同的是，数组是用[]来括起来，对象是用{}括出来，如果要拿第3个和第4个话， 这样使用[,,number1,number2] 还有一个使用方式[number1,number2,...others]表示数组中第1和第2个元素分别放到number1和number2中，剩下的，以数组的方式放到others变量中去。 析构表达式作为方法的参数： var arr1 = [1,2,3,4]; function doSomething([number1,number2,...others]){ console.log(number1); console.log(number2); console.log(number3);} doSomething(array1); 这样便会将数组中的值析构到数组中去，方式和上面的一样。查看全部
-
函数新特性之generator函数：控制函数的执行过程，手工暂停和恢复代码执行 声明方法，在function后面另*号， function* countAppleSales () { var saleList = [3, 7, 5]; for (var i = 0; i < saleList.length; i++) { yield saleList[i]; } } var appleStore = countAppleSales(); // Generator { } console.log(appleStore.next()); // { value: 3, done: false } console.log(appleStore.next()); // { value: 7, done: false } console.log(appleStore.next()); // { value: 5, done: false } console.log(appleStore.next()); // { value: undefined, done: true } 需要把方法声明成一个方法，然后再使用变量的next（）方法； yield;用来暂停，调用函数的next方法，方法才会继续执行； value是yield后面表达式的值，done代表函数有没有完全执行完成查看全部
-
Typescipt中封装函数可以传模板参数，但是方法不需要括号了，只需要有单撇号。eg：test`baba`查看全部
-
es5语法是js,es6是ts查看全部
-
2.默认参数 在参数声明后面使用等号来指定参数的默认值： var myName: string = "zhangsan"; 给方法的参数指定默认值： var testFun = function (a: string, b: string, c: string = "jojo") { console.log(a); console.log(b); console.log(c); } testFun("aa", "bb", "cc"); testFun("aa", "bb"); 注意：在未给方法参数指定默认值的情况下，调用出方法参数个数必需和声明中参数个数一致，另外带默认值的参数只能声明在最后面 3.可选参数 在方法的参数声明后面用文号来标明该参数为可选参数 var testFun = function (a: string, b?: string, c: string = "jojo") { console.log(a); console.log(b); console.log(c); } testFun("aa"); 需要注意的问题:a.方法内处理可选参数不传入的情况，避免发生异常. b.可选参数不能声明在必选参数的前面，智能声明在必选参数的后面.查看全部
-
参数新特性 1.在参数名称后面使用冒号指定参数的类型 var myName: string = "caijw"; myName = 13; 此时编辑器会检查变量类型并给出对应提示，帮助开发人员减少问题产生，需要注意的是该提醒尽在TypeScript编辑器中出现 var nick = "cc"; nick = 13; 这两句代码，TypeScript编辑器同样会给出错误提示.(基于类型推断机制) var nick: any = "cc"; nick = 13; 声明字符串时同时显式声明类型any，这样既可以赋值字符串也可赋值数字 var age: number = 13; var correct: boolean = true; 提示异常： var testFun = function (): void { return ""; }; 正确写法： var testFun = function (): string { return ""; }; 还可以限定方法参数的类型 var testFun = function (name: string) :string { return name; } 自定义类型： class Person { name: string; age: number } var caijw: Person = new Person(); caijw.name = "caijw"; caijw.age = 23;查看全部
-
自动拆分字符串 字符串模板调用方法时，字符串模板中的表达式的值会自动被赋给被调用方法的参数 var test = function (template, name, age) { console.log(template); console.log(name); console.log(age); } var myName = "caijw"; var getAge = function () { return 18; } test `Hello my name is ${myName},I'm ${getAge()}`; 输出JS： var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) { if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; } return cooked; }; var test = function (template, name, age) { console.log(template); console.log(name); console.log(age); }; var myName = "caijw"; var getAge = function () { return 18; }; test(__makeTemplateObject(["Hello my name is ", ",I'm ", ""], ["Hello my name is ", ",I'm ", ""]), myName, getAge()); 解析：test `Hello my name is ${myName},I'm ${getAge()}`; 双撇号内容除去表达式即为test函数第一个参数的值 第一个表达式${myName}即为第二个参数的值 第二个表达式${getAge()}即为第三个参数的值查看全部
-
字符串新特性 多行字符串，使用数字键1左侧双撇号 字符串模板，多行字符串中使用变量或调用方法 var myName = "caijw"; var getName_fun = function () { return "caijw"; } console.log(`Hello ${myName}`); console.log(`Hello ${getName_fun}`); console.log(`<div> <div> <span>span1</span> <span>span2</span> </div> </div>`); 输出JS： var myName = "caijw"; var getName_fun = function () { return "caijw"; }; console.log("Hello " + myName); console.log("Hello " + getName_fun); console.log("<div>\n <div>\n <span>span1</span>\n <span>span2</span>\n </div>\n</div>");查看全部
-
搭建TypeScript的开发环境 1.什么是compiler？为什么需要compiler？ 编译器，将TypeScript代码转为JavaScript的代码。 因为ES6规范是在2015年发布，目前主流浏览器并没有完全支持ES6规范，所以TypeScript的程序不能直接放到浏览器中去执行，这就需要我们先将TypeScript的代码转换JavaScript代码。 2.使用在线compiler开发(线上compiler) 浏览器搜索TypeScript-->进入官网-->Playground菜单项，进入TypeScript在线compiler界面，左侧TypeScript代码，右侧既是转换的JavaScript代码。 3.本地的TypeScript编译器(线下编译器) 安装TypeScript编译器 a.安装node.js，获得命令行npm b.命令行窗口运行npm --version查看版本信息 c.安装TypeScript，使用命令：npm install -g typescript(-g代表全局安装，使用该参数安装的TypeScript后命令行工具在任何目录下都可以调用) 如果使用代理网络，提示代理有问题: $ npm config set proxy http://xx@xx.com:xxxx $ npm config set https-proxy=http://xx@xx.com:xxxx 取消代理设置 $ npm config set proxy null $ npm config set https-proxy null 输入tsc --version验证TypeScript是否安装成功 d.使用 新建Hello.ts，命令行进入该文件所在目录，运行命令：tsc Hello.ts e.IDE开发 安装WebStorm查看全部
举报
0/150
提交
取消