Typescript 기초(2) – Variable Declarations

Typescript Handbook / Developer’s Record 를 참고했습니다.

var vs let vs const

이곳을 참고하면 된다.

destructure

array

let input = [1, 2];
let [first, second] = input;
console.log(first); // 1
console.log(second); // 2

function test([first, second]: [number, number])  {
  console.log(first); // 100
  console.log(second); // 200
}
test([100, 200]);

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

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

object

let o = {
  a: "hello",
  b: 100,
  c: false
}
let { a, b } = o;
console.log(a); // hello
console.log(b); // 100

let o = {
  a: "hello",
  b: 100,
  c: false
}
let { a, ...rest } = o;
console.log(a); // hello
console.log(rest); // { b: 100, c: false }

let o = {
  a: "hello",
  b: 100,
  c: false
}
let { a: first, b: second } = o;
console.log(first); // hello
console.log(second); // 100

기본값을 지정할 수도 있다.

let o = {
  a: "hello",
  b: 100,
  c: false
}
let { a: first, b = 9999 } = o;
console.log(b); // 100

function keepWholeObject(o: { a: string, b?: number }) {
  let { a, b = 9999 } = o;
  console.log(a); // hello
  console.log(b); // 9999
}
keepWholeObject({a: "hello"});

배열처럼 인자값에서 destructuring이 가능하다.

function f({ a, b }: { a: string, b?: number }): void {
  console.log(a); // hello
  console.log(b); // undefined
}
f({a: "hello"});

spread

array

let first = [1,2,3];
let second = [7,8,9];
let zeroToten = [0, ...first, 4, 5, 6, ...second, 10];
console.log(zeroToten); // [ 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10 ]

object

let defaults = {
  name: "yoon",
  age: 25
}
let newYoon = {
  ...defaults,
  job: "Great Programmer"
}
console.log(newYoon); // { name: 'yoon', age: 25, job: 'Great Programmer' }

let defaults = {
  name: "yoon",
  age: 25,
  say: ()=> {
    console.log("hi");
  }
}
let newYoon = {
  ...defaults,
  job: "Great Programmer"
}
newYoon.say(); // hi

Class의 메소드는 손실될 수 있으니 주의해야한다

Typescript Handbook / Developer’s Record 를 참고했습니다.

var vs let vs const

이곳을 참고하면 된다.

destructure

array

let input = [1, 2];
let [first, second] = input;
console.log(first); // 1
console.log(second); // 2

function test([first, second]: [number, number])  {
  console.log(first); // 100
  console.log(second); // 200
}
test([100, 200]);

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

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

object

let o = {
  a: "hello",
  b: 100,
  c: false
}
let { a, b } = o;
console.log(a); // hello
console.log(b); // 100

let o = {
  a: "hello",
  b: 100,
  c: false
}
let { a, ...rest } = o;
console.log(a); // hello
console.log(rest); // { b: 100, c: false }

let o = {
  a: "hello",
  b: 100,
  c: false
}
let { a: first, b: second } = o;
console.log(first); // hello
console.log(second); // 100

기본값을 지정할 수도 있다.

let o = {
  a: "hello",
  b: 100,
  c: false
}
let { a: first, b = 9999 } = o;
console.log(b); // 100

function keepWholeObject(o: { a: string, b?: number }) {
  let { a, b = 9999 } = o;
  console.log(a); // hello
  console.log(b); // 9999
}
keepWholeObject({a: "hello"});

배열처럼 인자값에서 destructuring이 가능하다.

function f({ a, b }: { a: string, b?: number }): void {
  console.log(a); // hello
  console.log(b); // undefined
}
f({a: "hello"});

spread

array

let first = [1,2,3];
let second = [7,8,9];
let zeroToten = [0, ...first, 4, 5, 6, ...second, 10];
console.log(zeroToten); // [ 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10 ]

object

let defaults = {
  name: "yoon",
  age: 25
}
let newYoon = {
  ...defaults,
  job: "Great Programmer"
}
console.log(newYoon); // { name: 'yoon', age: 25, job: 'Great Programmer' }

let defaults = {
  name: "yoon",
  age: 25,
  say: ()=> {
    console.log("hi");
  }
}
let newYoon = {
  ...defaults,
  job: "Great Programmer"
}
newYoon.say(); // hi

Class의 메소드는 손실될 수 있으니 주의해야한다

class Yoon {
  name = "yoon"
  say() {
    console.log("hello");
  }
}
let me: Yoon = new Yoon();
let ego = { ...me };
console.log(ego.name);
ego.say(); // Property 'say' does not exist on type '{ name: string; }'