자바스크립트 스킬 7가지(2)_자바스크립트 스킬-JS 튜토리얼-php.cn

자바스크립트 스킬 7가지(2)_자바스크립트 스킬

WBOY

풀어 주다： 2016-05-16 15:25:48

원래의

1157명이 탐색했습니다.

지난 기사에서 JavaScript 7가지 기술(2)에 대해 소개했습니다. 저는 오랫동안 JavaScript 코드를 작성했는데 언제 시작했는지 기억도 나지 않습니다. 저는 최근 몇 년간 JavaScript가 성취한 성과에 대해 매우 기쁘게 생각합니다. 이러한 성과의 수혜자가 된 것은 행운이었습니다. 나는 이 언어에 관한 꽤 많은 기사, 장, 책을 썼지만 여전히 언어에 대한 새로운 것을 발견하고 있습니다. 다음은 과거에 "아!"라고 느꼈던 프로그래밍 기술에 대한 설명이며, 미래의 어느 시점에서 우연히 발견하기를 기다리기보다는 지금 시도해야 할 기술입니다.

var band = {
　　 "name":"The Red Hot Chili Peppers",
　　 "members":[
　　 {
　　 "name":"Anthony Kiedis",
　　 "role":"lead vocals"
　　 },
　　 {
　　 "name":"Michael 'Flea' Balzary",
　　 "role":"bass guitar, trumpet, backing vocals"
　　 },
　　 {
　　 "name":"Chad Smith",
　　 "role":"drums,percussion"
　　 },
　　 {
　　 "name":"John Frusciante",
　　 "role":"Lead Guitar"
　　 }
　　 ],
　　 "year":""
　　 }

로그인 후 복사

JSON을 JavaScript에서 직접 사용하거나 함수에 캡슐화하거나 API의 반환 값으로 사용할 수도 있습니다. 우리는 이것을 JSON-P라고 부르며 많은 API가 이 형식을 사용합니다. 데이터 공급자를 호출하고 스크립트 코드에서 직접 JSON-P 데이터를 반환할 수 있습니다.

01　
12　

딜리셔스 웹사이트에서 제공하는 웹 서비스 기능을 호출하여 최근 정렬되지 않은 북마크 목록을 JSON 형식으로 얻어오는 것입니다.

기본적으로 JSON은 복잡한 데이터 구조를 설명하는 가장 이식성이 뛰어난 방법이며 브라우저에서 실행할 수 있습니다.

json_decode() 함수를 사용하여 PHP에서 실행할 수도 있습니다.

JavaScript에 내장된 함수(Math, Array, String)　

저를 놀라게 한 한 가지 사실은 JavaScript의 수학 및 문자열 함수를 연구하면서 이러한 기능이 프로그래밍 작업을 크게 단순화할 수 있다는 점이었습니다.

이를 사용하면 복잡한 루프 처리 및 조건부 판단을 저장할 수 있습니다.

예를 들어 숫자 배열에서 가장 큰 숫자를 찾는 함수를 구현해야 할 때 저는 다음과 같이 루프를 작성하곤 했습니다.

 var numbers =
　　[,,,,];
　　 var max = ;
　　 for(var i=;i
　　 if(numbers[i]
　　> max){
　　 max = numbers[i];
　　 }
　　 }
　　 alert(max);

로그인 후 복사

반복 없이 이를 달성할 수 있습니다.

 var numbers =

　　[,,,,];
　　 numbers.sort(function(a,b){return b -
　　a});
　　 alert(numbers[]);

로그인 후 복사

숫자 배열은 sort()할 수 없습니다. 이 경우 알파벳 순서로만 정렬되기 때문입니다.
더 많은 사용법을 알고 싶다면 sort()에 대한 좋은 기사를 읽어보세요.

또 다른 흥미로운 함수는 Math.max()입니다.

이 함수는 매개변수에 있는 숫자 중 가장 큰 숫자를 반환합니다.

Math.max(12,123,3,2,433,4); // returns 433

로그인 후 복사

이 함수는 숫자를 확인하고 가장 큰 값을 반환하므로 이를 사용하여 기능에 대한 브라우저 지원을 테스트할 수 있습니다.

 var scrollTop=
　　Math.max(
　　 doc.documentElement.scrollTop,
　　 doc.body.scrollTop
　　 );

로그인 후 복사

IE 문제를 해결하는 데 사용됩니다. 현재 페이지의 scrollTop 값을 얻을 수 있지만 페이지의 DOCTYPE에 따라 위 두 속성 중 하나만 이 값을 저장하고 다른 속성은 정의되지 않으므로 Math.max를 사용하여 얻을 수 있습니다. () 숫자.

이 기사를 읽으면 수학 함수를 사용하여 JavaScript를 단순화하는 방법에 대해 더 많은 지식을 얻을 수 있습니다.

문자열을 조작하는 데 매우 유용한 또 다른 함수 쌍은 Split() 및 Join()입니다. 가장 대표적인 예가 CSS 스타일을 페이지 요소에 첨부하는 함수를 작성하는 것이라고 생각합니다.

페이지 요소에 CSS 클래스를 첨부할 때 해당 클래스는 이 요소의 첫 번째 CSS 클래스이거나 이미 일부 클래스를 포함하고 있습니다. 그런 다음 이 클래스를 추가하세요. 그리고 이 클래스를 제거하려면 클래스 앞에 있는 공백도 제거해야 합니다(과거에는 일부 오래된 브라우저가 클래스 뒤에 공백이 오는 것을 인식하지 못했기 때문에 이는 매우 중요했습니다).

그래서 원문은 이렇습니다.

 function addclass(elm,newclass){
　　 var c =
　　elm.className;
　　 elm.className = (c === '') &#63; newclass : c+' '+newclass;
　　 }　　你可以使用 split() 和 join() 函数自动完成这个任务： function addclass(elm,newclass){
　　 var classes =
　　elm.className.split(' ');
　　 classes.push(newclass);
　　 elm.className = classes.join(' ');
　　 }

로그인 후 복사

이렇게 하면 모든 클래스가 공백으로 구분되고 추가하려는 클래스가 맨 끝에 배치됩니다.

근시안적인 행동입니다. 툴킷은 빠르게 개발하는 데 도움이 될 수 있지만 JavaScript를 깊이 이해하지 못하면 잘못된 일을 할 수도 있습니다.

JSON 형식으로 데이터 저장

JSON을 발견하기 전에는 배열, 문자열, 쉽게 분리할 수 있는 기호와 혼합된 기타 혼란스러운 항목 등 JavaScript의 기본 데이터 유형으로 데이터를 저장하기 위해 온갖 종류의 미친 방법을 사용했습니다.

Douglas Crockford가 JSON을 발명한 후 모든 것이 바뀌었습니다.

JSON을 사용하면 자바스크립트 자체의 기능을 이용해 데이터를 복잡한 형식으로 저장할 수 있고, 별도의 변환 없이 바로 접근하여 사용할 수 있습니다.

JSON은 “JavaScript Object Notation”의 약어로 위에서 언급한 두 가지 약어 방식을 사용합니다.

위 콘텐츠는 편집자가 공유한 7가지 JavaScript 기술입니다. 마음에 드셨으면 좋겠습니다.