당신이 알지 못하는 JavaScript 기능. 1 부

이 기사는이 언어의 미묘함을 더 잘 이해하고 코드를 개선하는 데 도움이되는 JavaScript 기술을 공유합니다. 이 기사는 주로 주니어 및 중급 개발자를위한 것이지만 모두 지루할 수 있지만 모두가 읽을 수 있습니다. ? Telegram 채널을 구독하는 것을 잊지 마십시오. Front -End Development에 대한 흥미로운 기사를 공유 할 것입니다! ? 시작!

디지털 세그먼트 기호

숫자로

를 사용하여 코드의 가독성을 향상시킬 수 있습니다.

1. 선택 사슬 연산자 및 3 가지 컴퓨팅 문자 를 단순화합니다.

예를 들어 다음 코드를 단순화하려고합니다. _ 옵션 체인 연산자를 사용하여 코드를 다시 쓰십시오.

선택적 체인 작업은 코드를보다 간결하고 읽기 쉽게 만듭니다.

<code class="language-javascript">const sixBillion = 6000000000;

// 难以阅读
const sixBillion2 = 6000_000_000;

// 更易于阅读
console.log(sixBillion2); // 6000000000

// 也可用于计算
const sum = 1000 + 6000_000_000; // 6000001000</code>

2. 큰 정수 계산의 문제를 해결하기 위해 BigInt를 사용하여 && 불행히도 JS에서 예를 들면 :

많은 숫자를 계산하려면 bigint를 사용하는 것이 좋습니다. 이렇게하면 오류 계산을 피하는 데 도움이됩니다.

<code class="language-javascript">const obj = null;
console.log(obj && obj.name);
const title1 = document.querySelector('.title');
const title = title1 ? title.innerText : undefined;</code>

연산자의 대안

<code class="language-javascript">const obj = null;
console.log(obj?.name);
const title1 = document.querySelector('.title');
const title = title1?.innerText;</code>

객체의 속성이 있는지 확인하려면 일반적으로 연산자를 사용하지만

를 사용할 수도 있습니다.

둘 다 결점을 가지고 있습니다
3. 프로토 타입 상속의 속성을 포함하여 컴퓨팅 문자 검사의 기존 속성. 프로토 타입의 속성이 아니라 객체 자체의 속성을 확인하려면 예상치 못한 결과로 이어질 수 있습니다.

   메소드는 프로토 타입의 상속 속성을 제외하고 객체 자체의 속성 만 확인합니다. 그러나 객체가 메소드를 다시 작성하면이 메소드가 제대로 작동하지 않습니다. 이 경우 를 호출하면 오류가 발생하거나 결과가 잘못 될 수 있습니다.

이 방법 중 어느 것도 프로토 타입 체인을 통해 액세스 할 수있는 속성을 고려하지 않았습니다. 프로토 타입을 포함하여 객체의 속성을 확인 해야하는 경우 또는 와 같은 다른 방법을 사용해야합니다.

큰 객체 또는 중첩 된 데이터 구조를 처리 할 때 및 Number.MAX_SAFE_INTEGER는 불편하고 비효율적 일 수 있습니다. 이를 위해서는 프로그램 실행 속도를 늦추려면 여러 검사 및 방법 호출이 필요할 수 있습니다.

간단한 예 :

더 편리하고 안전한 연산자도 있습니다

.

<code class="language-javascript">Math.pow(2, 53) === Math.pow(2, 53) + 1; // true

// Math.pow(2, 53) => 9007199254740992

// Math.pow(2, 53) + 1 => 9007199254740992</code>

<code class="language-javascript">const sixBillion = 6000000000;

// 难以阅读
const sixBillion2 = 6000_000_000;

// 更易于阅读
console.log(sixBillion2); // 6000000000

// 也可用于计算
const sum = 1000 + 6000_000_000; // 6000001000</code>

5. 사용

   를 사용하려면 개인 속성을 선언합니다 #

과거에는 필드가 비공개임을 나타 내기 위해 속성 이름 (_) 앞에 줄을 추가하는 데 사용되었습니다. 그러나 이제 를 사용하여 실제 개인 속성을 선언 할 수 있습니다.

#

<code class="language-javascript">const obj = null; console.log(obj && obj.name); const title1 = document.querySelector('.title'); const title = title1 ? title.innerText : undefined;</code>를 사용하십시오
6. 를 사용하여 를 사용하여

   를 교체하려면 운명의 왼쪽 값이 널 또는 정의되지 않은지 확인한 다음 오른쪽의 값을 반환합니다. ?? > 예 : || 위의 예에서 왼쪽 변수의 값이 널 또는 피지되지 않은 경우 연산자는 왼쪽의 왼쪽 변수 값을 반환합니다.

   그렇지 않으면 왼쪽 변수의 값이 널 또는 정의되지 않은 경우 계산 기호는 오른쪽 변수의 값을 반환합니다.

문자열 숫자 로 변환되었습니다 ?? || 많은 개발자들이

기능을 사용하여 문자열을 숫자로 변환하지만 컴퓨팅 기호를 사용하여 동일한 결과를 얻을 수 있습니다

모두 모두 효과적이지만

컴퓨팅 기호는 더 간단하고 명확합니다.

<code class="language-javascript">const obj = null;
console.log(obj?.name);
const title1 = document.querySelector('.title');
const title = title1?.innerText;</code>

?? 하

> 함수를 사용하여 숫자를 아래쪽으로 포기하는 대신, 비 -

연산자 위치를 약어로 사용하는 것이 좋습니다.
이 기사에 설명 된 모든 기술을 사용하는 것이 좋습니다. 일부 방법은 코드를 손상시킬 수 있지만 코드를 이해하는 것이 중요합니다.
7. 이 기사를 읽어 주셔서 감사합니다! 유용한 것을 배웠기를 바랍니다. 두 번째 부분을 기대하십시오! ?

위 내용은 당신이 알지 못하는 JavaScript 기능. 1 부의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!