알아야 할 자바스크립트 기능

이 글에서는 정의되지 않았거나 null일 수 있는 데이터에 액세스하려고 할 때 오류를 방지하는 방법과 가능한 방법을 살펴보겠습니다. 필요할 때 데이터를 효과적으로 관리하기 위해 사용하세요.

선택적 체인을 통한 안전한 액세스

JavaScript에서 중첩된 개체 내의 값이나 함수에 액세스하려고 할 때 결과가 정의되지 않음이면 코드에서 오류가 발생할 수 있습니다. 이 오류로 인해 코드 실행이 중단될 수 있습니다. 그러나 선택적 연결 연산자를 사용하면 객체 내의 값이나 함수에 액세스하려고 할 때 해당 값이나 함수가 존재하지 않으면 오류를 발생시키는 대신 정의되지 않은 값을 반환합니다. 이렇게 하면 코드 충돌이 방지됩니다.

예:

const person = {
  name: 'John',
  address: {
    city: 'New York'
  }
};

console.log(person.address?.city); // 'New York'
console.log(person.address?.country); // undefined, no error

무효 합체

변수 값이 null이거나 정의되지 않음인 경우 코드가 손상될 수 있습니다. 변수가 null이거나 정의되지 않은 경우 기본값을 할당하려면** null 병합 연산자(??)를 사용하면 됩니다.**

예:

function getConfig(config) {
    return config ?? { timeout: 1000, retries: 3 };
}

let userConfig = null;
let finalConfig = getConfig(userConfig); // { timeout: 1000, retries: 3 } 
console.log(finalConfig);

Set 및 WeakSet을 사용하여 중복 관리

세트로 중복 제거:

배열에 중복 값이 포함된 경우 Set을 사용하여 해당 중복 값을 제거할 수 있습니다. 이 구조를 사용하는 방법은 다음과 같습니다.

const numbers = [1, 2, 3, 4, 4, 5, 6, 6, 7, 8, 9, 9];
const uniqueNumbers = [...new Set(numbers)];

console.log(uniqueNumbers); // [1, 2, 3, 4, 5, 6, 7, 8, 9]

WeakSet으로 중복 방지:

WeakSet은 객체에 대한 참조를 보유하므로 객체는 WeakSet에 한 번만 추가될 수 있습니다. 예는 다음과 같습니다.

// Creating a WeakSet
const weakset = new WeakSet();

// Defining objects
const obj1 = { name: 'Alice' };
const obj2 = { name: 'Bob' };

// Adding objects to the WeakSet
weakset.add(obj1);
weakset.add(obj2);

console.log(weakset.has(obj1)); // true
console.log(weakset.has(obj2)); // true

// Attempting to add the same object again
weakset.add(obj1); // obj1 is already present, won't be added again

console.log(weakset.has(obj1)); // true
console.log(weakset.has(obj2)); // true

// Removing an object from the WeakSet
weakset.delete(obj1);
console.log(weakset.has(obj1)); // false

// Adding the object again
weakset.add(obj1);
console.log(weakset.has(obj1)); // true

결론

이 기사에서는 정의되지 않았거나 null일 수 있는 값에 액세스할 때 오류를 방지하는 데 도움이 되는 몇 가지 중요한 개념과 필요할 때 데이터를 보다 효과적으로 관리하는 방법을 살펴보았습니다.

위 내용은 알아야 할 자바스크립트 기능의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!