Type script note,

clean code methods.

1. Type Aliases

type Point = {
  x: number;
  y: number;
};
 
// Exactly the same as the earlier example
function printCoord(pt: Point) {
  console.log("The coordinate's x value is " + pt.x);
  console.log("The coordinate's y value is " + pt.y);
}
 
printCoord({ x: 100, y: 100 });

2. Optional Properties

Object types can also specify that some or all of their properties are optional. To do this, add a ? after the property name:

function printName(obj: { first: string; last?: string }) {
  // ...
}
// Both OK
printName({ first: "Bob" });
printName({ first: "Alice", last: "Alisson" });

if want to get mutil member, use < > turn to type

function getLength(something: string | number): number {
    if ((<string>something).length) {
        return (<string>something).length;
    } else {
        return something.toString().length;
    }
}

:::

3. Interfaces

An interface declaration is another way to name an object type:

interface Point {
  x: number;
  y: number;
}
 
function printCoord(pt: Point) {
  console.log("The coordinate's x value is " + pt.x);
  console.log("The coordinate's y value is " + pt.y);
}
 
printCoord({ x: 100, y: 100 });

4. Interface and type different

An interface declaration is another way to name an object type:

5. only typescript funtion use no return on (void)

function alertName(): void {
    alert('My name is Tom');
}

6. Function Expression

mySum is funtion name

mySum(x,y)

return type is "number"

let mySum = function (x: number, y: number): number {
    return x + y;
};

let mySum: (x: number, y: number) => number = function (x: number, y: number): number {
    return x + y;
};

Good define funtion

interface SearchFunc {
    (source: string, subString: string): boolean;
}

let mySearch: SearchFunc;
mySearch = function(source: string, subString: string) {
    return source.search(subString) !== -1;
}

7. Argument default value methods

setting default value

lastName: string = 'Cat'

funtion example

function buildName(firstName: string, lastName: string = 'Cat') {
    return firstName + ' ' + lastName;
}
let tomcat = buildName('Tom', 'Cat');
let tom = buildName('Tom');

buildName('Tom', 'Cat');

buildNmae funtion is input two value in funtion

But, have setting defalut second member , so if send one value be run it.

buildName('Tom') is ok 

8. ES6 rest

this ",…rest" be last input member is rules

function push(array: any[], ...items: any[]) {
    items.forEach(function(item) {
        array.push(item);
    });
}

let a = [];
push(a, 1, 2, 3);

9. OverLoad

function reverse(x: number): number;
function reverse(x: string): string;
function reverse(x: number | string): number | string {
    if (typeof x === 'number') {
        return Number(x.toString().split('').reverse().join(''));
    } else if (typeof x === 'string') {
        return x.split('').reverse().join('');
    }
}

10. Type Assertion

<type>vaule

function getLength(something: string | number): number {
    if ((<string>something).length) {
        return (<string>something).length;
    } else {
        return something.toString().length;
    }
}

value as type

let code: any = 123; 
let employeeCode = code as number;

11.export and declare

enum

declare enum Directions {
    Up,
    Down,
    Left,
    Right
}

export default Directions;

12. operators

名稱	簡化的運算子	意義
賦值	(en-US) x = y	x = y
加法	(en-US)賦值 (en-US) x += y	x = x + y
減法	(en-US)賦值 (en-US) x -= y	x = x - y
乘法	(en-US)賦值 (en-US) x *= y	x = x * y
除法	(en-US)賦值 (en-US) x /= y	x = x / y
餘數	(en-US)賦值 (en-US) x %= y	x = x % y
指數	(en-US)賦值 (en-US) x **= y	x = x ** y
左移賦值	(en-US) x <<= y	x = x << y
右移賦值	(en-US) x >>= y	x = x >> y
無號右移賦值	(en-US) x >>>= y	x = x >>> y
位元	AND 賦值 (en-US) x &= y	x = x & y
位元	XOR 賦值 (en-US) x ^= y	x = x ^ y
位元	OR 賦值 (en-US) x	= y

運算子	描述	會回傳 True 的例子
等於 (en-US)	(==) 假如運算元等價就回傳 True。	3 == var1 "3" == var1 3 == '3'
不等於 (en-US)	(!=) 假如運算元等價就回傳 True。	var1 != 4 var2 != "3"
嚴格等於 (en-US)	(===) 假如運算元具有相同型態且等價則回傳 True。	參考 Object.is (en-US) 及 JS 中的等價性。 3 ===
嚴格不等於 (en-US)	(!==) 假如運算元具有相同型態但不等價，或是具有不同型態，回傳 True。	var1 !== "3" 3 !== '3'
大於 (en-US)	(>) 假如左方運算元大於右方運算元，回傳 True。	var2 > var1 "12" > 2
大於或等於 (en-US)	(>=) 假如左方運算元大於或等於右方運算元，回傳 True。	var2 >= var1 var1 >= 3
小於 (en-US)	(<) 假如左方運算元小於右方運算元，回傳 True。	var1 < var2 "2" < 12
小於或等於 (en-US)	(<=) 假如左方運算元小於或等於右方運算元，回傳 True。	var1 <= var2 var2 <= 5