日期: 2017 年 10 月 26 日

此指令執行
npm install -g webpack webpack-dev-server typescript –verbose
會出現 npm ERR! Please try running this command again as root/Administrator
網路上的解法是用sudo，
但為windows環境，
找到的解法是加上–no-optional參數就可正確執行了
npm install -g webpack webpack-dev-server typescript –verbose –no-optional

1.class.ts

    
//1.class
console.log('1.class');
class House {
    //private door: number;
    constructor(public door: number) {
        this.door = door;
    }
    
    getDoor(width: number, height: number) {
        console.log('size: ' + (width * height * this.door));
    }
    
    public retriveDoor() {
        return this.door;
    }
}

let house = new House(5);
house.getDoor(20, 30);

class NewHouse extends House {
    name: string;
    constructor(door: number, name: string) {
        super(door);
        this.name = name;        
    }
    
    getDoor(width: number, height: number) {
        console.log('name: ' + this.name);
        console.log('door: ' + super.retriveDoor());
        super.getDoor(width, height);
    }
}

let newHouse = new NewHouse(5, 'Grace');
newHouse.getDoor(25, 30);

//2.class
console.log('2.abstract class');
abstract class Shape {
    abstract area(): number;
    myname(): void {
        console.log('My name is shape');
    }
}

class Rect extends Shape {
    area(): number {
        return 100;
    }
}

let shape: Shape;
//error TS2511: Cannot create an instance of the abstract class 'Shape'
//shape = new Shape();
shape = new Rect();
console.log('shape.area(): ' + shape.area());
    
  

2.compiler
tsc class.ts

3.產出的 class.js

    
var __extends = (this && this.__extends) || (function () {
    var extendStatics = Object.setPrototypeOf ||
        ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
        function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
    return function (d, b) {
        extendStatics(d, b);
        function __() { this.constructor = d; }
        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
    };
})();
//1.class
console.log('1.class');
var House = /** @class */ (function () {
    //private door: number;
    function House(door) {
        this.door = door;
        this.door = door;
    }
    House.prototype.getDoor = function (width, height) {
        console.log('size: ' + (width * height * this.door));
    };
    House.prototype.retriveDoor = function () {
        return this.door;
    };
    return House;
}());
var house = new House(5);
house.getDoor(20, 30);
var NewHouse = /** @class */ (function (_super) {
    __extends(NewHouse, _super);
    function NewHouse(door, name) {
        var _this = _super.call(this, door) || this;
        _this.name = name;
        return _this;
    }
    NewHouse.prototype.getDoor = function (width, height) {
        console.log('name: ' + this.name);
        console.log('door: ' + _super.prototype.retriveDoor.call(this));
        _super.prototype.getDoor.call(this, width, height);
    };
    return NewHouse;
}(House));
var newHouse = new NewHouse(5, 'Grace');
newHouse.getDoor(25, 30);
//2.class
console.log('2.abstract class');
var Shape = /** @class */ (function () {
    function Shape() {
    }
    Shape.prototype.myname = function () {
        console.log('My name is shape');
    };
    return Shape;
}());
var Rect = /** @class */ (function (_super) {
    __extends(Rect, _super);
    function Rect() {
        return _super !== null && _super.apply(this, arguments) || this;
    }
    Rect.prototype.area = function () {
        return 100;
    };
    return Rect;
}(Shape));
var shape;
//error TS2511: Cannot create an instance of the abstract class 'Shape'
//shape = new Shape();
shape = new Rect();
console.log('shape.area(): ' + shape.area());
    
  

4.執行結果

1.fnuc.ts

//1.two parameter
console.log('1.two parameter');
function max1(x: number, y: number): number {
    return (x > y) ? x : y;
}

let result_max1 = max1(33, 66);
console.log('result_max1: ' + result_max1);

//2.1 ~ 2 parameter
console.log('2.1 ~ 2 parameter');
function max2(x: number, y?: number): number {
    if (y)
        return (x > y) ? x : y;
    else
        return x;
}

let result_max2 = max2(33);
console.log('result_max2: ' + result_max2);

//3.default parameter
console.log('3.default parameter');
function max3(x: number, y = 44): number {
    return (x > y) ? x : y;    
}

let result_max3_1 = max3(33);
console.log('result_max3_1: ' + result_max3_1);

let result_max3_2 = max3(33, 22);
console.log('result_max3_2: ' + result_max3_2);

let result_max3_3 = max3(33, undefined);
console.log('result_max3_3: ' + result_max3_3);

//4.first default parameter
console.log('4.first default parameter');
function max4(x: number = 44, y : number): number {
    return (x > y) ? x : y;    
}

