TypeScript&JavaScript 容易忽略的知识点

TypeScript & JavaScript 学习笔记

记录学习TypeScript，Js过程中遇到的一些问题

• TypeScript中type关键字： 一种用法是 JsonPrimitive = null| boolean| string| number 这种是union type, 可以理解为这是一种类型的集合
• TypeScript可以理解为Js的超集，即在Js的基础上增加静态类型检查等等
• JavaScript中的 Promise 是抽象异步处理对象以及对其进行各种操作的组件，即对于异步的处理抽象并提供了标准的错误处理，以及回调机制
• Promise an object that will return a value in future. Promise非常适合于异步的JavaScript编程。
• Promise 和 Callback 本质上是等价的，但是Promise有着如下一些优点
• Promise减少了很多嵌套代码，reduce the amount of nested code
• Promise 允许简单的可视化执行流程
• Promise 可以统一的在最后的chain中处理错误， chargeCustomer(customer).then(_ => addToDatabase(customer)).then(_ => sendEmail(customer) ).then(result => res.send('success!'))).catch(err => console.log(err))
• Promise 状态，通过new Promise实例化的promise对象有以下三种状态
• has-resolution - Fulfilled: resolve成功，此时会调用 onFulfilled
• has-rejection - Rejected: reject失败，此时会调用 onRejected
• unresolved - Pending 既不是resolve，也不是reject，Promise对象刚被创建后的初始化状态


• Promise 初始化传入 resolve 和 reject 。 resolve 向then传递信息， reject 向 catch 传递信息
• await/async try catch
• async/await 搭配使用处理异步流程即，一个 async function 通常会带有一个 await . 且 await 会暂停程序的执行流程直到 promise resolved ， await 只能在 async 函数体里面使用
• async function 会将结果包装成一个Promise返回
• TypeScript： unknown 关键字和 any 关键字差不多。任何一个类型的值可以赋值给unknown，然而和 any 不一样的是：1. 不能访问unknown类型的属性（properties）, 2. 不能调用unknown，和构造（can't call/construct unknown type）。
• unknown 类型只能赋值给unknown，any类型，unknown类型的主要目的是在any类型的基础上加一些限制。

