중 상급자가되기위한 JavaScript 【지식 편]

qiita : http://qiita.com/KENJU/items/c7fad62a12cc2809b507?utm_source=Qiita%E3%83%8B%E3%83%A5%E3%83%BC%E3%82%B9&utm_campaign=a25a5e9683-Qiita_newsletter_166_07_22_2015&utm_medium=email&utm_term=0_e44feaa081-a25a5e9683-32972029

그대로 복붙 해도 상관 없지만 나도 좀 보면서 정리 해야 되니까 조금씩 정리.

1. Basic Tips

Index

• 1-1. 글로벌 변수를 남용하지 않는다.
• 1-2. for 루프
• 1-3. 암시 적 변환을 피하기

1-1. 글로벌 변수를 남용하지 않는다.,

• 타사 플러그인을 읽을 때 변수의 충돌
• 팀 구성원이 작성한 코드와 이름 충돌
• 옛날 쓴 자신의 코드에서 사용한 변수와 충돌

대책 : var

JavaScript 는 var  없이 정의된 변수는 전역 변수로 스켄된다.

function speakOut() { 
  // global variable 
  global = "Hello from global"; 

  // local variable 
  var local = "Hello from local"; 

  console.log(global); 
  console.log(local); 
} 

speakOut(); 

console.log(global); 
console.log(local);

대책 : 네임 스페이스를 사용

// Object for name space 
var myApp = {}; 

myApp.name = "My First JavaScript App" ;

대책 : 클로저를 이용.

(function(){
  maybe_global = "Hello from global?"; // varを忘れるとグローバル
  var local = "Hello from local";

})();

console.log(maybe_global);
console.log(local);

모범 사례 : 단독 var 패턴.

반드시 함수의 시작 부분에서 var 문장을 쓰면 잘못된 로컬 변수로 var을 선언하는것을 방지 할 수 있다.

습관화 하여 로컬 변수 var 붙여 잊어을 방지하기

로컬 변수 나 함수 자체의 전체적인 가독성 향상

코드 량이 적다

function login(){
    var userId,
        userPasswd,
        date,
        sessionId,
        errorMessage = [],
        status = {};

    ...

}

1-2. for 루프

일반적인 for 루프

for ( var i = 0; i < myarray.length; i++){
    console.log(i);
}

고성능 JavaScript"(O'Reilly) 를 참고하여 조금더 빠르게 변경 할 수 있다.

실제 글에서는 소규머 서비스에서는 별 차이를 못느낀다고 하며 대규모 서비스개발시에 도움이 될거라고...

for ( var i = 0, len = myarray.length; i < len; i++){
    console.log(i);
}

루프에서 DOM 요소를 추가하거나 제거하는등 길이가 바뀔 때

var문장을 밖에서 선언해 두면 좋다.

function myFunc(){

    var i = 0,
        len,
        myarray = [];

    //...

    for ( i = 0, len = myarray.length; i < len; i++){
        // ...
    }

}

for문을 더 빨리 하려면

변수의 수를 줄이고 카운트 방식에서 카운트 다운방식으로 하면 더 빠르게 할 수 있다.

var i, 
    myarray = [];

for ( i = myarray.length; i--;){
    //...
}

1-3. 암시적 변환을 피하자

var zero = 0;

// pattern A

if(zero === false){
    // ...
}

// pattern B

if(zero == false){
    // ...
}

v for문을 더 빨리 하려면

=== 와 ==는 다르다. !== 와 != 도 다르다.

JavaScript 에서 변수를 비교할 때 암시적 변환이 이루어진다. ===와 !==에서 비교할 때 값과 수식의 형태를 모두 체크하지만 ==와 !=는 값 밖에 확인하지 않는다.

그래서... 가급적이면 ===와 !==를 사용하면 좋다고 한다.