let result_max4_1 = max4(undefined, 33);
console.log('result_max4_1: ' + result_max4_1);

let result_max4_2 = max4(22, 33);
console.log('result_max4_2: ' + result_max4_2);

//5.many paramter
console.log('5.many paramter');
function sum(x: number, ...numbers: number[]): number {
    let total = x;
    for (let idx = 0; idx < numbers.length; idx++)         total += numbers[idx];     return total; } let total = sum(1, 2, 3, 4, 5); console.log('total: ' + total); //6.function overload console.log('6.function overload'); function func(config: number[]); function func(config: number, value: number); function func(config: string, value: string); function func(config: any, value?: any) {     console.log('config: ' + config);     console.log('value: ' + value); } console.log('func ==> ');
func([5, 6]);
console.log('func ==> ');
func('test1', 'test2');
console.log('func ==> ');
func(1, 2);

//7.this
console.log('7.this');
let data = {
    datas: ['data1', 'data2', 'data3', 'data4'],
    dataPicker: function() {
        return () => {
            let pickedIdx = Math.floor(Math.random() * 4);
            return this.datas[pickedIdx];
        }
    }
}

let pickData = data.dataPicker();
console.log('pickData(): ' + pickData());
    

2.compiler
tsc func.ts

3.產出的 func.js

//1.two parameter
console.log('1.two parameter');
function max1(x, y) {
    return (x > y) ? x : y;
}
var result_max1 = max1(33, 66);
console.log('result_max1: ' + result_max1);
//2.1 ~ 2 parameter
console.log('2.1 ~ 2 parameter');
function max2(x, y) {
    if (y)
        return (x > y) ? x : y;
    else
        return x;
}
var result_max2 = max2(33);
console.log('result_max2: ' + result_max2);
//3.default parameter
console.log('3.default parameter');
function max3(x, y) {
    if (y === void 0) { y = 44; }
    return (x > y) ? x : y;
}
var result_max3_1 = max3(33);
console.log('result_max3_1: ' + result_max3_1);
var result_max3_2 = max3(33, 22);
console.log('result_max3_2: ' + result_max3_2);
var result_max3_3 = max3(33, undefined);
console.log('result_max3_3: ' + result_max3_3);
//4.first default parameter
console.log('4.first default parameter');
function max4(x, y) {
    if (x === void 0) { x = 44; }
    return (x > y) ? x : y;
}
var result_max4_1 = max4(undefined, 33);
console.log('result_max4_1: ' + result_max4_1);
var result_max4_2 = max4(22, 33);
console.log('result_max4_2: ' + result_max4_2);
//5.many paramter
console.log('5.many paramter');
function sum(x) {
    var numbers = [];
    for (var _i = 1; _i < arguments.length; _i++) {
        numbers[_i - 1] = arguments[_i];
    }
    var total = x;
    for (var idx = 0; idx < numbers.length; idx++)         total += numbers[idx];     return total; } var total = sum(1, 2, 3, 4, 5); console.log('total: ' + total); //6.function overload console.log('6.function overload'); function func(config, value) {     console.log('config: ' + config);     console.log('value: ' + value); } console.log('func ==> ');
func([5, 6]);
console.log('func ==> ');
func('test1', 'test2');
console.log('func ==> ');
func(1, 2);
//7.this
console.log('7.this');
var data = {
    datas: ['data1', 'data2', 'data3', 'data4'],
    dataPicker: function () {
        var _this = this;
        return function () {
            var pickedIdx = Math.floor(Math.random() * 4);
            return _this.datas[pickedIdx];
        };
    }
};
var pickData = data.dataPicker();
console.log('pickData(): ' + pickData());
    

4.執行結果

1.basicType.ts

//1.boolean
console.log('1.boolean');

let flag: boolean = true;
console.log('flag: ' + flag);

//2.number
console.log('2.number');

let binaryLiteral: number = 0b11010;
let octalLiteral: number = 0o622;
let decLiteral: number = 12;
let hexLiteral: number = 0xb00a;

console.log('binaryLiteral :' + binaryLiteral);
console.log('octalLiteral :' + octalLiteral);
console.log('decLiteral :' + decLiteral);
console.log('hexLiteral :' + hexLiteral);

//3.string
console.log('3.string');

let prog: string = "Angular 2";
let seconds: number = 55;
let data: string = `這程式是 ${prog}, 經過 ${ seconds } 秒`;

console.log('prog :' + prog);
console.log('seconds :' + seconds);
console.log('data :' + data);

//4.number array
console.log('4.number array');
let numarr1: number[] = [4, 3, 2, 1];
let numarr2: Array = [1, 2];