let foo: unknown = 10;
function hasXYZ(obj: any): obj is { x: any, y: any, z: any } {
    return !!obj &&
        typeof obj === "object" &&
        "x" in obj &&
        "y" in obj &&
        "z" in obj;
// Using a user-defined type guard...
if (hasXYZ(foo)) {
    // ...we're allowed to access certain properties again.
    foo.x.prop;
    foo.y.prop;
    foo.z.prop;
// We can also just convince TypeScript we know what we're doing
// by using a type assertion.
upperCase(foo as string);
function upperCase(x: string) {
    return x.toUpperCase();

• TypeScript中is关键字，通常用作于类型预测( type predicate )， 当TypeScript使用了 type predicate 之后，在代码块中将指定了对象的类型，有两个优点，即类型检查，和ide支持intelligence。
• TypeScript支持泛型（ generic , template ），泛型区别于any，设计泛型的关键是在于成员之间提供有意义的约束，即限定了所有以泛型类型传参的地方，泛型可以传递并捕获对象的类型信息，类似于类型约束，例如可以实现泛型的queue等等，泛型通常用于实现通用且可复用的组件。
• TypeScript中的const关键字即在变量声明时进行初始化，切const关键字不允许给已声明的变量重新赋值（ prevents re-assignment to a variable ）
• JavaScript中!!, 这个才操作符为执行!!两次，即将对象转换成相应的boolean， !Object //Inverted boolean !!Object //Non inverted boolean so true boolean representation
• TypeScript中void类型有点像 any 类型的对立面，通常void用于一个函数不返回任何值 function warnUser(): void{}
• JavaScript中有迭代器（iterator）的概念, 同步迭代器( Symbol.iterator ), 异步迭代器( Symbol.asyncIterator )
• JavaScript中 function* 声明一个方法，即该方法为生成器方法 generator function ，该方法的返回值为生成器 Generator , 调用 generator function 时并不是立即执行generator的代码，而是返回一个iterator对象，当返回的generator的next函数被调用时才会实际执行generator的代码. 即对 Generator 进行 for of 遍历时，会调用实际执行的代码。
• generator function 通过 yeild 来返回值，通过 yeild* 来调用其他 generator function （delegate to another generator function）。
• 当 generator function 完成之后，iterator的next方法，将不会执行generator中的相应代码，而是仅仅返回 {value: undefined, done: true}
• TypeScript中 readonly 和 const 类似，即都为避免变量或者属性被重新赋值。 readonly for a property , const for a vairable reference 。 readonly 是alias时，可以被修改
• TypeScript中 Intersection Types : 即将多种type组合成一个type, 例如 Person & Serializable & Loggable 即创建一些Mixin的类型
• TypeScript中 Union Types : 与 Intersection Types 不同，即对象是指定Union Types中的任意一个即可，通常用于类型检查， intelligence support 等等
• Jest : 单元测试工具, 可以搭配mocha测试框架进行使用
• JavaScript中， primitive (primitive data type) 类型不是一个对象或者方法， primitive 包括string， number，bigint， boolean， null, undefined , symbol。以上所有类似都是immutable
• JavaScript中 array , object , set 等都是mutable
• JavaScript中"..."运算符. 1.在函数定义的参数结尾： rest parameters 将其他参数放入一个array中。2. 在函数调用时，此时称之为 spread operator . 即将array参数展开成一个list
• BOM: Byte order mark : Unicode 字符，U_FEFF，可以理解为出现在文本text前的 magic number ，用来声明和提示文字处理软件如何组织处理该文件。 可以用来指定字节序，并声明该文件是Unicode字符集. 注意：在当Js处理这种类型文件的json，进行Parse时，会报错
• Javascript string.indexof("#") : 返回字符串中具体字符第一次出现的位置，如果没有出现则返回-1
• Node中 child-processes 模块提供了子进程 child process 相关功能，其中 child_process.exec() : 即为在一个新的shell里执行命令并返回结果
• TypeScript中type类型可以为带有具体属性的object类型，例如：可以如下声明 export type Command = | { readonly config: readonly ['user.email' | 'user.name', string] } | { readonly init: readonly [] }
• Node中 process.cwd() 指 Node Process 进程的工作目录，可以理解为在哪个目录下调用node命令。然而 __dirname 返回的是JavaScript的源码位置目录
• JavaScript中可以通过返回array或者object返回多值，且有两种处理方法, 通过先获取返回值再分配值，或者使用 ES6 语法 destructuring assignment 来完成
  
• array: var values = getValues(); var a = values[0], var b = values[1], const [first , second] = getValues()
  
• object: var values = getValues(); var a = values.first, var b = values.second, const {first, second} = getValues(); 即将返回值赋值给具体 label , 变量名与Object中的key相对应
• JavaScript中 util.promisify 方法：将function中最后一个参数是 callback function 且参数为(err, value)形式。则util.promisify则将会返回 promise
• JavaScript中关于函数参数的三种规则：
• JavaScript函数定义不需要指定函数参数的类型
• JavaScript传参数时也不会进行类型检查 （TypeScript进行了限制）
• JavaScript也不会检查所接受参数的数量
• npm install -g . 将本地目录安装到本机的 node_module 中， npm install -D : -D 为 --save-dev
• JavaScript中或其他开源项目都应当遵守 semantic version ，version number为1.2.3， 即major version, minor version, patch version. ~ tilde 匹配最近的 patch version(the third number) , ^ 更宽松匹配最近的 minor version
• JavaScript中可以支持 multiple arrow function , 这种函数即称之为 curried function . 这种函数需要注意其 return value . 具体可参考 stackoverflow multiple arrow .
  
• 关于 curried function ，重点需要关注 return value
  

const add = (x, y) => x+y
const curriedAdd = x => y => x+y
const originAdd = function(x){
    return function(y){
        return x + y