diff --git a/src/app.js b/src/app.js index ceb5b95..a0d2b94 100644 --- a/src/app.js +++ b/src/app.js @@ -1,6 +1,24 @@ -//console.log(person.name); 으로 person.name, 객체 타입으로 접근하기 위한 object 타입 정의 방법 -var person = { - name: 'Maximilian', - age: 30 -}; -console.log(person.name); //error : Object에 name이 없습니다. 그렇다면 어떻게 해야할까? +//항상 유니온 타입을 지정하는 것은 많이 번거롭다. 이에 alias 타입으로 사용자 지정 타입을 정할 수 있다. 즉, 타입을 우리가 다로 별칭으로 만들어 낼 수 있다. +function combine(n1, n2, resultConversion) { + var result; + if (typeof n1 === 'number' && typeof n2 === 'number' || resultConversion === 'as-number') { + result = +n1 + +n2; + } + else if (typeof n1 === 'string' && typeof n2 === 'string') { + result = n1 + n2; + } + else { + result = n1.toString() + n2.toString(); + } + // if (resultConversion === 'as-number') { + // return +result; + // } else { + // return result.toString(); + // } +} +var combineAges = combine(20, 30, 'as-number'); +console.log(combineAges); +var combinedStringAges = combine('20', '30', 'as-number'); +console.log(combinedStringAges); +var combineNames = combine('Max', 'Anna', 'as-text'); +console.log(combineNames); diff --git a/src/app.ts b/src/app.ts index 07b0bfb..86224ca 100644 --- a/src/app.ts +++ b/src/app.ts @@ -1,33 +1,24 @@ -//항상 유니온 타입을 지정하는 것은 많이 번거롭다. 이에 alias 타입으로 사용자 지정 타입을 정할 수 있다. 즉, 타입을 우리가 다로 별칭으로 만들어 낼 수 있다. +function add(n1: number, n2: number): number { + return n1 + n2; //error ts(2322) 'number' 형식은 'string' 형식에 할당할 수 없습니다. +} //현재 return에 정의한 n1+n2로 인해서 add함수의 반환 타입은 Number이다. 만약 toSting으로 형변환을 한 `n1.toString() + n2.toString()`일 경우 반환된 값은 string으로 타입이 반환 될 것이다. -type Combinable = number | string; -type ConversionCustom = 'as-number' | 'as-text'; - -function combine( - n1: Combinable, - n2: Combinable, - resultConversion: ConversionCustom, -) { - let result; - if (typeof n1 === 'number' && typeof n2 === 'number' || resultConversion === 'as-number') { - result = +n1 + +n2; - } else if (typeof n1 === 'string' && typeof n2 === 'string') { - result = n1 + n2; +function printResult(num: number | string | undefined): void { + if (typeof num === 'number' || typeof num === 'string') { + console.log('Result: ', +num); } else { - result = n1.toString() + n2.toString(); + console.log('this is Undefined!'); } - // if (resultConversion === 'as-number') { - // return +result; - // } else { - // return result.toString(); - // } -} +} //일반적으로 함수의 반환 타입을 정하지 않으면 void로 판단한다. `:void`를 명시하지 않아도 해당 함수에 마우스를 호버하면 void로 판별 되어 있는 것을 확인 할 수 있다. 따라서 굳이 void를 명시할 필요는 없다. -const combineAges = combine(20, 30, 'as-number'); -console.log(combineAges); +//반환되지 않는 함수를 기준으로 log로 확인을 해보면 어떤 결과가 나올까 +console.log(printResult(add(5, 12))); //결과적으로 `undefined`라는 결과가 나온다. 반환된 값이 없기 때문에 정의되지 않은 박스만 출력이 되는 것이다. 참고로 `undefined`는 값이 없는게 아니라 값을 담아내고 있는 박스에 아무것도 담겨 있지 않다는 의미의 `값`이다. 즉, 비어 있는 박스를 출력한 것이다. -const combinedStringAges = combine('20', '30', 'as-number'); -console.log(combinedStringAges); +let UndefinedValue: undefined; //변수로 undefined라는 타입을 지정할 수는 있다. 하지만 함수에서는 undefined라는 타입을 할당 하면 안된다. 반환값이 없는 함수를 출력하면 undefined가 출력되는데 이는 함수의 활용과 의미가 상실하게 된다. + +function UndefinedFunction(value: string): undefined { + console.log(value); + // return value; //error ts(2322) -> 'string' 형식은 'undefined' 형식에 할당할 수 없습니다 + return; //결과적으로 함수에 아무것도 없는 return이여야 undefined가 된다. +} -const combineNames = combine('Max', 'Anna', 'as-text'); -console.log(combineNames); +printResult(UndefinedFunction('test')); \ No newline at end of file diff --git a/src/basics.ts b/src/basics.ts index 7019098..ceab1ff 100644 --- a/src/basics.ts +++ b/src/basics.ts @@ -9,11 +9,11 @@ function addTemplate(n1: number, n2: number, showResult: boolean, phrase: string const number1 = 5; const number2 = 2.8; -const printResult = true; +const printResultTemp = true; const resultPhrase = 'Result is: '; // resultPhrase = 0; //error -> 타입 추론으로 resultPhrase는 string이다. 따라 0이라는 number타입을 할당할 수 없다. -addTemplate(number1, number2, printResult, resultPhrase); +addTemplate(number1, number2, printResultTemp, resultPhrase); const person: { name: string, diff --git a/src/union-aliases.ts.ts b/src/union-aliases.ts.ts new file mode 100644 index 0000000..05537bd --- /dev/null +++ b/src/union-aliases.ts.ts @@ -0,0 +1,31 @@ +type Combinable = number | string; +type ConversionCustom = 'as-number' | 'as-text'; + +function combine( + n1: Combinable, + n2: Combinable, + resultConversion: ConversionCustom, +) { + let result; + if (typeof n1 === 'number' && typeof n2 === 'number' || resultConversion === 'as-number') { + result = +n1 + +n2; + } else if (typeof n1 === 'string' && typeof n2 === 'string') { + result = n1 + n2; + } else { + result = n1.toString() + n2.toString(); + } + // if (resultConversion === 'as-number') { + // return +result; + // } else { + // return result.toString(); + // } +} + +const combineAges = combine(20, 30, 'as-number'); +console.log(combineAges); + +const combinedStringAges = combine('20', '30', 'as-number'); +console.log(combinedStringAges); + +const combineNames = combine('Max', 'Anna', 'as-text'); +console.log(combineNames); diff --git a/tsconfig.json b/tsconfig.json index 9ff2721..4dbf482 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -1,25 +1,25 @@ { - "compilerOptions": { - "target": "es5", - "lib": [ - "dom", - "dom.iterable", - "esnext" - ], - "allowJs": true, - "skipLibCheck": true, - "allowSyntheticDefaultImports": true, - "strict": true, - "forceConsistentCasingInFileNames": true, - "noFallthroughCasesInSwitch": true, - "module": "commonjs", - "outDir": "dist", - "rootDir": "src" - }, - "include": [ - "src/**/*" - ], - "exclude": [ - "node_modules" - ] +"compilerOptions": { + "target": "es5", + "lib": [ + "dom", + "dom.iterable", + "esnext" + ], + "allowJs": true, + "skipLibCheck": true, + "allowSyntheticDefaultImports": true, + "strict": true, + "forceConsistentCasingInFileNames": true, + "noFallthroughCasesInSwitch": true, + "module": "commonjs", + "outDir": "dist", + "rootDir": "src" +}, +"include": [ + "src/**/*" +], +"exclude": [ + "node_modules" +] } \ No newline at end of file