JavaScript 문법 단축키 뒤에 있는 마력

언뜻 보기에 자바스크립트는 매우 간단하고 직접적인 인코딩 언어인 것 같다.하지만 깊이 들어갈수록 사실이 아니라는 것을 깨닫게 된다.원형 모델을 바탕으로 하는 일반적인 복잡성을 제외하고 이 언어는 많은 문법적 지름길과 예측할 수 없는 기교를 포함하고 있기 때문에 이러한 기교에 항상 주의해야 한다.네 개 보여줄게!

1. 조건(삼원) 연산자
JS if에서 하나의 문장으로 변수에 직접 분배할 수 없지만 대체할 수 있는 방법이 있습니다.이것은 삼원 연산자라고 불리며, 보통 특정 조건에 따라 간단한 단행 값을 만드는 데 쓰인다.

const condition = 1 > 0;
const result = condition ? "1 is greater than 0" : "1 is smaller than 0";
result; // "1 is greater than 0"

이곳의 문법은 매우 간단하다.첫 번째는 조건이고 그 다음은 물음표(?)이다.그 다음에 두 개의 사칭으로 구분된 표현식(:)을 각각 조건이truthy나falsy일 때(예를 들어 0, false, "")를 사용한다.
마찬가지로 이곳의 문법과 규칙은 매우 간단하여 짧은 조건의 값을 처리할 때 매우 응용하기 쉽다.그럼에도 불구하고, 새로운 프로그래머는 처음에 그것을 이해할 때 약간의 문제에 부딪힐 수 있다.

2. 논리 및 연산자
JavaScript 유형 시스템의 동적 특성은 일반적으로 큰 문제가 있을 수 있지만, 또한 멋진 단축키를 사용할 수 있다.논리 AND 연산자(&&)의 경우

const allow = true;
const value = allow && "value";

위 코드 세그먼트는 다음 내용을 표시할 수 있는 바로 가기를 제공합니다.

const allow = true;
let value;
if (allow) {
  value = "value";
}

AND 연산자는 첫 번째 표현식이 truthy일 때만 두 번째 표현식을 계산하기 때문에 특정 조건이 충족되면 AND 연산자를 사용하여 변수에 빠르게 값을 지정할 수 있습니다.
단, 조건이 falsy일 때, 이 조건 표현식 (첫 번째 조작수) 은 결국 변수에 부여된다는 것을 기억해야 합니다.이것은 기대하는 효과가 아닐 수도 있고 코드를 파괴할 수도 있습니다. 예를 들어 undefined과 엄격하게 비교할 수도 있습니다.

const allow = false;
const firstValue = allow && "value";
let secondValue;
if (allow) {
  secondValue = "value";
}

if (secondValue === undefined) {
  // This will be executed.
}
if (!firstValue) {
  // This will also be executed.
}
if (firstValue === undefined) {
  // But this won't.
}

따라서 이런 단축 방식을 사용하는 것은 여전히 흔하지만 좋은 방법으로 여겨지지 않는다.

3. 증가/감소 연산자
증량 연산자(++)는 흔히 볼 수 있는 for 순환에서 흔히 볼 수 있는 외관 아닙니까?

for (let i = 0; i < 10; i++) {
  // ...
}

그것과 그의 '마이너스' 대응항 (감량 연산자 (--) 은 모두 간단한 작업을 한다. 그것은 증가하거나 1이 사용하는 수치를 줄이는 것이다.복잡하게 들리지는 않지만 알려지지 않은 괴벽도 있다.보기:

let baseValue = 10;
let secondValue = baseValue++;
let thirdValue = --baseValue;

baseValue; // 10
secondValue; // 10
thirdValue; // 10

그럼, 여기 도대체 무슨 일이 일어난 거야?이것들은 ++과 -- 연산자, 그리고 자주 사용하는 값 부여 조작이다.조작수 전이나 뒤에 놓을 수 있다는 것을 아십니까?
물론 그들은 할 수 있지만 그들의 행동이나 내가 조작 순서를 말해야 한다. 위치에 따라 다르다.

연산자가 조작수 이후(예를 들어 baseValue++)에 있으면 먼저 원시 값을 변수에 부여한 다음에 조작수를 증가/감소한다.

연산자가 조작수 이전(예를 들어 --baseValue)에 있으면 원시 값은 먼저 증가/감소한 다음에 변수에 분배된다.

따라서 우리의 코드 세션에서 secondValue은 baseValue(10)으로 부여된 다음에 11으로 증가했다.이후 baseValue은 먼저 10으로 줄어든 뒤 이 조작의 결과는 thirdValue으로 분배됐다.
이것이 바로 ++/-- 연산자가 통상적으로 for 순환 도로 밖에서 사용하는 것을 권장하지 않는 이유이다.이론적으로는 논리에 맞아야 하지만 초보자, 심지어 중급 JS 프로그래머에게는 혼란스러울 수 있다.

4. 태그
마지막으로, 나는 반드시 기교가 아니라, 흔히 볼 수 없는 문법적 특성만을 이야기하고 싶다.내가 말한 것은 JS 라벨인'표지부'로 각종 순환문장을 식별한 다음에 continue 또는 break 문장과 함께 사용할 수 있다.

outerLoop: 
for (let x = 0; x < 10; x++) {
  for (let y = 0; y < 10; y++) {
    if (x * y > 20) {
      break outerLoop;
    }
  }
}

라벨이 제공되지 않은 상황에서 continue과 break은 그것을 사용하는 회로에서 운행한다.그러나 탭 (예: outerLoop:) 을 지정하면 다른 순환을 인용하고 문장을 사용할 수 있습니다.따라서 탭의 유일한 용례는 플러그인 순환이다.솔직히 그곳에서도 흔치 않아요.이것은 그것들로 하여금 기본적으로 잘 이해하지만 자주 사용하지 않는 기능을 가지게 한다.

밑줄
나는 이 박문이 너로 하여금 JS의 예측할 수 없는 성질과 문법을 이해하게 할 수 있기를 바란다.만약 그렇다면, 나에게 열거한 '비결' 중 어느 것이 당신에게 새로운 것인지 알려주세요.
만약 당신이 이 글을 좋아한다면 그것을 공유하고 Facebook에서 나를 주목할 수 있다.만약 네가 흥미가 있다면, 나도 너에게 나의 사이트를 좀 보라고 건의한다.다시 한 번 본문을 읽어 주셔서 감사합니다. 즐거운 하루 되세요!