VUE3.0을 빠르게 시작하는 방법:
심볼(symbol)은 ES6의 새로운 데이터 유형입니다. 기호는 기본 값(기본 데이터 유형)이며 기호 인스턴스는 고유하고 변경할 수 없습니다. 이는 고유하게 표시한 다음 문자열이 아닌 형식의 개체 속성으로 사용되기 때문에 생성됩니다. 이는 개체 속성이 고유 식별자를 사용하고 속성 충돌의 위험이 없도록 하기 위한 것입니다.
기호는 Symbol() 함수를 사용하여 초기화해야 합니다. 기호 자체는 기본 유형이므로 typeof 연산자는 기호에 대한 기호를 반환합니다.
하자 기호 = 기호(); console.log(typeof Sym); // 기호
Symbol() 함수는 설명할 문자열 매개변수를 수신한 다음 이 문자열을 사용하여 코드를 디버깅할 수 있습니다. 그러나 여러 Symbol() 함수가 동일한 매개변수를 허용하더라도 해당 값은 동일하지 않다는 점은 주목할 가치가 있습니다.
let genericSymbol = Symbol();
let otherGenericSymbol = Symbol();
let fooSymbol = Symbol("foo");
let otherFooSymbol = Symbol("foo");
console.log(genericSymbol == otherGenericSymbol); // 거짓
console.log(fooSymbol == otherFooSymbol); // false 코드의 여러 위치에서 동일한 Symbol 인스턴스를 사용해야 하는 경우 문자열을 전달한 다음 Symbol.for( ) 메소드를 사용하여 싱글톤 모드와 유사하게 재사용 가능한 Symbol을 생성합니다. Symbol.for()를 처음 사용할 때 전달된 매개변수를 기반으로 Symbol.for()를 사용하여 생성할지 여부를 전역적으로 검색합니다. 인스턴스가 전달되었으면 재사용하고, 없으면
새로 만듭니다. let fooGlobalSymbol = Symbol.for("foo"); // 새 심볼을 만듭니다. let otherFooGlobalSymbol = Symbol.for("foo") / / 재사용 서명됨 console.log(fooGlobalSymbol === otherFooGlobalSymbol); // true Symbol.for()에 의해 생성된 인스턴스와 Symbol()에 의해 생성된 인스턴스의 차이점: Symbol()에 의해 생성된 인스턴스는 항상 고유하며 입력 매개변수는 동일하고 다른 인스턴스와 동일하지만, Symbol.for()에 의해 생성된 인스턴스는 동일한 Symbol 인스턴스를 공유하기 때문에 매개변수가 동일하면 동일합니다.
let fooSymbol = Symbol("foo");
let otherFooSymbol = Symbol("foo");
console.log(fooSymbol == otherFooSymbol); // 거짓
let fooGlobalSymbol = Symbol.for("foo"); // 새 심볼 만들기 let otherFooGlobalSymbol = Symbol.for("foo"); // 기존 심볼 재사용 console.log(fooGlobalSymbol === otherFooGlobalSymbol); 객체의 속성은 일반적으로 문자열 형식이지만 실제로는 Symbol 인스턴스를 속성으로 사용할 수도 있습니다. 이 방법의 장점은 새 속성이 이전 속성을 덮어쓰지 않는다는 것입니다
. "푸"),
s2 = 기호("바"),
s3 = 기호("baz"),
s4 = 기호("qux");
o = {
[s1]: "foo 발",
};
// 이 방법도 작동합니다: o[s1] = 'foo val';
console.log(o);
// {Symbol(foo): foo 발}
Object.defineProperty(o, s2, { value: "bar val" });
console.log(o);
// {Symbol(foo): foo val, Symbol(bar): bar val}
Object.defineProperties(o, {
[s3]: { 값: "baz val" },
[s4]: { 값: "qux val" },
});
console.log(o);
// {Symbol(foo): foo val, Symbol(bar): bar val,
// Symbol(baz): baz val, Symbol(qux): qux val} 참고: Symbol 인스턴스를 객체 속성으로 생성할 때 처음에 이를 받도록 변수를 선언하지 않고 심볼을 변경하면 이후에 순회해야 합니다. 해당 속성 키를 찾기 위해 속성의 모든 기호:
let o = {
[Symbol("foo")]: "foo 값",
[Symbol("바")]: "바 발",
};
console.log(o);
// {Symbol(foo): "foo 값", Symbol(bar): "bar 값"}
let barSymbol = Object.getOwnPropertySymbols(o).find(symbol => Symbol.toString().match(/bar/));
console.log(barSymbol);
// 기호(bar) ES6에서는 언어의 내부 동작을 노출하기 위해 일반적으로 사용되는 여러 내장 기호(잘 알려진 기호)를 도입하여 개발자가 이러한 기호에 직접 액세스하고 다시 작성하거나 시뮬레이션할 수 있습니다. 행동. 이러한 기본 속성을 수정하면 일부 작업의 최종 실행 결과가 변경될 수 있습니다. 예를 들어 for-of 루프는 관련 객체의 Symbol.iterator 속성을 사용하므로 사용자 정의 객체에서 Symbol.iterator 값을 재정의하여 객체를 반복할 때 for-of의 동작을 변경할 수 있습니다.
는 실제로 Promise를 반환하는 생성기이며 일반적으로 for wait와 함께 사용됩니다.
ECMAScript 사양에 따르면 이 기호는 속성으로 "객체의 기본 AsyncIterator를 반환하는 메서드"를 나타냅니다. "를 사용하는 문을 기다리십시오. 즉, 이 기호는 비동기 반복자 API를 구현하는 함수를 나타냅니다.
이 속성은 Function 프로토타입에 정의되어 있습니다. 우리 모두는 객체 인스턴스가 특정 생성자에 속하는지 여부를 확인하는 데 objectof 연산자를 사용할 수 있다는 것을 알고 있습니다. 원칙은 instanceof 연산자가 Symbol.hasInstance 함수를 사용하여 관계
함수 Foo() {}를 결정한다는 것입니다.
f = new Foo()를 두십시오;
console.log(f 인스턴스of Foo); // 참
클래스 바 {}
b = new Bar();
console.log(b 인스턴스of Bar); // true 함수의 Symbol.hasInstance 속성을 재정의하면 인스턴스of 메서드가 예상치 못한 결과를 반환하도록 할 수 있습니다.
class Bar {}
클래스 Baz는 Bar {를 확장합니다.
정적 [Symbol.hasInstance]() {
거짓을 반환;
}
}
b = new Baz();
console.log(Bar[Symbol.hasInstance](b)) // 참
console.log(b 인스턴스 오브 Bar); // 참
console.log(Baz[Symbol.hasInstance](b)) // 거짓
console.log(b instanceof Baz); // false 이 속성은 Array 의 프로토타입에 정의되어 있습니다
. ECMAScript 사양에 따르면 이 기호는 속성으로 "부울 값"을 나타냅니다. 객체는 Array를 사용해야 합니다. 프로토타입.concat()은 배열 요소를 평면화합니다. ES6의 Array.prototype.concat() 메소드는 수신된 객체 유형에 따라 배열과 유사한(의사 배열) 객체를 배열 인스턴스로 연결하는 방법을 선택합니다. 따라서 Symbol.isConcatSpreadable 값을 수정하면 이 동작을 수정할 수 있습니다.
false입니다. 전체 개체를 배열에 추가합니다. true: 전체 쌍을 배열에 추가합니다.
letinitial = ["foo"];
let array = ["bar"];
console.log(array[Symbol.isConcatSpreadable]); // 정의되지 않음
console.log(initial.concat(array)); // ['foo', 'bar']
배열[Symbol.isConcatSpreadable] = false;
console.log(initial.concat(array)); // ['foo', Array(1)]
let arrayLikeObject = { 길이: 1, 0: "baz" };
console.log(arrayLikeObject[Symbol.isConcatSpreadable]) // 정의되지 않음
console.log(initial.concat(arrayLikeObject))); // ['foo', {...}]
arrayLikeObject[Symbol.isConcatSpreadable] = true;
console.log(initial.concat(arrayLikeObject))); // ['foo', 'baz']
let otherObject = new Set().add("qux");
console.log(otherObject[Symbol.isConcatSpreadable]); // 정의되지 않음
console.log(initial.concat(otherObject)); // ['foo', Set(1)]
otherObject[Symbol.isConcatSpreadable] = true;
console.log(initial.concat(otherObject)); // ['foo'] ECMAScript 사양에 따르면 이 기호는 속성으로 "객체의 기본 반복자를 반환하는 메서드를 나타냅니다. for- of 문은 "
이 속성은 Generator 함수를 반환하고 for of는 next() 메서드를 차례로 호출합니다. 이것이 for of가 특정 객체에 사용될 수 있는 이유입니다.
클래스 이미 터 {
생성자(최대) {
this.max = 최대;
this.idx = 0;
}
*[Symbol.iterator]() {
동안(this.idx < this.max) {
this.idx++를 산출하십시오;
}
}
}
함수 카운트() {
이미터 = 새 이미터(5)로 설정;
for (이미터의 상수 x) {
console.log(x);
}
}
세다();
// 0
// 1
// 2
// 3
// 4 ECMAScript 사양에 따르면 이 기호는 속성으로 "정규식을 사용하여 문자열을 일치시키는 정규식 메서드. String.prototype.match() 메서드에서 사용됩니다."를 나타냅니다.
String.prototype.match() 메서드는 Symbol.match에 의해 입력된 함수를 사용하여 정규식을 평가합니다. 따라서 정규 표현식의 Symbol.match 속성을 변경하면 String.prototype.match()가 원하는 값을 얻을 수 있습니다.
console.log(RegExp.prototype[Symbol.match]);
// å [Symbol.match]() { [네이티브 코드] }
console.log("foobar".match(/bar/));
// ["bar", 인덱스: 3, 입력: "foobar", 그룹: 정의되지 않음]
클래스 FooMatcher {
정적 [Symbol.match](대상) {
return target.includes("foo");
}
}
console.log("foobar".match(FooMatcher)) // 참
console.log("barbaz".match(FooMatcher)) // 거짓
클래스 StringMatcher {
생성자(str) {
this.str = str;
}
[Symbol.match](대상) {
return target.includes(this.str);
}
}
console.log("foobar".match(new StringMatcher("foo"))); // true
console.log("barbaz".match(new StringMatcher("qux"))); // false 이 기호는 속성으로 "문자열 Index of에서 일치하는 정규식을 반환하는 정규식 메서드를 나타냅니다. String.prototype.search() 메서드에서 사용됩니다."
속성인 이 기호는 "파생 객체를 생성하기 위한 생성자 역할을 하는 함수 값"을 나타냅니다.
이 기호는 속성으로 "정규식과 일치하는 인덱스 위치에서 문자열을 분할하는 정규식 메서드를 나타냅니다. String.prototype.split() 메서드에서 사용됩니다."
이 기호는 속성으로 "객체를 해당 기본 값으로 변환하는 메서드입니다. ToPrimitive 추상 연산에서 사용됩니다."
이 기호는 속성으로 "String을 사용하여 사용되는 문자열"을 나타냅니다. 객체의 기본 문자열 설명을 생성합니다. 내장 메서드 Object.prototype.toString()에 의해 사용됩니다."
이 기호는 객체를 속성으로 나타내며 객체의 모든 속성과 상속된 속성이 파생됩니다. 환경 바인딩을 사용하여 연결된 개체에서 제외됨