오늘 한 것

제어문

숫자, 문자열은 객체로 쓰면 암묵적으로 객체 타입으로 변환해 참조한다.

// 문자열은 유사배열이므로 for 문으로 순회할 수 있다.
for (var i = 0; i < string.length; i++) {
  // 문자열의 개별 문자가 'l'이면
  if (string[i] === search) {
    index = i;
    break; // 반복문을 탈출한다.
  }
}

문자열은 원시값이지만 유사배열로서 객체로 암묵적 타입 변환 후 length 프로퍼티를 참조할 수 있다.

타입 변환과 단축 평가

boolean 타입 변환

// 전달받은 인수가 Falsy 값이면 true, Truthy 값이면 false를 반환한다.
function isFalsy(v) {
  return !v;
}

// 전달받은 인수가 Truthy 값이면 true, Falsy 값이면 false를 반환한다.
function isTruthy(v) {
  return !!v;
}

명시적으로 타입을 변환하는 방법

String(), Number() 등 생성자 함수를 new 연산자 없이 호출하는 방법
Object.prototype.toString / parseInt() 메서드를 사용하는 방법
연산자를 이용하는 방법

명시적인 것은 3 → 2 → 1 순이다.

2번 메서드를 사용하는 것도 좋지만 메서드 마다 사용법도 다르고 3번이 가장 짧고 명시적이다.

1번 생성자 함수는 본래 정석인 사용법이 아니기 때문에 지양한다.

객체 리터럴

객체

var person = {
  // 프로퍼티 키는 name, 프로퍼티 값은 'Lee'
  name: "Lee",
  // 프로퍼티 키는 age, 프로퍼티 값은 20
  age: 20,
};

프로퍼티 키는 식별자가 아니기 때문에 식별자 명명 규칙을 안 지켜도 문자열이기만 하면 된다.

var person = {
  // 프로퍼티 키는 name, 프로퍼티 값은 'Lee'
  "first-name": "Lee", // 이런식으로 묶기만해주면 식별자 명명 규칙을 안 지켜도됨
  // 프로퍼티 키는 age, 프로퍼티 값은 20
  age: 20,
};
console.log(person["first-name"]);

식별자 명명 규칙을 지키지 않을 시에는 [‘first-name’] 대괄호 표기법을 따라야한다.

제일 좋은 건 식별자 명명 규칙을 지키고 편하게 쓰자.

프로퍼티 삭제 → delete 연산자

1	delete person.age;

사실 굳이 프로퍼티를 지울 일은 많지 않음. → 안티패턴(할 수는 있지만, 굳이 하는 것을 지양하는 것)이다.

delete 연산자는 안 쓰는게 좋다.

프로퍼티 축약표현 (중요!)

프로퍼티 키와 변수 이름이 같을 경우 축약할 수 있다.

// ES5
var x = 1,
  y = 2;

var obj = {
  x: x,
  y: y,
};

console.log(obj); // {x: 1, y: 2}

// ES6
let x = 1,
  y = 2;

// 프로퍼티 축약 표현
const obj = { x, y }; // = {x: x, y: y}

console.log(obj); // {x: 1, y: 2}

객체 리터럴 내부에서 계산된 프로퍼티 키를 동적으로 생성할 수 있다. (ES5에서는 객체 리터럴 외부에서 해야했다.)

// ES5
var prefix = "prop";
var i = 0;

var obj = {};

// 계산된 프로퍼티 이름으로 프로퍼티 키 동적 생성
obj[prefix + "-" + ++i] = i;
obj[prefix + "-" + ++i] = i;
obj[prefix + "-" + ++i] = i;

console.log(obj); // {prop-1: 1, prop-2: 2, prop-3: 3}

// ES6
const prefix = "prop";
let i = 0;

// 객체 리터럴 내부에서 계산된 프로퍼티 이름으로 프로퍼티 키 동적 생성
// 프로퍼티 키로 사용할 표현식을 대괄호([…])로 묶어야 한다.
const obj = {
  [`${prefix}-${++i}`]: i,
  [`${prefix}-${++i}`]: i,
  [`${prefix}-${++i}`]: i,
};

console.log(obj); // {prop-1: 1, prop-2: 2, prop-3: 3}

메서드 축약 표현

// ES5
var obj = {
  name: "Lee",
  sayHi: function () {
    console.log("Hi! " + this.name);
  },
};

obj.sayHi(); // Hi! Lee

// ES6
const obj = {
  name: "Lee",
  // 메서드 축약 표현
  sayHi() {
    console.log("Hi! " + this.name);
  },
};

obj.sayHi(); // Hi! Lee

Nyong’s GitHub

Nyong's Blog

201123_TIL(제어문, 타입 변환과 단축 평가)

오늘 한 것

제어문

타입 변환과 단축 평가

객체 리터럴