7장 연산자 & 8장 제어문 & 9장 타입 변환과 단축 평가

7장

p76.

단항 산술 연산자의 증가/감소(++/--) 연산자는 위치에 의미가 있다.

var x = 5, result;

// 선대입 후증가 (Postfix increment operator)
result = x++;
console.log(result, x); // 5 6

// 선증가 후대입 (Prefix increment operator)
result = ++x;
console.log(result, x); // 7 7

// 선대입 후감소 (Postfix decrement operator)
result = x--;
console.log(result, x); // 7 6

// 선감소 후대입 (Prefix decrement operator)
result = --x;
console.log(result, x); // 5 5

 

p78.

개발자의 의도와는 상관없이 자바스크립트 엔진에 의해 암묵적으로 타입이 자동 변환되기도 한다. 이를 암묵적 타입 변환(implicit coercion) 또는 타입 강제 변환(type coercion)이라고 한다.

// 단항 연산자
+10 // 10
+'10' // 10
+true // 1
+false // 0

// 문자열 연결 연산자
'1' + '2'      // '12'
'1' + 2       // '12'

// 산술 연산자
1 + 2          // 3
1 + true       // 2 (true → 1)
1 + false      // 1 (false → 0)
true + false    // 1 (true → 1 / false → 0)
1 + null       // 1 (null → 0)
1 + undefined // NaN (undefined → NaN)

 

p81.

동등 비교 연산자는 편리한 경우도 있지만 결과를 예측하기 어렵고 실수하기 쉽다. 동등 비교(==) 연산자 대신 일치 비교(===) 연산자를 사용하는 편이 좋다. 일치 비교(===) 연산자는 좌항과 우항의 피연산자가 타입도 같고 값도 같은 경우에 한하여 true를 반환한다. 다시 말해, 암묵적 타입 변환을 하지 않고 값을 비교한다. 따라서 일치 비교 연산자는 예측하기 쉽다.

 

p82.

// NaN은 자신과 일치하지 않는 유일한 값이다.
NaN === NaN // false

// 숫자가 NaN인지 조사하려면 빌트인 함수 isNaN을 사용한다.
isNaN(NaN) // true

// 숫자 0도 주의하도록 하자.
0 === -0     // true

 

ES6에서 도입된 Object.is 메서드는 예측 가능한 정확한 비교 결과를 반환한다. 그 외에는 일치 비교 연산자(===)와 동일하게 동작한다.

-0 === +0 // true
Object.is(-0, +0); // false

NaN === NaN; // false
Object.is(NaN, NaN); // true

 

p84.

삼항 조건 연산자의 첫 번째 피연산자는 조건식이므로 삼항 조건 연산자 표현식은 조건문이다.

var x = 2;

// 2 % 2는 0이고 0은 false로 암묵적 타입 변환된다.
var result = x % 2 ? '홀수' : '짝수';

console.log(result); // 짝수

 

p85.

삼항 조건 연산자 표현식은 값으로 평가할 수 있는 표현식인 문이다. 따라서 삼항 조건 연산자 표현식은 값처럼 다른 표현식의 일부가 될 수 있어 매우 유용하다. 조건에 따라 어떤 값을 결정해야 한다면 if ... else 문보다 삼항 조건 연산자 표현식을 사용하는 편이 유리하지만 조건에 따라 수행해야 할 문이 하나가 아니라 여러 개라면 if ... else 문의 가독성이 더 좋다.

 

p88.

typeof 연산자는 피연산자의 데이터 타입을 문자열로 반환한다. typeof 연산자는 7가지 문자열 "string", "number", "boolean", "undefined", "symbol", "object", "function" 중 하나를 반환한다. "null"을 반환하는 경우는 없다. 값이 null 타입인지 확인할 때는 typeof 연산자를 사용하지 말고 일치 연산자(===)를 사용하자. 선언하지 않은 식별자를 typeof 연산자로 연산해 보면 ReferenceError가 발생하지 않고 undefined를 반환한다.

 

p90.

다른 코드에 영향을 주는 부수 효과가 있는 연산자는 할당 연산자(=), 증가/감소 연산자(++,--), delete 연산자다.

 

 

8장

 

indexOf 메서드

 

- 문자열에서 특정 문자의 인덱스(위치)를 검색

