2019-10-29 Typescript的基础数据类型和接口

//typescript
let a: string = 'hello2222';
console.log(a);

//枚举
enum Color{Red, Green, Blue};
let c: Color = Color.Green;
let colorName: string = Color[2];
console.log('color', c, colorName);

let notSure: any = 4;
notSure.toFixed();

let prettySure: Object = 4;
// prettySure.toFixed(); //error

// for (let i = 0; i < 10; i++) {
//     setTimeout(function() { console.log(i); }, 100 * i);
// }

let [, second, , fourth] = [1, 2, 3, 4];
console.log(second, fourth); //2 ,4

let o = {
    x: "foo",
    b: 12,
    c: "bar"
};
let { x, ...passthrough } = o;
let total = passthrough.b + passthrough.c.length;
console.log(total);

let {x: foostr, c: barstr} = o;
console.log(foostr, barstr); // <==> var foostr = o.x; var barstr = o.c;

//展开对象 
let sss = { y: 'hhh', z: 'eeee'};
let bothstr = {...sss, z: '8888'};
console.log(bothstr); //展开对象后面的属性会覆盖前面的属性

//Typescript的核心原则之一是对值所具有的结构进行类型检查
function ducktyping(duckstr: {id: string; value?: any}){
    duckstr.value = 'ducktypingssssss';
    console.log(duckstr.id);
}
var d = {id: 'ducktyping'};
ducktyping(d);

//interface的使用
interface LabelledValue {
    size?: number; 
    label?: string; //带有问号表示可选属性
    readonly value: number; //只读属性
}
function printLabel(labelledObj: LabelledValue){
    if(!labelledObj.label){
        labelledObj.label = 'hhhhha';
    }
    // labelledObj.value = 999; //error
    console.log(labelledObj.size, labelledObj.label);
}
// let myObj = {size: 10, label:'size 10 Object'};
let myObj = {size: 10, value: 998};
printLabel(myObj);

interface Point {
    readonly x: number;
    readonly y: number;
}
let p1:Point = {x: 10, y:10};
// p1.y =  20; //error y is a read-only property

//ReadonlyArray
let axxx: number[] = [1,2,3,4,5,6];
let ro: ReadonlyArray = axxx;
axxx.push(7);
axxx.length = 10;
console.log(axxx);
// ro.push(8); //error
// ro.length = 10;  //error
//如何判断该使用readonly或者const, 作为变量使用用const,作为属性使用则用readonly

//额外的属性检查
interface Squareconfig{
    width?: string;
    height?: string;
    [propName: string]: any;
}
function createSquare(config: Squareconfig):{area: string}{
    // let newConfig = {width: "1111", area: "9999"};
    // if(config.width){
    //     newConfig.width = config.width;
    // }
    // return newConfig;
    let newConfig = {...config, area: "100"};
    return newConfig; //return 不存在的属性不能分配
}
// createSquare({widtheee: "9999"} as Squareconfig);
let squareOptions = {widtheee: "9999xxx"};
let mySquare = createSquare(squareOptions);
console.log(mySquare);

//函数类型
interface SearchFunc{
    (source: string, substring: string): boolean
}
let mySearch: SearchFunc;
mySearch = function(src: string, sub: string): boolean{
 return true;
}

//可索引的类型
//类类型

//继承接口
interface Shape {
    color: string
}
interface PenStroke {
    penWidth: number;
}
interface Square extends Shape, PenStroke{
    sideLength: number;
}
let square = {};
square.color = "#ff0000";
square.sideLength = 10;
square.penWidth = 5.0;

//混合类型
//接口继承类