SAP资深技术专家Jerry Wang的分享

如果map操作里的返回值没有被使用，那么map可以被forEach替换。

通过 & 运算符可以将现有的多种类型叠加到一起成为一种类型：type PointX = { x: number; };type PointY = { y: number; }type Point = PointX & PointY;const point:Point = { x: 1, y: 1};编译之后的JavaScript代码：var point = { x: 1, y: 1 };...

在SAP Spartacus的源代码里我们可以观察到很多Partial的使用场景：Partial 可以快速把某个接口类型中定义的属性变成可选的(Optional)：interface People { age: number; name: string;}const Jerry:People = { age: 10, name: 'Jerry'};const Tom: People = { name: 'Tom'}上述代码会发生编译时错误：1.ts:11:7 -

当左侧操作数为 null 或 undefined 时，其返回右侧的操作数，否则返回左侧的操作数。例子：const foo = null ?? 'default string';编译后的JavaScript代码：var _a;var foo = (_a = null) !== null && _a !== void 0 ? _a : 'default string';可见，这个例子，foo必定为default string, 因为编译后的JavaScript代码里，已经能看到n

用途：遇到null或者undefined时可以立即停止表达式的运行。看个例子：let a = { b: 1};const val = a?.b;编译之后生成的JavaScript代码：var a = { b: 1 };var val = a === null || a === void 0 ? void 0 : a.b;可见，如果a为null或者void 0，会直接返回void 0，而不会接着执行a.b因此，以后我们可以不需要编写形如if( a && a.b){}

我的博客即将同步至 OSCHINA 社区，这是我的 OSCHINA ID：JerryWang_SAP，邀请大家一同入驻：https://www.oschina.net/sharing-plan/apply

# Created by Jerry Wang, last modified on Dec 01, 2014 如果UI上遇到如下error message：...

网址：https://stackblitz.com/新建一个Angular应用，类型选择RxJS：StackBlitz会自动生成应用模板：源代码：import { of } from 'rxjs'; import { map } from 'rxjs/operators';const source = of('World').pipe( map(x => `Hello ${x}!`));source.subscribe(console.log);import { Ob

