홈페이지 » 코딩 » 초보자를위한 Top 10 JavaScript Shorthands

    초보자를위한 Top 10 JavaScript Shorthands

    JavaScript 속기 코딩 프로세스의 속도를 높일뿐만 아니라 스크립트를 더 짧게 만들어서 빠른 페이지로드. 속기 코드는 해당 길이 버전만큼 유효합니다. 그들은 본질적으로 똑같은 뜻을 품다-더 컴팩트 한 형식으로 만 제공됩니다. 가장 간단한 코드 최적화 기술 중 하나입니다..

    몇 가지 JavaScript 속기가 있지만 공식 참조 가이드 없음. 일부는 매우 간단하고 다른 일부는 숙련 된 개발자에게도 매우 위협적입니다. 이 기사에서는 초보자를위한 10 개의 JavaScript 단축형 이를 통해 코드 최적화를 시작하고보다 간결한 코드를 작성할 수 있습니다..

    1. 십진수

    네가 정기적으로 큰 소수 자릿수로 작업 이 속기는 신의 선물 일 수 있습니다. 이제 더 이상 0을 모두 입력 할 필요가 없으므로 이자형 표기법. 예를 들어, 1e8 다음에 8 개의 0을 추가하는 것을 의미합니다. 1 자릿수 100000000.

    편지 뒤의 번호 이자형 0의 수를 나타냅니다. 이전에 그 숫자를 따라 온 이자형. 마찬가지로, 16e4 ~을위한 속기이다. 160000, 기타.

     / * 속기 * / var myVar = 1e8; / * Longhand * / var myVar = 100000000; 

    2. 증분, 감소

    그만큼 증분 속기 두 가지로 구성되어있다. + 부호의 의미는 변수의 값이 1 씩 증가. 유사하게, 감소 약식 두 개로 이루어져있다. - 표지판은 변수가 있어야 함을 의미합니다. 1 씩 감소.

    이 두 개의 축약어를 사용할 수 있습니다. 숫자 데이터 유형에만 해당. 그들은 루프에서 없어서는 안될 역할을하고 있으며, 가장 빈번한 사용 사례는 ...에 대한 고리.

     / * 속기 * / i ++; j--; / * Longhand * / i = i + 1; j = j-1; 

    3. 추가, 산만, 곱하기, 나누기

    각각에 대한 속기가 있습니다. 네 가지 기본 수학 연산: 덧셈, 산만, 곱셈, 나눗셈. 변수는 증분 및 감소 연산자와 유사하게 작동합니다. 여기서 변수의 값을 변경할 수 있습니다. 임의의 수만큼 (단지 하나가 아닌).

    아래 예에서 나는 변수는 5, j ~에 의해 감소된다. , 케이 곱해진다. 10, 과 ~로 나뉜다. 2.

     / * 속기 * / i + = 5; j = 3; k * = 10; 1 / 2; / * 긴 * / i = i + 5; j = j-3; k = k * 10; l = 1 / 2; 

    4. 문자 위치 결정

    그만큼 charAt () 방법 가장 자주 사용되는 문자열 메서드 중 하나입니다. 지정된 위치의 문자 (예를 들어, 5 문자열의 문자). 대신 간단한 간단한 사용법을 사용할 수 있습니다. 대괄호로 묶인 문자 위치 문자열 다음에.

    주의를 기울이십시오. charAt () 방법은 제로 기반. 따라서, myString [4] 5를 반환합니다. 문자열의 문자 ("와이" 이 예에서).

     var myString = "생일 축하합니다"; / * 속기 * / myString [4]; / * Longhand * / myString.charAt (4); 

    5. 일괄 적으로 변수 선언하기

    만들려는 경우 한 번에 하나 이상의 변수 하나씩 입력 할 필요가 없습니다. 사용하는 것으로 충분합니다. var (또는 방해) 키워드 한 번만, 그러면 만들려는 변수를 나열 할 수 있습니다., 쉼표로 구분.

    이 속기를 사용하면 두 가지를 모두 선언 할 수 있습니다. 정의되지 않은 변수들값이있는 변수.

     / * 속기 * / var i, j = 5, k = "좋은 아침", l, m = 거짓; / * Longhand * / var i; var j = 5; var k = "좋은 아침"; var l; var m = false; 

    6. 연관 배열 선언

    JavaScript로 배열을 선언하는 것은 상대적으로 간단한 작업입니다. var myArray = [ "apple", "pear", "orange"] 통사론. 하나, 연관 배열 선언 좀 더 복잡합니다. 여기서는 값뿐만 아니라 키도 정의해야합니다 (일반 배열의 경우 키는 0, 1, 2, 3 등.).

    연관 배열은 키 - 값 쌍 모음. 긴 방법은 배열을 선언 한 다음 각 요소를 하나씩 추가하는 것입니다. 그러나 아래의 속기를 사용하면 연상 배열을 선언한다. ...을 더한 모든 요소 동시에.

    아래 예에서 myArray 연관 배열은 유명한 사람들 (키)에게 출생지 (가치)를 할당합니다..

     / * 속기 * / var myArray =  "그레이스 켈리": "필라델피아", "클린트 이스트우드": "샌프란시스코", "험프리 보가트": "뉴욕시", "소피아 로렌": "로마", "잉그리드 Bergman ":"Stockholm " / * Longhand * / var myArray = new Array (); myArray [ "Grace Kelly"] = "Philadelphia"; myArray [ "Clint Eastwood"] = "샌프란시스코"; myArray [ "Humphrey Bogart"] = "뉴욕시"; myArray [ "Sophia Loren"] = "로마"; myArray [ "Ingrid Bergman"] = "스톡홀름"; 

    7. 객체 선언하기

    에 대한 속기 객체 선언 연관 배열의 경우와 유사하게 작동합니다. 그러나 여기에는 키 - 값 쌍이 없지만 속성 - 값 쌍 괄호 사이에 놓아야하는 .

    속기 구문의 유일한 차이점은 개체 속성은 따옴표로 묶지 않습니다. (이름, 출생지, 나이, wasJamesBond 아래 예에서).

     / * 속기 * / var myObj = name : "Sean Connery", placeOfBirth : "Edinburgh", 나이 : 86, wasJamesBond : true; / * Longhand * / var myObj = new Object (); myObj.name = "션 코너리"; myObj.placeOfBirth = "에딘버러"; myObj.age = 86; myObj.wasJamesBond = true; 

    8. 조건부 연산자 사용

    그만큼 조건부 (삼항) 연산자 자주 사용됩니다. 바로 가기 다른 경우라면 성명서. 그것은 세 부분:

    1. 그만큼 조건
    2. 어떤 경우에 조건이 참이다. (만약)
    3. 어떤 경우에 조건이 거짓 임 (그밖에)

    아래 예에서는 간단한 메시지 ( 메시지 변수)를 클럽에 입학하려는 사람들에게 제공합니다. 속기 양식을 사용하면 코드의 한 줄에 불과합니다. 평가를 실행하다.

     var age = 17; / * 속기 * / var message = age> = 18? "허용됨": "거부 됨"; / * Longhand * / if (age> = 18) var message = "허용";  else var message = "Denied";  

    테스트하고 싶다면 코드를 웹 콘솔에 복사하십시오. (대부분의 브라우저에서 F12)를 수정하고 나이 변수 몇 번.

    9. 존재 확인

    변수가 있는지 여부를 확인해야하는 경우가 자주 발생합니다. 현재 또는없는. 그만큼 “존재하면” 속기 훨씬 적은 코드로 그렇게 할 수 있습니다..

    JavaScript 속기에있는 대부분의 기사는 적절한 길이를 제공하지 않는다는 점에 유의하십시오. if (myVar) 표기법은 변수가 거짓인지 아닌지를 단순히 확인하지 않습니다. 즉, 변수 undefined, empty, null 및 false 일 수 없습니다..

     var myVar = 99; / * 속기 * / if (myVar) console.log ( "myVar 변수가 정의되어 있고 비어 있지 않고 null이 아니며 false도 아닙니다."); == "undefined"&& myVar! == ""&& myVar! == null && myVar! == 0 && myVar! == false) console.log ( "myVar 변수가 정의되어 있고 그것은 비어 있지 않고 null도 아니고 거짓도 아닙니다. ");  

    어떻게 테스트 할 수 있습니까? “존재하면” 속기는 다음 코드 스 니펫을 웹 콘솔에 삽입하여 작동합니다. 가치를 변화시키는 myVar 몇 번.

    이 속기가 어떻게 작동하는지 이해하려면 다음과 같은 값으로 테스트해볼 가치가 있습니다. "" (빈 문자열), 그릇된, 0, 참된, 비어 있지 않은 문자열 (예 :. "안녕하세요"), 숫자 (예 :. 99), 변수가 정의되지 않은 경우 (간단히 var myVar;).

    10. 부재 확인

    그만큼 “존재하면” 속기는 변수가 없는지 확인하십시오. 배치하여 그것 앞에 느낌표. 느낌표는 논리 비 연산자 JavaScript (및 대부분의 프로그래밍 언어).

    따라서 if (! myVar) 표기법을 사용하면 myVar 변하기 쉬운 정의되지 않았거나, 비어 있거나, null이거나, 거짓입니다..

     var myVar; / * 속기 * / if (! myVar) console.warn ( "myVar 변수가 정의되지 않았거나 (OR) 비어 있거나 (OR) FALSE)"; myVar === null || myVar === 0 || myVar === false) console.warn (= myVar === null) ( "myVar 변수는 정의되지 않았습니다 (OR) 비어 있습니다 (OR) null (OR) 거짓입니다.");