ソフトウェアエンジニアの技術ブログ：Software engineer tech blog

class User {
	constructor(private _name: string){
	}

	public sayHi(): void {
		console.log("hi i am" + this._name);
	}
	get name(){
		return this._name;
	}
	set name(newValue: string){
		this._name = newValue;
	}
}

var tom = new User("Tom");
console.log(tom.name);
tom.sayHi();
console.log(tom.name);
tom.sayHi();

class User {
	constructor(protected _name: string){
	}

	public sayHi(): void {
		console.log("hi i am" + this._name);
	}
}

class AdminUser extends User {
	private _age: number;
	construtor (_name: string, _age: number){
		super(_name);
		this._age = _age;
	}
	public sayHi(): void {
		console.log("my age: " + this._age);
		console.log("my name: " + this._name);
		super.sayHi();
	}
}

var bob = new AdminUser("Bob", 23);
bob.sayHi();

class User {
	name: string;
	constructor(name: string){
		this.name = name;
		User.count++;
	}
	sayHi(): void {
		console.log("hi! i am" + this.name);
	}
	static count: number = 0;
}

var tom = new User("Tom");
var bob = new User("Bob");
console.log(User.count);

// interface
interface Result{
	a: number;
	b: number
}

function getTotal(result: Result){
	return result.a + result.b;
}

var result = {
	a: 32,
	b: 55
};

console.log(getTotal(result));

// interface
interface SpringResult {
	a: number;
}
interface FallResult {
	b: number;
}
interface FinalResult extends SpringResult, FallResult{
	final: number;
}


function getTotal(result: FinalResult){
	return result.a + result.b + result.final;
}

var result = {
	a: 32,
	b: 55,
	final: 67
};

console.log(getTotal(result));

interface GameUser{
	socre: number;
	showScore(): void;
}

class User implements GameUser {
	name: string;
	score : number = 0;
	constructor(name: string){
		this.name = name;
	}
	sayHi(): void {
		console.log("hi, i am" + this.name);
	}
	showSchore(): void {
		console.log("score" + this.score);
	}
}

// generics

function getArray<T>(value: T): T[]{
	return [value, value, value];
}

console.log(getArray<number>(3))

class MyData<T>{
	constructor(public value: T){}
	getArray(): T[]{
		return [this.value, this.value, this.value];
	}
}
var v1 = new MyData<string>("hello");
console.log(v1.getArray());
var v2 = new MyData<number>(234);
console.log(v2.getArray());

// 内部モジュール

module UserModule {
	export var name = "sato";
	export moudle AddressModule {
		export var zip = "111-1111";
	}
}
console.log(UserModule.name);
console.log(UserModule.AddressModule.zip);

// 外部モジュール

import User = require("./user_commonjs")
console.log(User.name);

[vagrant@localhost typescript]$ tsc main.ts -m commonjs

web:https://www.typescriptlang.org/

typescriptはtsとjsを共存して書ける
main.ts

class User {
	
}
console.log("hello world");

main.js

var User = /** @class */ (function () {
    function User() {
    }
    return User;
}());
console.log("hello world");

変数の後にコロンを入れて型を宣言する

var x: number = 10;
x = "hello";

// number, string, boolean, any
var i: number;
var i = 10; // i:number 型推論

var x; // var x:any

var results: number[]; // 配列の宣言
results = [10, 5, 3];

列挙型

// 列挙型
enum Signal {
	Red = 0,
	Blue = 1,
	Yello = 2
}
var result: Signal;
console.log(Signal[2]);

// 列挙型
enum Signal {
	Red,
	Blue = 3,
	Yello
}
var result: Signal;
console.log(Signal[3]);

enum Signal {
	Green = 6
}

拡張もできる

関数
型制限を間違えるとコンパイル時にエラーになる

function add(a:number, b:number) : number{
	return a + b;
}
console.log(add(5, 3));

function add(a:number, b:number) : number{
	if(b){
		return a + b;
	} else {
		return a + a;
	}
}

関数式

var add = function(a: number, b: number){
	return a + b;
}

var add = (a: number, b: number): number =>{
	return a + b;
}

オーバーロード

function add(a: number, b: number): number; // シグネチャ
function add(a: string, b: string): string;

function add(a: any, b: any): any {
	if(typeof a === "string" && typeof b === "string"){
		return a + " " + b;
	}
	return a + b;
}

class

class User {
	public name: string;

	constructor(name: strin){
		this.name = name;
	}

	sayHi(): void {
		console.log("hi i am" + this.name);
	}
}

var tom = new User("Tom");

TypeScriptとは？
– Microsoftによって開発されたJavaScript拡張言語
– 静的型付クラスベースオブジェクト言語
– AngularJSもTypeScript推奨
– TypeScript作者はC#の制作者(マジかよ)

JSでの大規模開発向けか？
TypeScriptの求人を眺めているとロジック実装が多そうではある

$ sudo npm install -g typescript
$ tsc -v
Version 3.7.2

hello.ts

class test{
	constructor(public Text: string){}

	helloShow()
	{
		return this.Text;
	}
}

var msgStr = new test("Hello World!");
document.body.innerHTML = msgStr.helloShow();

[vagrant@localhost typescript]$ tsc hello.ts
[vagrant@localhost typescript]$ ls
hello.js hello.ts node_modules package-lock.json

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>

</head>
<body>
<script src="hello.js"></script>
</body>
</html>