JavaScript 코딩 규칙
16582 단어 JavaScriptJavaScript
JavaScript 코딩 규칙
1. 할당, 선언, 함수(일반, 표현식, 생성자)
// 변수
var foo = "bar",
num = 1;
// 리터럴 표기법:
var array = [],
object = {};
// 함수 같은 유효 범위에 `var` 를 하나만 사용하면 가독성이 높아집니다.
// 이렇게 하면 선언 목록도 깔끔해집니다(아울러 키보드로 입력해야 할 양도 줄어들지요)
// 나쁜 스타일
var foo = "";
var bar = "";
var qux;
// 좋은 스타일
var foo = "",
bar = "",
quux;
// 또는..
var // 아래 변수에 대한 설명
foo = "",
bar = "",
quux;
// var 문은 관련있는 스코프(함수) 안의 시작하는 곳에 있어야합니다.
// ECMAScript 6의 const, let도 같은 맥락으로 이 규칙이 적용됩니다.
// 나쁜 스타일
function foo() {
// 여기에 어떤 구문이 있음
var bar = "",
qux;
}
// 좋은 스타일
function foo() {
var bar = "",
qux;
// 변수 선언이후에 모든 구문들이 옴.
}
// 일반 함수 선언
function foo( arg1, argN ) {
}
// 사용법
foo( arg1, argN );
// 일반 함수 선언
function square( number ) {
return number * number;
}
// 사용법
square( 10 );
// 아주 부자연스러운 연속 전달 스타일(continuation passing style) (CPS에 대해서는 http://goo.gl/TA32o를 참고)
function square( number, callback ) {
callback( number * number );
}
square( 10, function( square ) {
// 콜백 문장
});
// 함수 표현식
var square = function( number ) {
// 가치 있고 의미 있는 뭔가를 반환합니다
return number * number;
};
// 식별자를 지닌 함수 표현식
// 아래와 같은 형태는 자기 자신을 호출할 수 있으면서
// 스택 트레이스상에서 식별할 수 있다는 부가적인 장점이 있습니다:
var factorial = function factorial( number ) {
if ( number < 2 ) {
return 1;
}
return number * factorial( number-1 );
};
// 생성자 선언
function FooBar( options ) {
this.options = options;
}
// 사용법
var fooBar = new FooBar({ a: "alpha" });
fooBar.options;
// { a: "alpha" }
2. 중괄호{}, 괄호(), 줄 바꾸기
// if나 else, for while, try를 쓸 때에는 항상 빈 칸을 띠우고, 괄호를 사용하고, 여러 줄로 나누어 쓰세요.
// 이렇게 하면 가독성이 더 좋아집니다.
// 빼곡해서 알아보기 어려운 구문의 예
if(condition) doSomething();
while(condition) iterating++;
for(var i=0;i<100;i++) someIterativeFn();
// 가독성이 높아지도록 빈 칸을 띠워주세요.
if ( condition ) {
// 코드
}
while ( condition ) {
// 코드
}
for ( var i = 0; i < 100; i++ ) {
// 코드
}
// 아래처럼 하면 더 좋습니다:
var i,
length = 100;
for ( i = 0; i < length; i++ ) {
// 코드
}
// 아니면 이렇게 할 수도 있죠...
var i = 0,
length = 100;
for ( ; i < length; i++ ) {
// 코드
}
var prop;
for ( prop in object ) {
// 코드
}
if ( true ) {
// 코드
} else {
// 코드
}
3. 예외 사항, 약간의 탈선
// 콜백을 포함한 함수
foo(function() {
// 참고로 함수 호출을 실행하는 첫 괄호와 "function"이라는
// 단어 사이에는 별도의 공백이 없습니다.
});
// 배열을 받는 함수일 때에는 공백 없음
foo([ "alpha", "beta" ]);
// 객체를 받는 함수일 때에는 공백 없음
foo({
a: "alpha",
b: "beta"
});
// 괄호안에 괄호가 있을 때에는 공백 없음
if ( !("foo" in obj) ) {
}
참조 사이트: https://github.com/rwaldron/idiomatic.js/tree/master/translations/ko_KR
Author And Source
이 문제에 관하여(JavaScript 코딩 규칙), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다
https://velog.io/@sa1341/JavaScript-코딩-규칙
저자 귀속: 원작자 정보가 원작자 URL에 포함되어 있으며 저작권은 원작자 소유입니다.
우수한 개발자 콘텐츠 발견에 전념
(Collection and Share based on the CC Protocol.)
// 변수
var foo = "bar",
num = 1;
// 리터럴 표기법:
var array = [],
object = {};
// 함수 같은 유효 범위에 `var` 를 하나만 사용하면 가독성이 높아집니다.
// 이렇게 하면 선언 목록도 깔끔해집니다(아울러 키보드로 입력해야 할 양도 줄어들지요)
// 나쁜 스타일
var foo = "";
var bar = "";
var qux;
// 좋은 스타일
var foo = "",
bar = "",
quux;
// 또는..
var // 아래 변수에 대한 설명
foo = "",
bar = "",
quux;
// var 문은 관련있는 스코프(함수) 안의 시작하는 곳에 있어야합니다.
// ECMAScript 6의 const, let도 같은 맥락으로 이 규칙이 적용됩니다.
// 나쁜 스타일
function foo() {
// 여기에 어떤 구문이 있음
var bar = "",
qux;
}
// 좋은 스타일
function foo() {
var bar = "",
qux;
// 변수 선언이후에 모든 구문들이 옴.
}
// 일반 함수 선언
function foo( arg1, argN ) {
}
// 사용법
foo( arg1, argN );
// 일반 함수 선언
function square( number ) {
return number * number;
}
// 사용법
square( 10 );
// 아주 부자연스러운 연속 전달 스타일(continuation passing style) (CPS에 대해서는 http://goo.gl/TA32o를 참고)
function square( number, callback ) {
callback( number * number );
}
square( 10, function( square ) {
// 콜백 문장
});
// 함수 표현식
var square = function( number ) {
// 가치 있고 의미 있는 뭔가를 반환합니다
return number * number;
};
// 식별자를 지닌 함수 표현식
// 아래와 같은 형태는 자기 자신을 호출할 수 있으면서
// 스택 트레이스상에서 식별할 수 있다는 부가적인 장점이 있습니다:
var factorial = function factorial( number ) {
if ( number < 2 ) {
return 1;
}
return number * factorial( number-1 );
};
// 생성자 선언
function FooBar( options ) {
this.options = options;
}
// 사용법
var fooBar = new FooBar({ a: "alpha" });
fooBar.options;
// { a: "alpha" }
// if나 else, for while, try를 쓸 때에는 항상 빈 칸을 띠우고, 괄호를 사용하고, 여러 줄로 나누어 쓰세요.
// 이렇게 하면 가독성이 더 좋아집니다.
// 빼곡해서 알아보기 어려운 구문의 예
if(condition) doSomething();
while(condition) iterating++;
for(var i=0;i<100;i++) someIterativeFn();
// 가독성이 높아지도록 빈 칸을 띠워주세요.
if ( condition ) {
// 코드
}
while ( condition ) {
// 코드
}
for ( var i = 0; i < 100; i++ ) {
// 코드
}
// 아래처럼 하면 더 좋습니다:
var i,
length = 100;
for ( i = 0; i < length; i++ ) {
// 코드
}
// 아니면 이렇게 할 수도 있죠...
var i = 0,
length = 100;
for ( ; i < length; i++ ) {
// 코드
}
var prop;
for ( prop in object ) {
// 코드
}
if ( true ) {
// 코드
} else {
// 코드
}
// 콜백을 포함한 함수
foo(function() {
// 참고로 함수 호출을 실행하는 첫 괄호와 "function"이라는
// 단어 사이에는 별도의 공백이 없습니다.
});
// 배열을 받는 함수일 때에는 공백 없음
foo([ "alpha", "beta" ]);
// 객체를 받는 함수일 때에는 공백 없음
foo({
a: "alpha",
b: "beta"
});
// 괄호안에 괄호가 있을 때에는 공백 없음
if ( !("foo" in obj) ) {
}
참조 사이트: https://github.com/rwaldron/idiomatic.js/tree/master/translations/ko_KR
Author And Source
이 문제에 관하여(JavaScript 코딩 규칙), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://velog.io/@sa1341/JavaScript-코딩-규칙저자 귀속: 원작자 정보가 원작자 URL에 포함되어 있으며 저작권은 원작자 소유입니다.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)