引起错误的TypeScript代码：test(){ const a = () => ({ a , b = 2 } = {}): number => 11; }该编译错误的解决方法1test(){ const a = () => ({ a , b = 2 }:any = {}): number => 11; }解法2test(){ const a = () => ({ a = 1, b = 2 } = {}): number =&g

const a = () => ({ a = 1, b = 2 } = {}): number => 11;编译之后生成的JavaScript函数：var a = function () { return function (_a) { var _b = _a === void 0 ? {} : _a, _c = _b.a, a = _c === void 0 ? 1 : _c, _d = _b.b, b = _d === void 0 ? 2 : _d; return 1

const fun = ({ aa = 1, bb = 0 } = {}) => { console.log('aa: ' + aa); console.log('bb: ' + bb); return 'hello'; }document.body.innerHTML = fun(); 使用tsc进行编译：生成的JavaScript代码：var fun = function (_a) { var _b = _a === void 0

例子：private get activeBaseSite(): string { return ( this._activeBaseSite ?? getContextParameterDefault(this.config, BASE_SITE_CONTEXT_ID) ); }语法：private get 属性名():返回类型{}运行时调试：Object.defineProperty:什么时候填充的？这个前面加了_前缀的activeB

https://stackoverflow.com/questions/35019987/what-does-declare-do-in-export-declare-class-actionsvar creates a new variable. declare is used to tell TypeScript that the variable has been created elsewhere. If you use declare, nothing is added to the Java

在SAP Spartacus的实现里有很多.d.ts文件：https://www.typescriptlang.org/docs/handbook/declaration-files/templates/module-d-ts.html相当于commonJS的module pattern.回忆一下commonJS：Node 应用由模块组成，采用 CommonJS 模块规范。每个文件就是一个模块，有自己的作用域。在一个文件里面定义的变量、函数、类，都是私有的，对其他文件不可见。// exampl

By writing declare var angular you are simply telling Typescript to trust you that it exists, even though it hasn’t seen it be imported into the scope of this file.https://stackoverflow.com/questions/56048760/why-is-declare-var-angular-necessary-when-usin

args可以传递任意数量的参数，返回类型是T：

看下面这个TypeScript函数：function identity(arg: any): any { return arg;}虽然使用any类型后这个函数已经能接收任何类型的arg参数，但是却丢失了一些信息：传入的类型与返回的类型应该是相同的。 通过any类型，无法实现这个约束。因此，需要一种方法使返回值的类型与传入参数的类型是相同的。 这里，我们使用了类型变量，它是一种特殊的变量，只用于表示类型而不是值。function identity<T>(arg: T): T {

例子：let myAdd: (x:number, y:number)=>number = function(x: number, y: number): number { return x+y; };函数参数列表和返回值类型之前，用=>分隔：生成的JavaScript代码：var myAdd = function (x, y) { return x + y; };...

TypeScript的对象可以同时做为函数和对象使用，并带有额外的属性。interface Counter { (start: number): string; interval: number; reset(): void;}function getCounter(): Counter { let counter = <Counter>function (start: number) { }; counter.interval = 123;

TypeScriptinterface Shape { color: string;}interface Square extends Shape { sideLength: number;}let square = <Square>{};square.color = "blue";square.sideLength = 10;对应生成的JavaScript：var square = {};square.color = "blue";square.

TypeScriptinterface ClockInterface { currentTime: Date;}class Clock implements ClockInterface { currentTime: Date; constructor(private h: number, private m: number) { this.currentTime = new Date(); }}JavaScriptvar Clock = /** @clas

可选属性interface SquareConfig { color?: string; width?: number;}function createSquare(config: SquareConfig): {color: string; area: number} { let newSquare = {color: "white", area: 100}; if (config.color) { newSquare.color = config.color; }

通过类型断言这种方式可以告诉编译器，“相信我，我知道自己在干什么”。 类型断言好比其它语言里的类型转换，但是不进行特殊的数据检查和解构。 它没有运行时的影响，只是在编译阶段起作用。 TypeScript会假设开发人员已经进行了必须的检查。类型断言有两种形式。 其一是“尖括号”语法：let someValue: any = "this is a string";let strLength: number = (<string>someValue).length;第二种形式是as语法：

本文内容部分来自：https://www.w3cschool.cn/typescript/typescript-basic-types.htmlany有时候，我们会想要为那些在编程阶段还不清楚类型的变量指定一个类型。 这些值可能来自于动态的内容，比如来自用户输入或第三方代码库。 这种情况下，我们不希望类型检查器对这些值进行检查而是直接让它们通过编译阶段的检查。 那么我们可以使用 any类型来标记这些变量：let notSure: any = 4;notSure = "maybe a string i

TypeScript在构造函数参数中使用public是一种简写形式，它将自动创建具有该名称的属性：class Student { fullName: string; constructor(public firstName, public middleInitial, public lastName) { this.fullName = firstName + " " + middleInitial + " " + lastName; }}interface

使用interface关键字定义一个接口，它描述了具有firstName和lastName字段的对象。在TypeScript中，如果两个类型其内部结构兼容，那么这两种类型兼容。这使我们实现一个接口，仅仅只需必要的结构形状，而不必有明确的implements子句。interface Person { firstName: string; lastName: string;}function greeter(person: Person) { return "Hello, " +

命令行：npm install -g typescript新建一个TypeScript文件，粘贴如下内容：function greeter(person) { return "Hello, " + person;}var user = "Jane User";document.body.innerHTML = greeter(user); 使用命令行tsc 1.ts编译，得到一个同名的JavaScript文件：新建一个html，将1.js的代码粘贴进去：最后的效果：