console.log('numarr1.length :' + numarr1.length);
numarr1.forEach(function (num1) {
    console.log('num1: ' + num1);
}.bind(this));

console.log('numarr2.length :' + numarr2.length);
numarr2.forEach(function (num2) {
    console.log('num2: ' + num2);
}.bind(this));

//5.mix array
console.log('5.mix array');
let mixarr: [string, string, number, number];
mixarr = ['string1', 'string2', 2, 1];

console.log('mixarr.length :' + mixarr.length);
mixarr.forEach(function (data1) {
    console.log('data1: ' + data1);
}.bind(this));

//6.enum
console.log('6.enum');
enum Shape { Circle, Rect, Oval };
let s: Shape = Shape.Oval;
console.log('s: ' + s);

enum Shape2 { Circle = 9, Rect, Oval = 6 };
let s2: Shape2 = Shape2.Rect;
console.log('s2: ' + s2);

//7.any
console.log('7.any');
let any1: any = 1;
console.log('any1: ' + any1);
//console.log('any1.ifItExists(): ' + any1.ifItExists());
console.log('any1.toFixed(): ' + any1.toFixed());

any1 = '程式';
console.log('any1: ' + any1);
//console.log('any1.ifItExists(): ' + any1.ifItExists());
//console.log('any1.toFixed(): ' + any1.toFixed());

any1 = false;
console.log('any1: ' + any1);
//console.log('any1.ifItExists(): ' + any1.ifItExists());
//console.log('any1.toFixed(): ' + any1.toFixed());

let array: any[] = [ true, "hello", 333 ];
array.forEach(function (arrdata1) {
    console.log('arrdata1: ' + arrdata1);
}.bind(this));

array[2] = "yes";
array.forEach(function (arrdata2) {
    console.log('arrdata2: ' + arrdata2);
}.bind(this));

//8.null and undefined
console.log('8.null and undefined');
let nulldata : number;
nulldata = 3;
console.log('nulldata: ' + nulldata);

nulldata = undefined;
console.log('nulldata: ' + nulldata);

nulldata = null;
console.log('nulldata: ' + nulldata);

let nulldata2 : number | undefined;
nulldata2 = 3;
console.log('nulldata2: ' + nulldata2);

nulldata2 = undefined;
console.log('nulldata2: ' + nulldata2);

nulldata2 = null;
console.log('nulldata2: ' + nulldata2);

let nulldata3 : number | null | undefined;
nulldata3 = 3;
console.log('nulldata3: ' + nulldata3);

nulldata3 = undefined;
console.log('nulldata3: ' + nulldata3);

nulldata3 = null;
console.log('nulldata3: ' + nulldata3);

//9.void
console.log('9.void');
function func1(): void {
    console.log('test for func1()');
}

func1();

//10.never
console.log('10.never');
let val1: never;
let val2: number;

//compiler => error TS2322: Type '333' is not assignable to type 'never'.
//val1 = 333;
//val1 = (() => { throw new Error('val1: Exception occur for nerver') })();
//val2 = (() => { throw new Error('val2: Exception occur for nerver') })();

//11.const
const CONSTVAL = 123;
const hello = {
  title: "Hi",
  content: CONSTVAL
};

console.log('hello.title: ' + hello.title);
console.log('hello.content: ' + hello.content);

//12.數值結構
console.log(`12.數值結構`);
let fromData = [1, 3];
let [one, three] = fromData;

console.log('one: ' + one);
console.log('three: ' + three);

function func2([first, second]: [number, number]) {
    console.log(first + second);
}

func2([33, 44]);

let [first, ...rest] = [4, 3, 2, 1];
console.log('first: ' + first);
console.log('rest: ' + rest);

//13.結構
console.log(`13.結構`);
let arraytest = { a: 3, b: 15, w: 6, h: 30};
let { a, b, w, h } = arraytest;
console.log(a, b, w, h);
    

2.compiler
tsc basicType.ts

3.產出的basicType.js

