홈페이지>웹 디자인 튜토리얼>자바스크립트 튜토리얼

프리미티브의 방법

저자：Eve Cole 업데이트 시간：2024-12-27 09:21:15

JavaScript를 사용하면 기본 요소(문자열, 숫자 등)를 객체인 것처럼 작업할 수 있습니다. 또한 호출할 수 있는 메서드도 제공합니다. 우리는 그것들을 곧 연구할 것이지만, 먼저 그것이 어떻게 작동하는지 볼 것입니다. 왜냐하면 물론 원시형은 객체가 아니기 때문입니다(그리고 여기서는 더 명확하게 할 것입니다).

기본 요소와 객체 간의 주요 차이점을 살펴보겠습니다.

원시적인

  • 기본 유형의 값입니다.

  • 7가지 기본 유형이 있습니다: string , number , bigint , boolean , symbol , null 및 undefined .

객체

  • 여러 값을 속성으로 저장할 수 있습니다.

  • {} 로 생성할 수 있습니다(예: {name: "John", age: 30} . JavaScript에는 다른 종류의 객체도 있습니다. 예를 들어 함수는 객체입니다.

객체의 가장 좋은 점 중 하나는 함수를 속성 중 하나로 저장할 수 있다는 것입니다.

 존 = {
  이름: "존",
  sayHi: function() {
    Alert("안녕 친구!");
  }
};

john.sayHi(); // 안녕 친구!

여기에서는 sayHi 메소드를 사용하여 객체 john 만들었습니다.

날짜, 오류, HTML 요소 등을 다루는 객체와 같은 많은 내장 객체가 이미 존재합니다. 이들은 서로 다른 속성과 메서드를 가지고 있습니다.

그러나 이러한 기능에는 비용이 발생합니다!

객체는 프리미티브보다 "무거워"집니다. 내부 기계를 지원하려면 추가 리소스가 필요합니다.

객체로서의 프리미티브

JavaScript 창시자가 직면한 역설은 다음과 같습니다.

  • 문자열이나 숫자와 같은 기본 요소로 수행하고 싶은 작업이 많이 있습니다. 메서드를 사용하여 액세스하는 것이 좋을 것입니다.

  • 기본 요소는 최대한 빠르고 가벼워야 합니다.

해결책은 약간 어색해 보이지만 다음과 같습니다.

  1. 원시인은 여전히 ​​원시적이다. 원하는 대로 단일 값입니다.

  2. 이 언어를 사용하면 문자열, 숫자, 부울 및 기호의 메서드와 속성에 액세스할 수 있습니다.

  3. 이것이 작동하려면 추가 기능을 제공하는 특별한 "객체 래퍼"가 생성된 다음 제거됩니다.

"객체 래퍼"는 각 기본 유형마다 다르며 String , Number , Boolean , Symbol 및 BigInt 라고 합니다. 따라서 그들은 다양한 방법 세트를 제공합니다.

예를 들어 대문자 str 반환하는 문자열 메서드 str.toUpperCase()가 있습니다.

작동 방식은 다음과 같습니다.

 str = "안녕하세요";

경고( str.toUpperCase() ); // 안녕하세요

간단하죠? str.toUpperCase() 에서 실제로 일어나는 일은 다음과 같습니다.

  1. 문자열 str 기본 요소입니다. 따라서 해당 속성에 액세스하는 순간 문자열 값을 알고 toUpperCase() 와 같은 유용한 메서드를 포함하는 특수 객체가 생성됩니다.

  2. 해당 메서드가 실행되고 새 문자열( alert 로 표시됨)을 반환합니다.

  3. 특수 객체는 파괴되고 기본 str 그대로 유지됩니다.

따라서 기본 요소는 메서드를 제공할 수 있지만 여전히 가볍습니다.

JavaScript 엔진은 이 프로세스를 고도로 최적화합니다. 추가 개체 생성을 전혀 건너뛸 수도 있습니다. 하지만 여전히 사양을 준수해야 하며 사양을 생성하는 것처럼 동작해야 합니다.

숫자에는 고유한 메소드가 있습니다. 예를 들어 toFixed(n)는 숫자를 지정된 정밀도로 반올림합니다.

 n = 1.23456이라고 하자;

경고(n.toFixed(2) ); // 1.23

숫자와 문자열 장에서 더 구체적인 방법을 살펴보겠습니다.

생성자 String/Number/Boolean 내부 전용입니다.

Java와 같은 일부 언어에서는 new Number(1) 또는 new Boolean(false) 와 같은 구문을 사용하여 기본 요소에 대한 "래퍼 객체"를 명시적으로 생성할 수 있습니다.

JavaScript에서는 역사적인 이유로 가능하지만 매우 권장되지 않습니다 . 여러 곳에서 상황이 미쳐버릴 것입니다.

예를 들어:

 경고( 유형 0 ); // "숫자"

경고(새 번호 유형(0) ); // "물체"!

if 에서는 객체가 항상 진실이므로 여기에 경고가 표시됩니다.

 0 = 새 숫자(0)로 둡니다.

if (zero) { // 0은 객체이기 때문에 참입니다.
  Alert( "0이 진실입니다!?!" );
}

반면에 new 없이 동일한 함수 String/Number/Boolean 사용하는 것은 완전히 훌륭하고 유용한 것입니다. 값을 해당 유형(문자열, 숫자 또는 부울(원시))으로 변환합니다.

예를 들어 다음은 완전히 유효합니다.

 num = Number("123"); //문자열을 숫자로 변환

null/undef에는 메서드가 없습니다.

특수 프리미티브인 null 및 undefined 은 예외입니다. 해당하는 "래퍼 개체"가 없으며 메서드도 제공하지 않습니다. 어떤 의미에서 그들은 “가장 원시적”이다.

이러한 값의 속성에 액세스하려고 하면 다음 오류가 발생합니다.

 경고(null.test); // 오류

요약

  • null 및 undefined 제외한 기본 형식은 많은 유용한 메서드를 제공합니다. 우리는 다음 장에서 그것들을 연구할 것입니다.

  • 공식적으로 이러한 메서드는 임시 개체를 통해 작동하지만 JavaScript 엔진은 내부적으로 이를 최적화하도록 잘 조정되어 있으므로 호출 비용이 많이 들지 않습니다.

작업

문자열 속성을 추가할 수 있나요?

중요도: 5

다음 코드를 고려해보세요.

 str = "안녕하세요";

str.test = 5;

경고(str.test);

어떻게 생각하세요? 효과가 있을까요? 무엇을 보여줄 것인가?

실행해보세요:

 str = "안녕하세요";

str.test = 5; // (*)

경고(str.test);

use strict 여부에 따라 결과는 다음과 같습니다.

  1. undefined (엄격 모드 없음)

  2. 오류(엄격 모드).

왜? (*) 라인에서 무슨 일이 일어나고 있는지 재생해 보겠습니다.

  1. str 의 속성에 액세스하면 "래퍼 개체"가 생성됩니다.

  2. 엄격 모드에서는 쓰기가 오류입니다.

  3. 그렇지 않으면 해당 속성에 대한 작업이 계속되고 객체는 test 속성을 얻지만 그 후에는 "래퍼 객체"가 사라지므로 마지막 줄에서 str 에는 속성의 흔적이 없습니다.

이 예는 기본 요소가 개체가 아님을 명확하게 보여줍니다.

추가 데이터를 저장할 수 없습니다.

관련 기사