JavaScript - 1

Doodream·2021년 4월 17일
0

코어 자바스크립트

목록 보기
2/36
post-thumbnail

동적 타이핑

자바스크립트에서는 값을 정의하고 나서 해당 변수를 다시 선언하지 않고도 변수의 타입유형을 바꿀수 있다.

typeof는 대상의 타입을 string 형태로 반환한다.

let a
console.log(a) // undefined
console.log(typeof a) // "undefined"
a = "doodream"
console.log(a) // "doodream"
console.log(typeof a) // "string"

위와 같이 변수를 정의하고 값을 넣지 않으면 undefined라는 데이터 타입이 들어간다. 변수는 정의되었으나 값이 할당되지 않음이라는 데이터 타입이 들어가되 해당 데이터는 undefined라는 값으로 출력된다. 아무것도 취하지 않음 이라는 값을 변수가 갖는 것이다. 따라서 위 코드에서 첫줄 인 경우 값이 없으므로 undefined라는 값을 가지는 것이다.

데이터 타입은

  • Number
  • String
  • Boolean
  • Undefined : 변수 활용이 가능하나 값이 없음
  • Null : 값이 없음
  • Symbol (ES2015) : 유일한 값을 가지고 있으며 변경 불가능 (현재 사용잘 안함)
  • BigInt (ES2020) : 굉장히 큰 숫자에 대해 사용하는 데이터 타입

이렇게 나눌수 있는데 undefined과 null은 데이터 타입이라는 것을 알아야한다.

다시 돌아가서 a에 새로운 타입의 데이터인 "doodream"을 할당할 수있고 해당 값은 console.log(typeof a) string 으로 출력된다.

이렇게 변수를 다시 정의하지 않고도 데이터 타입이 다른 값을 할당하는 것을 동적 타이핑이라고 한다.

추가로 null 값또한 하나의 데이터 타입이다.
다만 null값의 데이터 타입은 null 이다. 하지만 출력시

console.log(typeof null) // "object"

이렇게 출력이 되는데 이현상은 자바스크립트의 버그❗️❗️로 간주 된다.
이 버그는 자바스크립트의 본래 코드의 오류로서 수정되지 않았다.

출력시 "object" 라고 출력되지만 실제로는 절대로 object가 아니다. 실제 취급되는 코드환경에서는 분명히 null 데이터 타입으로 실행되기 때문에 이현상으로 오해하면 안된다.

let, const & var

변수를 선언하는 방법에는 3가지 방식이있다.
이 변수는 어떤 범위에서 어떻게 사용한다는 방식을 지정해주는 것이다.

let은 var와 비슷한 속성을 지닌다. 변수를 선언해서 값을 할당하며 동적 타이핑이 가능하다. 하지만 선언 범위가 다르다. 즉, 변수를 사용할 수 있는 범위가 다르다.

  • let, const 은 '블록스코프'의 범위 내에서 사용이 가능하다.
    블록이란 { }로 구분하는 범위이다. 따라서 let은 해당 블록 범위 안에서 정의되고 활용된다.

  • var 은 '함수스코프'의 범위 내에서 사용이 가능하다.
    함수가 정의된 스코프 내에서 해당 방식으로 값을 할당한 변수를 참조할 수 있다는 것이다. 둘은 매우 다르다.

const 는 변수를 할당하지만 변경할 수 없게 한다. 한번 변수를 선언하면 변경이 불가능하게 만든다.

보통 변수를 설정 할때 let 혹은 거의 대부분 const를 사용한다. 변수가 재할당이 된다는 것은 여러모로 에러를 발생시킬 가능성이 높다. 따라서 변수를 설정할때는 이왕이면 매우 잘 생각해서 const 방식을 채택하고 재할당을 해야만한다면 그런 확신 이 있다면 !let 을 사용하자. var은 사용하지 말자.

막상 코드를 짜면서 가변적인 변수를 만들일이 거의없다는 것을 명심하자.
기본적으로 변수는 const로 선언하는 것임을 기억하자.

현재 임시적인 개념을 배웠으므로 추후 다시 언급하며 포스팅 할 주제 입니다.

❗️자바스크립트에서 하면 안되는 것중에서 변수선언 방식 없이 변수를 추가하고 값을 할당하는 것이 있는데 이전의 호스팅 부분에서 전역객체를 안다면 전역객체에 해당 속성이 추가되어 있다는 황당한 경우를 보게된다.

job = 10;
console.log(job) // 10 <- 전역객체를 참조하는 만큼 쓸데 없는 스코프 체이닝이 많다.

연산자 우선순위

  • + - / % // **
  • typeof
  • = ...

연산자 우선순위는 이 표를 참고하면된다.

https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Operators/Operator_Precedence

이런식으로 오른쪽에서 왼쪽 순으로 계산을 한다던지
왼쪽에서 오른쪽 순으로 계산하는지 연산자의 연산 순서와 연산 우선순위를 알려준다.

const a = 17 > 1 + 3 ** 4;
// const a = 17 > 1 + 81
// const a = 17 > 82
// const a = false;

이런 형태이다.

profile
일상을 기록하는 삶을 사는 개발자 ✒️ #front_end 💻

0개의 댓글