> 웹 프론트엔드 > JS 튜토리얼 > 자바스크립트 초보자가 주의해야 할 7가지 세부 사항 요약_javascript 기술

자바스크립트 초보자가 주의해야 할 7가지 세부 사항 요약_javascript 기술

WBOY
풀어 주다: 2016-05-16 17:56:40
원래의
1038명이 탐색했습니다.

각 언어에는 고유한 특수 기능이 있습니다. JavaScript의 경우 var를 사용하여 모든 유형의 변수를 선언할 수 있습니다. 이 스크립팅 언어는 매우 간단해 보이지만 우아한 코드를 작성하려면 지속적인 경험 축적이 필요합니다. 이 문서에는 JavaScript 초보자가 주의하고 공유해야 할 7가지 세부 사항이 나열되어 있습니다.
(1) 코드 단순화
JavaScript에서 객체와 배열을 정의하는 것은 매우 간단합니다. 일반적으로 다음과 같이 작성되는 객체를 생성하려고 합니다.

코드 복사 코드는 다음과 같습니다.

var car = new Object()
car.colour = 'red';
car.wheels = 4;
car.hubcaps = 'spinning';
car.age = 4

다음과 같은 효과를 얻을 수 있습니다. :
코드 복사 코드는 다음과 같습니다.

var car = {
color :'red',
wheels:4,
 hubcaps:'spinning',
 age:4
}

다음은 훨씬 짧습니다. 개체 이름을 반복해서 쓸 필요가 없습니다.
그 외에도 배열을 간결하게 작성하는 방법도 있습니다.
코드 복사 코드는 다음과 같습니다.

var movieThatNeedBetterWriters = new Array(
'Transformers','Transformers2','Avatar','Indiana Jones 4'
); >
더보기 간결하게 작성하는 방법은

코드 복사 코드는 다음과 같습니다. 🎜>
var movieThatNeedBetterWriters = [
'Transformers','Transformers2','Avatar','Indiana Jones 4'
];


배열의 경우 연관 배열과 같은 특별한 것입니다. 많은 코드가 다음과 같이 객체를 정의하는 것을 볼 수 있습니다:


var car = new Array();
car['colour'] = '빨간색'
car['wheels'] = 4; Spinning';
car['age'] = 4;


이건 이상합니다. 혼동하지 마세요. "연관 배열"은 객체의 별칭일 뿐입니다.
코드를 단순화하는 또 다른 방법은 삼항 연산자를 사용하는 것입니다. 예:



if(x < 200){
방향 = 1
} else {
방향 = -1;


다음 코드를 사용하여 이 글을 대체할 수 있습니다.



코드 복사 (2) JSON을 데이터 형식으로 사용
위대한 Douglas Crockford가 발명했습니다. JSON 데이터 형식을 사용하여 데이터를 저장하는 경우 기본 자바스크립트 방법을 사용하여 추가 변환 없이 복잡한 데이터를 저장할 수 있습니다. 예:


코드 복사
코드는 다음과 같습니다. var band = { "name":"The Red Hot Chili Peppers",
"members":[
{
"name": "Anthony Kiedis",
"역할":"리드 보컬"
},
{
"name":"Michael 'Flea' Balzary",
"역할 ":"베이스 기타, 트럼펫, 백 보컬"
},
{
"name":"Chad Smith",
"역할":"드럼, 타악기"
},
{
"이름":"John Frusciante",
"역할":"리드 기타"
}
],
"연도":"2009"
}


JSON을 JavaScript에서 직접 사용할 수도 있고, 다음과 같은 많은 API에서 사용되는 API에서 반환된 형식으로 사용할 수도 있습니다.



코드 복사
코드는 다음과 같습니다.

<script> <br>function Delicious(o){ <br>var out = '<ul>'; for(var i=0;i<o.length;i ){ <BR>out = '<li><a href="' o[i].u '">' <br>o[i ].d '</a></li>'; <br>} <br>out = '</ul>' <br>document.getElementById('delicious').innerHTML = out <br>} <br></script>
최신 이슈
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