//1.boolean
console.log('1.boolean');
var flag = true;
console.log('flag: ' + flag);
//2.number
console.log('2.number');
var binaryLiteral = 26;
var octalLiteral = 402;
var decLiteral = 12;
var hexLiteral = 0xb00a;
console.log('binaryLiteral :' + binaryLiteral);
console.log('octalLiteral :' + octalLiteral);
console.log('decLiteral :' + decLiteral);
console.log('hexLiteral :' + hexLiteral);
//3.string
console.log('3.string');
var prog = "Angular 2";
var seconds = 55;
var data = "\u9019\u7A0B\u5F0F\u662F " + prog + ", \u7D93\u904E " + seconds + " \u79D2";
console.log('prog :' + prog);
console.log('seconds :' + seconds);
console.log('data :' + data);
//4.number array
console.log('4.number array');
var numarr1 = [4, 3, 2, 1];
var numarr2 = [1, 2];
console.log('numarr1.length :' + numarr1.length);
numarr1.forEach(function (num1) {
    console.log('num1: ' + num1);
}.bind(this));
console.log('numarr2.length :' + numarr2.length);
numarr2.forEach(function (num2) {
    console.log('num2: ' + num2);
}.bind(this));
//5.mix array
console.log('5.mix array');
var mixarr;
mixarr = ['string1', 'string2', 2, 1];
console.log('mixarr.length :' + mixarr.length);
mixarr.forEach(function (data1) {
    console.log('data1: ' + data1);
}.bind(this));
//6.enum
console.log('6.enum');
var Shape;
(function (Shape) {
    Shape[Shape["Circle"] = 0] = "Circle";
    Shape[Shape["Rect"] = 1] = "Rect";
    Shape[Shape["Oval"] = 2] = "Oval";
})(Shape || (Shape = {}));
;
var s = Shape.Oval;
console.log('s: ' + s);
var Shape2;
(function (Shape2) {
    Shape2[Shape2["Circle"] = 9] = "Circle";
    Shape2[Shape2["Rect"] = 10] = "Rect";
    Shape2[Shape2["Oval"] = 6] = "Oval";
})(Shape2 || (Shape2 = {}));
;
var s2 = Shape2.Rect;
console.log('s2: ' + s2);
//7.any
console.log('7.any');
var any1 = 1;
console.log('any1: ' + any1);
//console.log('any1.ifItExists(): ' + any1.ifItExists());
console.log('any1.toFixed(): ' + any1.toFixed());
any1 = '程式';
console.log('any1: ' + any1);
//console.log('any1.ifItExists(): ' + any1.ifItExists());
//console.log('any1.toFixed(): ' + any1.toFixed());
any1 = false;
console.log('any1: ' + any1);
//console.log('any1.ifItExists(): ' + any1.ifItExists());
//console.log('any1.toFixed(): ' + any1.toFixed());
var array = [true, "hello", 333];
array.forEach(function (arrdata1) {
    console.log('arrdata1: ' + arrdata1);
}.bind(this));
array[2] = "yes";
array.forEach(function (arrdata2) {
    console.log('arrdata2: ' + arrdata2);
}.bind(this));
//8.null and undefined
console.log('8.null and undefined');
var nulldata;
nulldata = 3;
console.log('nulldata: ' + nulldata);
nulldata = undefined;
console.log('nulldata: ' + nulldata);
nulldata = null;
console.log('nulldata: ' + nulldata);
var nulldata2;
nulldata2 = 3;
console.log('nulldata2: ' + nulldata2);
nulldata2 = undefined;
console.log('nulldata2: ' + nulldata2);
nulldata2 = null;
console.log('nulldata2: ' + nulldata2);
var nulldata3;
nulldata3 = 3;
console.log('nulldata3: ' + nulldata3);
nulldata3 = undefined;
console.log('nulldata3: ' + nulldata3);
nulldata3 = null;
console.log('nulldata3: ' + nulldata3);
//9.void
console.log('9.void');
function func1() {
    console.log('test for func1()');
}
func1();
//10.never
console.log('10.never');
var val1;
var val2;
//compiler => error TS2322: Type '333' is not assignable to type 'never'.
//val1 = 333;
//val1 = (() => { throw new Error('val1: Exception occur for nerver') })();
//val2 = (() => { throw new Error('val2: Exception occur for nerver') })();
//11.const
var CONSTVAL = 123;
var hello = {
    title: "Hi",
    content: CONSTVAL
};
console.log('hello.title: ' + hello.title);
console.log('hello.content: ' + hello.content);
//12.數值結構
console.log("12.\u6578\u503C\u7D50\u69CB");
var fromData = [1, 3];
var one = fromData[0], three = fromData[1];
console.log('one: ' + one);
console.log('three: ' + three);
function func2(_a) {
    var first = _a[0], second = _a[1];
    console.log(first + second);
}
func2([33, 44]);
var _a = [4, 3, 2, 1], first = _a[0], rest = _a.slice(1);
console.log('first: ' + first);
console.log('rest: ' + rest);
//13.結構
console.log("13.\u7D50\u69CB");
var arraytest = { a: 3, b: 15, w: 6, h: 30 };
var a = arraytest.a, b = arraytest.b, w = arraytest.w, h = arraytest.h;
console.log(a, b, w, h);
    

4.執行結果