var string = 'Hello World.';
var search = 'l';
var index;

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

console.log(index); // 2

//참고로 String.prototype.indexOf 메서드를 사용해도 같은 동작을 한다.
console.log(string.indexOf(search)); // 2

 

- indexOf 메서드를 이용한 중복문자 제거 (코딩테스트)

<script>
  function solution(s){
    let answer="";
    for(let i=0; i<s.length; i++){
      console.log(s[i], i, s.indexOf(s[i]));
      // k 0 0, s 1 1, e 2 2, k 3 0, k 4 0, s 5 1, e 6 2, t 7 7
      if(s.indexOf(s[i])===i) answer+=s[i];
      // 최초의 문자 인덱스번호와 본래 위치가 일치할 때 첫번째로 발견된 것
    }
    return answer;
  }
  console.log(solution("ksekkset")); // kset
</script>

 

- continue 문은 코드 블록 실행을 현 지점에서 중단하고 반복문의 증감식으로 이동한다.

var string = 'Hello World.';
var count = 0;

// 문자열은 유사배열이므로 for 문으로 순회할 수 있다.
for (var i = 0; i < string.length; i++) {
  // 'l'이 아니면 현 지점에서 실행을 중단하고 반복문의 증감식으로 이동한다.
  if (string[i] !== 'l') continue;
  count++; // continue 문이 실행되면 이 문은 실행되지 않는다.
}

console.log(count); // 3

// 참고로 String.prototype.match 메소드를 사용해도 같은 동작을 한다.
console.log(string.match(/l/g).length); // 3

 

- if 문 내에서 실행해야 할 코드가 한 줄이라면 continue 문을 사용했을 때보다 간편하며 가독성도 좋다. 하지만 if 문 내에서 실행해야 할 코드가 길다면 들여쓰기가 한 단계 더 깊어지므로 continue 문을 사용하는 것이 가독성이 더 좋다.

// continue 문을 사용하지 않으면 if 문 내에 코드를 작성해야 한다.
for (var i = 0; i < string.length; i++) {
  // 'l'이면 카운트를 증가시킨다.
  if (string[i] === 'l') {
    count++;
    // code
    // code
    // code
  }
}

// continue 문을 사용하면 if 문 밖에 코드를 작성할 수 있다.
for (var i = 0; i < string.length; i++) {
  // 'l'이 아니면 카운트를 증가시키지 않는다.
  if (string[i] !== 'l') continue;

  count++;
  // code
  // code
  // code
}

 

 

9장

- 자바스크립트의 모든 값은 타입이 있다. 값의 타입은 다른 타입으로 개발자에 의해 의도적으로 변환할 수 있다. 또는 자바스크립트 엔진에 의해 암묵적으로 자동 변환될 수 있다. 개발자에 의해 의도적으로 값의 타입을 변환하는 것을 명시적 타입 변환(Explicit coercion) 또는 타입 캐스팅(Type casting)이라 한다.

var x = 10;

// 명시적 타입 변환
var str = x.toString(); // 숫자를 문자열로 타입 캐스팅한다.
console.log(typeof str); // string

// 변수 x의 값이 변경된 것은 아니다.
console.log(typeof x, x); // number 10

 

- 동적 타입 언어인 자바스크립트는 개발자의 의도와는 상관없이 자바스크립트 엔진에 의해 암묵적으로 타입이 자동 변환되기도 한다. 이를 암묵적 타입 변환(Implicit coercion) 또는 타입 강제 변환(Type coercion)이라고 한다.

var x = 10;

// 암묵적 타입 변환
// 숫자 타입 x의 값을 바탕으로 새로운 문자열 타입의 값을 생성해 표현식을 평가한다.
var str = x + '';

console.log(typeof str, str); // string 10

// 변수 x의 값이 변경된 것은 아니다.
console.log(typeof x, x); // number 10

 

- 단축 평가를 사용하면 if문을 대체할 수 있다. 어떤 조건이 Truthy 값(참으로 평가되는 값)일 때 무언가를 해야 한다면 논리곱(&&) 연산자 표현식으로 if문을 대체할 수 있다.

// 배송료 조건
if(total&&total<40000){
    setFinalTotal(total+3000)
} else {
    setFinalTotal(total)
}