DEV Community

Cover image for 자바스크립트 중괄호의 노래
Composite
Composite

Posted on

3 3

자바스크립트 중괄호의 노래

나 노래 못한다.

원시 객체

const json = {
  a: 'a',
  b: 'b'
}
Enter fullscreen mode Exit fullscreen mode

다들 JSON으로 알고 있고, 많이 쓰잖아. Java나 여타 언어의 Map 역할을 보통 하지만 이제 자스에서도 Map 이 생겼다.

분해 구조 할당

const { a, b } = {
  a: 'a',
  b: 'b'
}
Enter fullscreen mode Exit fullscreen mode

요츰 이게 있어서 요소 딱 잡아서 변수나 상수(?) 잡는거 편하지? 배열도 분해 구조 할당도 되고 말이야.

스코프

자, 이 글의 주인공이다.

함수

함수는 2가지 문법이 생겼어.
하나는 일반적인 함수 문법으로, 컨텍스트 독립이 보장되지.

function func() {
  console.log('function call!')
}
Enter fullscreen mode Exit fullscreen mode

그리고 또 하나는 화살표 함수라 하여 람다 문법이라고도 하고, 이녀석은 컨텍스트를 유지할 수가 있어.

const func = () => {
  console.log('function call!')
}
Enter fullscreen mode Exit fullscreen mode

반복문

for ( ... ) {
  ...
}
while ( ... ) {
  ...
}
do {
  ...
} while ( ... )
Enter fullscreen mode Exit fullscreen mode

조건문

if ( ... ) {
  ...
}
else if ( ... ) {
  ...
}
else {
  ...
}
Enter fullscreen mode Exit fullscreen mode

레이블

label: {
  for ( i ...) {
    for ( j ... ) {
      if ( ... )
        break label;
      ...
    }
  }
}

label2: {
  if ( ... ) {
    break label2;
  }
  ...
}
Enter fullscreen mode Exit fullscreen mode

주로 이렇게들 쓸 거야. 난 label2 같은 구문도 좀 쓴다. 좀... 쓰지.

플레인

내가 좀 변태일 수도 있어. 아예 중괄호로만으로도 식을 쓸 수도 있지.

let a = 'a'
{
  let a = 'b'
  // ...
}
console.log(a)
Enter fullscreen mode Exit fullscreen mode

마치 맛대가리 없는 플레인 요구르트 먹듯이 말이야.
일종의 프로시저라 보면 되는 거지.

비동기 안 될 것 같다고? 아니

(async (log) => {
  log('wait a second...')
  let a = await new Promise(r => setTimeout(() => r('1 second'), 1000))
  {
    let a = await new Promise(r => setTimeout(() => r('2 seconds'), 2000))
    log('2 seconds', a)
  }
  log('1 second', a)
})(console.log)
Enter fullscreen mode Exit fullscreen mode

자네도 중괄호 세계에 빠져보지 않겠나?
초창기 자바에서 가져온 거 아니랄까봐 스코프 문법은 지 양아비 쏙 닮았지?
그래도 정의를 정확하게 아는 것이 중요하지.

끗.

Heroku

This site is built on Heroku

Join the ranks of developers at Salesforce, Airbase, DEV, and more who deploy their mission critical applications on Heroku. Sign up today and launch your first app!

Get Started

Top comments (0)

A Workflow Copilot. Tailored to You.

Pieces.app image

Our desktop app, with its intelligent copilot, streamlines coding by generating snippets, extracting code from screenshots, and accelerating problem-solving.

Read the docs

👋 Kindness is contagious

Please leave a ❤️ or a friendly comment on this post if you found it helpful!

Okay