공백(Whitespace)

공백(Whitespace)

• Use soft tabs set to 2 spaces.

• 탭에는 스페이스 2개를 설정해 주십시오.

  // bad
  function() {
  ∙∙∙∙const name;
  }
  
  // bad
  function() {
  ∙const name;
  }
  
  // good
  function() {
  ∙∙const name;
  }

• Place 1 space before the leading brace.

• 주요 중괄호 ({}) 앞에는 스페이스를 1개 넣어 주십시오.

  // bad
  function test(){
    console.log('test');
  }
  
  // good
  function test() {
    console.log('test');
  }
  
  // bad
  dog.set('attr',{
    age: '1 year',
    breed: 'Bernese Mountain Dog',
  });
  
  // good
  dog.set('attr', {
    age: '1 year',
    breed: 'Bernese Mountain Dog',
  });

• Place 1 space before the opening parenthesis in control statements (if, while etc.). Place no space before the argument list in function calls and declarations.

• 제어구문 (if 문이나 while 문 등) 의 소괄호 (()) 앞에는 스페이스를 1개 넣어 주십시오. 함수선언이나 함수호출시 인수리스트의 앞에는 스페이스를 넣지 마십시오.

  // bad
  if(isJedi) {
    fight ();
  }
  
  // good
  if (isJedi) {
    fight();
  }
  
  // bad
  function fight () {
    console.log ('Swooosh!');
  }
  
  // good
  function fight() {
    console.log('Swooosh!');
  }

• Set off operators with spaces.

• 연산자 사이에는 스페이스를 넣어 주십시오.

  // bad
  const x=y+5;
  
  // good
  const x = y + 5;

•  End files with a single newline character.

• 파일 끝에는 개행문자를 1개 넣어 주십시오.

  // bad
  (function(global) {
    // ...stuff...
  })(this);

  // bad
  (function(global) {
    // ...stuff...
  })(this);↵
  ↵

  // good
  (function(global) {
    // ...stuff...
  })(this);↵

• Use indentation when making long method chains. Use a leading dot, which emphasizes that the line is a method call, not a new statement.

• 길게 메소드를 채이닝하는 경우는 인덴트를 이용해 주십시오. 행이 새로운 문이 아닌 메소드 호출인 것을 강조하기 위해서 선두에 점 (.) 을 배치해 주십시오.

  // bad
  $('#items').find('.selected').highlight().end().find('.open').updateCount();
  
  // bad
  $('#items').
    find('.selected').
      highlight().
      end().
    find('.open').
      updateCount();
  
  // good
  $('#items')
    .find('.selected')
      .highlight()
      .end()
    .find('.open')
      .updateCount();
  
  // bad
  const leds = stage.selectAll('.led').data(data).enter().append('svg:svg').class('led', true)
      .attr('width', (radius + margin) * 2).append('svg:g')
      .attr('transform', 'translate(' + (radius + margin) + ',' + (radius + margin) + ')')
      .call(tron.led);
  
  // good
  const leds = stage.selectAll('.led')
      .data(data)
    .enter().append('svg:svg')
      .classed('led', true)
      .attr('width', (radius + margin) * 2)
    .append('svg:g')
      .attr('transform', 'translate(' + (radius + margin) + ',' + (radius + margin) + ')')
      .call(tron.led);

• Leave a blank line after blocks and before the next statement.

• 문의 앞과 블록의 뒤에는 빈행을 남겨 주십시오.

  // bad
  if (foo) {
    return bar;
  }
  return baz;
  
  // good
  if (foo) {
    return bar;
  }
  
  return baz;
  
  // bad
  const obj = {
    foo() {
    },
    bar() {
    },
  };
  return obj;
  
  // good
  const obj = {
    foo() {
    },
  
    bar() {
    },
  };
  
  return obj;
  
  // bad
  const arr = [
    function foo() {
    },
    function bar() {
    },
  ];
  return arr;
  
  // good
  const arr = [
    function foo() {
    },
  
    function bar() {
    },
  ];
  
  return arr;

• Do not pad your blocks with blank lines.

• 블록에 빈행을 끼워 넣지 마십시오.

  // bad
  function bar() {
  
    console.log(foo);
  
  }
  
  // also bad
  if (baz) {
  
    console.log(qux);
  } else {
    console.log(foo);
  
  }
  
  // good
  function bar() {
    console.log(foo);
  }
  
  // good
  if (baz) {
    console.log(qux);
  } else {
    console.log(foo);
  }

• Do not add spaces inside parentheses.

• 소괄호()의 안쪽에 스페이스를 추가하지 마십시오.

  // bad
  function bar( foo ) {
    return foo;
  }
  
  // good
  function bar(foo) {
    return foo;
  }
  
  // bad
  if ( foo ) {
    console.log(foo);
  }
  
  // good
  if (foo) {
    console.log(foo);
  }

• Do not add spaces inside brackets.

• 대괄호([])의 안쪽에 스페이스를 추가하지 마십시오.

  // bad
  const foo = [ 1, 2, 3 ];
  console.log(foo[ 0 ]);
  
  // good
  const foo = [1, 2, 3];
  console.log(foo[0]);

• Add spaces inside curly braces.

• 중괄호({})의 안쪽에 스페이스를 추가해 주십시오.

  // bad
  const foo = {clark: 'kent'};
  
  // good
  const foo = { clark: 'kent' };