> 웹 프론트엔드 > JS 튜토리얼 > 프로그램 개발에 자바스크립트를 올바르게 사용하는 방법_javascript 기술

프로그램 개발에 자바스크립트를 올바르게 사용하는 방법_javascript 기술

WBOY
풀어 주다: 2016-05-16 16:43:21
원래의
999명이 탐색했습니다.

오늘 우리 프로그램을 개발하기 위해 자바스크립트를 올바르게 사용하는 방법에 대한 기사를 github에서 찾았습니다. 뻔뻔하게도 독창적인 기사를 생각해 냈습니다. 모두에게 공유해 보겠습니다.
Javascript에 대한 가장 합리적인 접근 방식입니다.
유형 //유형
객체 //객체
배열 //배열
문자열 //문자열
함수 //함수
속성 //속성
변수 //변수
호이스팅 //가변 호이스팅
조건식 및 등식 //조건식 및 방정식.
블록 //블록 코드
댓글 //댓글
공백 //공백
쉼표 //쉼표
세미콜론 //세미콜론
타입 캐스팅 & 강제 //타입 변환
명명 규칙 // 명명 규칙
접속자 //접속
생성자 //생성자
이벤트 //시간
모듈 //모델
jQuery //
ECMAScript 5 호환성 //ECMA 5 호환
테스트 //테스트
퍼포먼스 //퍼포먼스
리소스 //리소스
야생에서
번역
JavaScript 스타일 가이드 가이드
기여자
라이센스

종류
기본 유형: 기본 유형에 액세스하면 실제로 기본 유형의 콘텐츠에 직접 액세스됩니다.
문자열
번호
부울

정의되지 않음
var foo = 1,
바 = foo;
바 = 9;
console.log(foo,bar); //=>

복잡한 유형: 복합 유형의 데이터 유형에 액세스하면 실제로는 참조를 통해 변수의 값에 액세스합니다.

객체
배열
기능

var foo = [1,2];
bar = foo;
bar[0] = 9;
console.log(foo[0],bar[0]); // => 9,9
로그인 후 복사

객체(객체)
객체 리터럴을 사용하여 객체 생성(리터럴)

//bad
var item = new Object();
//good
var item = {};
로그인 후 복사
객체 속성 이름으로 예약된 키워드를 사용하지 마세요. IE8에서는 작동하지 않습니다.


//bad
var superman = {
default: {clark: 'kent'},
private: true
};
//good
var superman = {
defaults: {clark: 'kent'},
hidden: true
};
로그인 후 복사

배열(배열)
또한 리터럴 메소드를 사용하여 배열을 생성합니다

//bad
var items = new Array();
//good
var items = [];
로그인 후 복사
배열의 길이를 모르는 경우 Array에 내장된 push 메소드를 사용하여 삽입 작업을 수행하세요


var someStack = [];
//bad
someStack[someStack.length] = 'vein';
//good
someStack.push('vein');
로그인 후 복사
배열을 복사하려면 array.slice를 사용하세요


var len = items.length, //指的就是上面的内容...
itemCopy = [],
i;
//bad
for(i = 0; i < len ; ++i){
itemCopy[i] = items[i];
}
//good
itemCopy = items.slice(); //这里要注意了.这个我还真不知道...
로그인 후 복사

문자열 문자열
문자열을 작은따옴표로 묶으세요...//여기서 성능에 대한 적절한 설명을 찾지 못했습니다. 저는 개인적으로 이렇게 사용하는 것을 좋아합니다. (많이 입는 것보다 덜 입는 것이 낫죠? ..you 알아요..)

//bad
var name = "Bob Parr";
//good
var name = 'Bob Parr';
//bad
var fullName = "Bob " + this.lastName;
//good
var fullName = 'Bob ' + this.lastName;
로그인 후 복사
문자열이 80자를 초과하는 경우 여러 줄에 쓰려면 문자열 연결을 사용해야 합니다. 과도하게 사용할 경우 문자열을 연결하면 성능에 영향을 미칠 수 있으니 주의하세요


// bad
var errorMessage = 'This is a super long error that was thrown because of Batman. When you stop to think about how Batman had anything to do with this, you would get nowhere fast.';
// bad
var errorMessage = 'This is a super long error that was thrown because \
of Batman. When you stop to think about how Batman had anything to do \
with this, you would get nowhere \
fast.';
// good
var errorMessage = 'This is a super long error that was thrown because ' +
'of Batman. When you stop to think about how Batman had anything to do ' +
'with this, you would get nowhere fast.';
로그인 후 복사
배열을 생성할 계획이라면 아래와 같이 Array.join을 사용하면 더 좋은 결과를 얻을 수 있습니다..


var items,
messages,
length,
i;
messages = [{
stat: 'success',
message: ' This one worked'
},{
stat: 'success',
message: ' This one worked'
},{
stat: 'success',
message: ' This one worked'
}
];
length = messages.length;
//bad
function inbox(messages){
items = '<ul>';
for (i = 0; i < length; i++) {
items += '<li>' + messages[i].message + '</li>';
}
return items + '</ul>';
}
//good
function inbox(messages){
items = [];
for( i = 0; i < length ; i++){
items[i] = messages[i].message;
}
return '<ul><li>' + items.join('</li><li>') + '</li></ul>';
}
로그인 후 복사
기능


//匿名函数表达式..
var anonymous = function(){
return true;
};
// 命名函数表达式.
var named = function named(){
return true;
};
//即时引用函数
(function(){
console.log('Welcome to the Internet. Please follow me.');
})();
로그인 후 복사
함수 블록이 아닌 코드(if, while)에서는 함수를 정의하지 마세요. 그에 따라 코드 블록 중간에 외부 변수 이름에 함수를 할당하세요..


//bad
if(currentUser){
function test(){
console.log('Nope.');
}
}
//good
var test;
if(currentUser){
test = function(){
console.log('Yup'); 
}; //be careful with the semi-colon.
}
로그인 후 복사
속성

속성에 액세스하려면 점 구문을 사용하세요.

var luke = {
jedi: true,
age: 28
};
//bad
var isJedi = luke['jedi'];
//good
var isJedi = luck.jedi;
로그인 후 복사
변수를 사용하여 개체 속성에 액세스하는 경우 [] 대괄호를 사용하여

에 액세스하세요.

var luke = {
jedi: true,
age: 28
};
function getProp(prop) {
return luke[prop];
}
var isJedi = getProp('jedi');
로그인 후 복사
관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