이 기사에서는 JavaScript에 대한 12 가지 팁을 공유하겠습니다. 이 팁은 실제 작업에서 몇 가지 문제를 해결하는 데 도움이 될 수 있습니다.
사용하십시오 !! 부울 값을 변환하는 연산자
때로는 변수가 존재하는지 확인하거나 값에 유효한 값이 있는지 확인해야하며, 존재하는 경우 TRUE가 반환됩니다. 그러한 검증을하기 위해, 우리는 사용할 수 있습니다! 이를 구현하는 작업자는 매우 편리하고 간단합니다. 변수의 경우, 변수를 사용할 수 있습니다. 변수의 값이 0, null, "", undefined 또는 nan이면 false를 반환하고 그렇지 않으면 true를 반환합니다. 예를 들어, 다음 예는 다음과 같습니다.
함수 계정 (현금) {this.cash = Cash; this.hasmoney = !! 현금; } var 계정 = 새 계정 (100.50); Console.log (Account.Cash); // 100.50 console.log (Account.Hasmoney); // true vally emptyCount = 새 계정 (0); Console.log (Volmaccount.cash); // 0 console.log (emptyAccount.hasmoney); // 거짓이 예에서, 계정의 값이 0보다 크면 ac
+를 사용하여 문자열을 숫자로 변환합니다
이 트릭은 매우 유용합니다. 매우 간단하며 문자열 데이터를 교차하여 숫자로 변환 할 수 있습니다. 그러나 문자열 데이터에만 적합합니다. 그렇지 않으면 다음 예제와 같은 NAN이 반환됩니다.
기능 tonumber (strnumber) {return +strnumber; } console.log (tonumber ( "1234")); // 1234 console.log (Tonumber ( "acb")); // 난이것은 날짜에도 작동 하며이 경우 타임 스탬프 번호를 반환합니다.
다음과 같이 코드를 복사하십시오 : console.log (+new date ()) // 1461288164385 및 조건부 기호
다음과 같은 코드가있는 경우 :
if (conested) {login (); }또한 변수를 축약하고 &&를 사용하여 함께 연결할 수 있습니다. 예를 들어, 위의 예는 다음과 같이 축약 될 수 있습니다.
코드 사본은 다음과 같습니다. consected && login ();
객체에 일부 속성이나 함수가 존재하는 경우 다음 코드와 같이 감지를 수행 할 수도 있습니다.
코드 사본은 다음과 같습니다. user && user.login ();
사용 || 연산자
ES6에는 기본 매개 변수 기능이 있습니다. 이전 브라우저 에서이 기능을 시뮬레이션하려면 || 연산자를 사용할 수 있고 기본값은 두 번째 매개 변수로 전달됩니다. 첫 번째 매개 변수로 반환 된 값이 False 인 경우 두 번째 값은 기본값으로 간주됩니다. 다음 예에서와 같이 :
기능 사용자 (이름, 나이) {this.name = 이름 || "올리버 퀸"; this.age = age || 27; } var user1 = new user (); Console.log (user1.name); // Oliver Queen Console.log (user1.age); // 27 var user2 = 새 사용자 ( "Barry Allen", 25); Console.log (user2.name); // Barry Allen Console.log (user2.age); // 25루프 길이의 캐시 배열
이 트릭은 매우 간단하며 큰 배열 루프를 처리 할 때 성능에 큰 영향을 미칩니다. 기본적으로 모든 사람은 다음과 같은 동기 반복 배열을 작성합니다.
for (var i = 0; i <array.length; i ++) {console.log (array [i]); }작은 배열 인 경우 큰 배열을 다루는 경우이 코드는 각 반복에서 배열 크기를 다시 계산하여 약간의 지연이 발생합니다. 이 현상을 피하기 위해 배열은 캐시로 사용할 수 있습니다.
var length = array.length; for (var i = 0; i <length; i ++) {console.log (배열 [i]); }다음과 같이 쓸 수도 있습니다.
for (var i = 0, length = array.length; i <length; i ++) {console.log (배열 [i]); }객체의 속성을 감지합니다
이 트릭은 일부 속성이 존재하는지 여부를 감지하고 정의되지 않은 함수 또는 속성을 실행하지 않아야 할 때 유용합니다. 크로스 호환 브라우저 코드를 사용자 정의 할 계획이라면이 팁을 사용할 수도 있습니다. 예를 들어, document.querySelector ()를 사용하여 ID를 선택하고 IE6 브라우저와 호환되지만이 기능은 IE6 브라우저에 존재하지 않으므로이 작업자를 사용하여 다음 예제와 같이이 기능이 존재하는지 여부를 감지하는 것이 매우 유용합니다.
if (문서의 'QuerySelector') {document.querySelector ( "#id"); } else {document.getElementById ( "id"); }이 예에서 QuerySelector 함수가 문서에 존재하지 않으면 문서가 호출됩니다.
배열에서 마지막 요소를 얻으십시오
Array.prototype.slice (시작, 끝)는 시작과 끝 사이의 배열 요소를 얻는 데 사용됩니다. 끝 매개 변수를 설정하지 않으면 배열의 기본 길이 값이 최종 값으로 간주됩니다. 그러나 일부 학생들은이 기능이 매개 변수로 음수 값을 받아 들일 수 있다는 것을 알지 못할 수도 있습니다. 시작 값으로 음수 값을 설정하면 배열의 마지막 요소를 얻을 수 있습니다. 좋다:
var array = [1,2,3,4,5,6]; console.log (array.slice (-1)); // [6] console.log (array.slice (-2)); // [5,6] console.log (array.slice (-3)); // [4,5,6]
어레이 잘린
이 트릭은 주로 배열의 크기를 잠그는 데 사용되며 배열에서 일부 요소를 삭제하는 데 사용되는 경우 매우 유용합니다. 예를 들어, 배열에는 10 개의 요소가 있지만 처음 5 개의 요소 만 갖고 싶다면 Array.length = 5로 배열을 잘릴 수 있습니다. 다음 예에서와 같이 :
var array = [1,2,3,4,5,6]; Console.log (Array.length); // 6 array.length = 3; Console.log (Array.length); // 3 console.log (배열); // [1,2,3]
모두 교체하십시오
string.replace () 함수를 사용하면 문자열 또는 일반 표현식을 사용하여 문자열을 대체 할 수 있습니다. 이 함수 자체는 첫 번째 문자열 만 대체합니다. 그러나 정규식으로 /g를 사용하여 replaceall () 함수 기능을 시뮬레이션 할 수 있습니다.
var String = "John John"; console.log (string.replace (/hn/, "ana")); // "Joana John"Console.log (String.replace (/hn/g, "ana")); // "Joana Joana"
어레이를 병합하십시오
두 배열을 병합하려면 일반적으로 Array.concat () 함수를 사용합니다.
var array1 = [1,2,3]; var array2 = [4,5,6]; Console.log (Array1.concat (Array2)); // [1,2,3,4,5,6];
이 기능은 두 개의 큰 배열을 병합하는 데 적합하지 않습니다. 새로 생성 된 배열을 저장하기 위해 많은 메모리를 소비하기 때문입니다. 이 경우 Array.pus (). apply (arr1, arr2)를 사용하여 대신 새 배열을 만들 수 있습니다. 이 방법은 새 배열을 만드는 데 사용되지 않으며 첫 번째와 두 번째 숫자를 결합하면서 메모리 사용량을 줄입니다.
var array1 = [1,2,3]; var array2 = [4,5,6]; console.log (array1.push.apply (array1, array2)); // [1,2,3,4,5,6];
Nodelist를 배열로 변환하십시오
문서를 실행하면 QuerySelectorall ( "P") 함수를 실행하면 DOM 요소, 즉 NODELIST 객체의 배열을 반환 할 수 있습니다. 그러나이 개체에는 Sort (), reture (), map (), filter () 등과 같은 배열의 함수 기능이 없습니다. 이러한 기본 배열 기능 기능을 사용하려면 노드 목록을 배열로 변환해야합니다. [] .slice.call (요소)을 사용하여 구현할 수 있습니다.
var elements = document.querySelectorall ( "P"); // nodelist var arrayElements = [] .slice.call (요소); // 이제 NODELIST는 배열 var arrayElements = array.from (요소)입니다. // 이것은 NODELIST를 배열로 변환하는 또 다른 방법입니다.
배열 요소의 수축
배열 요소의 셔플의 경우 Lodash와 같은 외부 라이브러리를 사용할 필요가 없습니다.
var list = [1,2,3]; console.log (list.sort (function () {math.random () -0.5})); // [2,1,3]요약
이제 유용한 JavaScript 팁을 배웠습니다. 이 팁이 직장에서 문제를 해결하는 데 도움이되기를 바랍니다. 그렇지 않으면이 기사가 도움이 될 것입니다. 훌륭한 JavaScript 팁이 있으면 의견에 공유하십시오.