Avastage JavaScripti sĂŒmbolid: nende eesmĂ€rk, loomine, kasutamine unikaalsete vĂ”tmete ja metaandmete jaoks ning nimekonfliktide vĂ€ltimine. Praktilised nĂ€ited.
JavaScripti sĂŒmbolid: unikaalsed omaduste vĂ”tmed ja metaandmed
JavaScripti sĂŒmbolid, mis vĂ”eti kasutusele ECMAScript 2015-s (ES6), pakuvad mehhanismi unikaalsete ja muutumatute omaduste vĂ”tmete loomiseks. Erinevalt stringidest vĂ”i numbritest on sĂŒmbolid garanteeritult unikaalsed kogu teie JavaScripti rakenduses. Need pakuvad viisi nimekonfliktide vĂ€ltimiseks, metaandmete lisamiseks objektidele olemasolevaid omadusi segamata ja objektide kĂ€itumise kohandamiseks. See artikkel annab pĂ”hjaliku ĂŒlevaate JavaScripti sĂŒmbolitest, hĂ”lmates nende loomist, rakendusi ja parimaid tavasid.
Mis on JavaScripti sĂŒmbolid?
SĂŒmbol on primitiivne andmetĂŒĂŒp JavaScriptis, sarnaselt numbrite, stringide, tĂ”evÀÀrtuste, nulli ja undefined-iga. Kuid erinevalt teistest primitiivsetest tĂŒĂŒpidest on sĂŒmbolid unikaalsed. Iga kord, kui loote sĂŒmboli, saate tĂ€iesti uue, unikaalse vÀÀrtuse. See unikaalsus muudab sĂŒmbolid ideaalseks:
- Unikaalsete omaduste vĂ”tmete loomine: SĂŒmbolite kasutamine omaduste vĂ”tmetena tagab, et teie omadused ei satu konflikti olemasolevate omadustega vĂ”i teiste teekide vĂ”i moodulite lisatud omadustega.
- Metaandmete talletamine: SĂŒmboleid saab kasutada metaandmete lisamiseks objektidele viisil, mis on peidetud standardsete loendusmeetodite eest, sĂ€ilitades objekti terviklikkuse.
- Objekti kĂ€itumise kohandamine: JavaScript pakub komplekti tuntud sĂŒmboleid, mis vĂ”imaldavad teil kohandada, kuidas objektid teatud olukordades kĂ€ituvad, nĂ€iteks itereerimisel vĂ”i stringiks teisendamisel.
SĂŒmbolite loomine
SĂŒmboli loomiseks kasutatakse konstruktorit Symbol(). On oluline mĂ€rkida, et te ei saa kasutada new Symbol(); sĂŒmbolid ei ole objektid, vaid primitiivsed vÀÀrtused.
SĂŒmboli pĂ”hiline loomine
Lihtsaim viis sĂŒmboli loomiseks on:
const mySymbol = Symbol();
console.log(typeof mySymbol); // VĂ€ljund: symbol
Iga Symbol() vÀljakutse genereerib uue, unikaalse vÀÀrtuse:
const symbol1 = Symbol();
const symbol2 = Symbol();
console.log(symbol1 === symbol2); // VĂ€ljund: false
SĂŒmbolite kirjeldused
SĂŒmboli loomisel saate anda valikulise string-kirjelduse. See kirjeldus on kasulik silumiseks ja logimiseks, kuid see ei mĂ”juta sĂŒmboli unikaalsust.
const mySymbol = Symbol("myDescription");
console.log(mySymbol.toString()); // VĂ€ljund: Symbol(myDescription)
Kirjeldus on puhtalt informatiivne; kaks sama kirjeldusega sĂŒmbolit on siiski unikaalsed:
const symbolA = Symbol("same description");
const symbolB = Symbol("same description");
console.log(symbolA === symbolB); // VĂ€ljund: false
SĂŒmbolite kasutamine omaduste vĂ”tmetena
SĂŒmbolid on eriti kasulikud omaduste vĂ”tmetena, kuna need tagavad unikaalsuse, vĂ€ltides nimekonflikte objektidele omaduste lisamisel.
SĂŒmbol-omaduste lisamine
SĂŒmboleid saab kasutada omaduste vĂ”tmetena tĂ€pselt nagu stringe vĂ”i numbreid:
const mySymbol = Symbol("myKey");
const myObject = {};
myObject[mySymbol] = "Hello, Symbol!";
console.log(myObject[mySymbol]); // VĂ€ljund: Hello, Symbol!
Nimekonfliktide vÀltimine
Kujutage ette, et töötate kolmanda osapoole teegiga, mis lisab objektidele omadusi. VĂ”iksite lisada oma omadusi, riskimata olemasolevate ĂŒlekirjutamisega. SĂŒmbolid pakuvad selleks turvalise viisi:
// Kolmanda osapoole teek (simuleeritud)
const libraryObject = {
name: "Library Object",
version: "1.0"
};
// Teie kood
const mySecretKey = Symbol("mySecret");
libraryObject[mySecretKey] = "Top Secret Information";
console.log(libraryObject.name); // VĂ€ljund: Library Object
console.log(libraryObject[mySecretKey]); // VĂ€ljund: Top Secret Information
Selles nĂ€ites tagab mySecretKey, et teie omadus ei satu konflikti ĂŒhegi olemasoleva omadusega objektis libraryObject.
SĂŒmbol-omaduste loendamine
Ăks sĂŒmbol-omaduste oluline omadus on see, et need on peidetud standardsete loendusmeetodite, nagu for...in tsĂŒklid ja Object.keys(), eest. See aitab kaitsta objektide terviklikkust ja vĂ€ltida sĂŒmbol-omaduste juhuslikku kasutamist vĂ”i muutmist.
const mySymbol = Symbol("myKey");
const myObject = {
name: "My Object",
[mySymbol]: "Symbol Value"
};
console.log(Object.keys(myObject)); // VĂ€ljund: ["name"]
for (let key in myObject) {
console.log(key); // VĂ€ljund: name
}
SĂŒmbol-omadustele juurdepÀÀsemiseks peate kasutama meetodit Object.getOwnPropertySymbols(), mis tagastab massiivi kĂ”igist objekti sĂŒmbol-omadustest:
const mySymbol = Symbol("myKey");
const myObject = {
name: "My Object",
[mySymbol]: "Symbol Value"
};
const symbolKeys = Object.getOwnPropertySymbols(myObject);
console.log(symbolKeys); // VĂ€ljund: [Symbol(myKey)]
console.log(myObject[symbolKeys[0]]); // VĂ€ljund: Symbol Value
Tuntud sĂŒmbolid
JavaScript pakub komplekti sisseehitatud sĂŒmboleid, mida tuntakse tuntud sĂŒmbolitena ja mis esindavad spetsiifilisi kĂ€itumisviise vĂ”i funktsionaalsusi. Need sĂŒmbolid on Symbol konstruktori omadused (nt Symbol.iterator, Symbol.toStringTag). Need vĂ”imaldavad teil kohandada, kuidas objektid erinevates kontekstides kĂ€ituvad.
Symbol.iterator
Symbol.iterator on sĂŒmbol, mis defineerib objekti vaikeiteraatori. Kui objektil on meetod vĂ”tmega Symbol.iterator, muutub see itereeritavaks, mis tĂ€hendab, et saate seda kasutada for...of tsĂŒklite ja laialilaotusoperaatoriga (...).
NĂ€ide: kohandatud itereeritava objekti loomine
const myCollection = {
items: [1, 2, 3, 4, 5],
[Symbol.iterator]: function* () {
for (let item of this.items) {
yield item;
}
}
};
for (let item of myCollection) {
console.log(item); // VĂ€ljund: 1, 2, 3, 4, 5
}
console.log([...myCollection]); // VĂ€ljund: [1, 2, 3, 4, 5]
Selles nÀites on myCollection objekt, mis rakendab iteraatori protokolli, kasutades Symbol.iterator. Generaatorfunktsioon vÀljastab (yield) iga elemendi items massiivist, muutes myCollection objekti itereeritavaks.
Symbol.toStringTag
Symbol.toStringTag on sĂŒmbol, mis vĂ”imaldab teil kohandada objekti string-esitust, kui kutsutakse vĂ€lja Object.prototype.toString().
NĂ€ide: toString() esituse kohandamine
class MyClass {
get [Symbol.toStringTag]() {
return 'MyClassInstance';
}
}
const instance = new MyClass();
console.log(Object.prototype.toString.call(instance)); // VĂ€ljund: [object MyClassInstance]
Ilma Symbol.toStringTag-ita oleks vĂ€ljund [object Object]. See sĂŒmbol pakub viisi oma objektidele kirjeldavama string-esituse andmiseks.
Symbol.hasInstance
Symbol.hasInstance on sĂŒmbol, mis laseb teil kohandada operaatori instanceof kĂ€itumist. Tavaliselt kontrollib instanceof, kas objekti prototĂŒĂŒbiahel sisaldab konstruktori prototype omadust. Symbol.hasInstance vĂ”imaldab seda kĂ€itumist ĂŒle kirjutada.
NĂ€ide: instanceof kontrolli kohandamine
class MyClass {
static [Symbol.hasInstance](instance) {
return Array.isArray(instance);
}
}
console.log([] instanceof MyClass); // VĂ€ljund: true
console.log({} instanceof MyClass); // VĂ€ljund: false
Selles nĂ€ites kontrollib Symbol.hasInstance meetod, kas isend on massiiv. See muudab MyClass-i tegelikult massiivide kontrollijaks, sĂ”ltumata tegelikust prototĂŒĂŒbiahelast.
Muud tuntud sĂŒmbolid
JavaScript defineerib mitmeid teisi tuntud sĂŒmboleid, sealhulgas:
Symbol.toPrimitive: VĂ”imaldab teil kohandada objekti kĂ€itumist, kui see teisendatakse primitiivseks vÀÀrtuseks (nt aritmeetiliste tehete ajal).Symbol.unscopables: MÀÀrab omaduste nimed, mis tulekswith-lausetest vĂ€lja jĂ€tta (with-i kasutamine on ĂŒldiselt ebasoovitatav).Symbol.match,Symbol.replace,Symbol.search,Symbol.split: VĂ”imaldavad teil kohandada, kuidas objektid kĂ€ituvad regulaaravaldise meetoditega naguString.prototype.match(),String.prototype.replace()jne.
Globaalne sĂŒmbolite register
MĂ”nikord on vaja sĂŒmboleid jagada rakenduse erinevate osade vahel vĂ”i isegi erinevate rakenduste vahel. Globaalne sĂŒmbolite register pakub mehhanismi sĂŒmbolite registreerimiseks ja hankimiseks vĂ”tme alusel.
Symbol.for(key)
Meetod Symbol.for(key) kontrollib, kas antud vĂ”tmega sĂŒmbol eksisteerib globaalses registris. Kui see eksisteerib, tagastab see selle sĂŒmboli. Kui seda ei eksisteeri, loob see uue sĂŒmboli antud vĂ”tmega ja registreerib selle registris.
const globalSymbol1 = Symbol.for("myGlobalSymbol");
const globalSymbol2 = Symbol.for("myGlobalSymbol");
console.log(globalSymbol1 === globalSymbol2); // VĂ€ljund: true
console.log(Symbol.keyFor(globalSymbol1)); // VĂ€ljund: myGlobalSymbol
Symbol.keyFor(symbol)
Meetod Symbol.keyFor(symbol) tagastab vĂ”tme, mis on seotud sĂŒmboliga globaalses registris. Kui sĂŒmbolit registris ei ole, tagastab see undefined.
const mySymbol = Symbol("localSymbol");
console.log(Symbol.keyFor(mySymbol)); // VĂ€ljund: undefined
const globalSymbol = Symbol.for("myGlobalSymbol");
console.log(Symbol.keyFor(globalSymbol)); // VĂ€ljund: myGlobalSymbol
Oluline: SĂŒmbolid, mis on loodud Symbol() abil, *ei ole* automaatselt globaalsesse registrisse registreeritud. Ainult sĂŒmbolid, mis on loodud (vĂ”i hangitud) Symbol.for() abil, on registri osa.
Praktilised nÀited ja kasutusjuhud
Siin on mĂ”ned praktilised nĂ€ited, mis demonstreerivad, kuidas sĂŒmboleid saab kasutada reaalsetes stsenaariumides:
1. Plugin-sĂŒsteemide loomine
SĂŒmboleid saab kasutada plugin-sĂŒsteemide loomiseks, kus erinevad moodulid saavad laiendada pĂ”hilise objekti funktsionaalsust, ilma et nad satuksid konflikti ĂŒksteise omadustega.
// PÔhiobjekt
const coreObject = {
name: "Core Object",
version: "1.0"
};
// Plugin 1
const plugin1Key = Symbol("plugin1");
coreObject[plugin1Key] = {
description: "Plugin 1 adds extra functionality",
activate: function() {
console.log("Plugin 1 activated");
}
};
// Plugin 2
const plugin2Key = Symbol("plugin2");
coreObject[plugin2Key] = {
author: "Another Developer",
init: function() {
console.log("Plugin 2 initialized");
}
};
// Pluginitele juurdepÀÀs
console.log(coreObject[plugin1Key].description); // VĂ€ljund: Plugin 1 adds extra functionality
coreObject[plugin2Key].init(); // VĂ€ljund: Plugin 2 initialized
Selles nĂ€ites kasutab iga plugin unikaalset sĂŒmboli vĂ”tit, vĂ€ltides potentsiaalseid nimekonflikte ja tagades, et pluginad saavad rahulikult koos eksisteerida.
2. Metaandmete lisamine DOM-elementidele
SĂŒmboleid saab kasutada metaandmete lisamiseks DOM-elementidele, segamata nende olemasolevaid atribuute vĂ”i omadusi.
const element = document.createElement("div");
const dataKey = Symbol("elementData");
element[dataKey] = {
type: "widget",
config: {},
timestamp: Date.now()
};
// Metaandmetele juurdepÀÀs
console.log(element[dataKey].type); // VĂ€ljund: widget
See lÀhenemine hoiab metaandmed eraldi elemendi standardatribuutidest, parandades hooldatavust ja vÀltides potentsiaalseid konflikte CSS-i vÔi muu JavaScripti koodiga.
3. Privaatsete omaduste implementeerimine
Kuigi JavaScriptil pole tĂ”elisi privaatseid omadusi, saab sĂŒmboleid kasutada privaatsuse simuleerimiseks. Kasutades sĂŒmbolit omaduse vĂ”tmena, saate muuta vĂ€lise koodi jaoks omadusele juurdepÀÀsu raskeks (kuid mitte vĂ”imatuks).
class MyClass {
#privateSymbol = Symbol("privateData"); // MĂ€rkus: See '#' sĂŒntaks on *tĂ”eline* privaatne vĂ€li, mis vĂ”eti kasutusele ES2020-s, ja erineb nĂ€itest
constructor(data) {
this[this.#privateSymbol] = data;
}
getData() {
return this[this.#privateSymbol];
}
}
const myInstance = new MyClass("Sensitive Information");
console.log(myInstance.getData()); // VĂ€ljund: Sensitive Information
// "Privaatsele" omadusele juurdepÀÀs (raske, kuid vÔimalik)
const symbolKeys = Object.getOwnPropertySymbols(myInstance);
console.log(myInstance[symbolKeys[0]]); // VĂ€ljund: Sensitive Information
Kuigi Object.getOwnPropertySymbols() saab sĂŒmboli siiski paljastada, muudab see vĂ€hem tĂ”enĂ€oliseks, et vĂ€line kood pÀÀseb juhuslikult "privaatsele" omadusele ligi vĂ”i muudab seda. MĂ€rkus: TĂ”elised privaatsed vĂ€ljad (kasutades `#` prefiksit) on nĂŒĂŒd saadaval kaasaegses JavaScriptis ja pakuvad tugevamaid privaatsusgarantiisid.
Parimad tavad sĂŒmbolite kasutamisel
Siin on mĂ”ned parimad tavad, mida sĂŒmbolitega töötades meeles pidada:
- Kasutage kirjeldavaid sĂŒmbolite kirjeldusi: MĂ”testatud kirjelduste pakkumine muudab silumise ja logimise lihtsamaks.
- Kaaluge globaalse sĂŒmbolite registri kasutamist: Kasutage
Symbol.for(), kui peate sĂŒmboleid jagama erinevate moodulite vĂ”i rakenduste vahel. - Olge teadlik loendamisest: Pidage meeles, et sĂŒmbol-omadused ei ole vaikimisi loendatavad ja kasutage nendele juurdepÀÀsuks
Object.getOwnPropertySymbols(). - Kasutage sĂŒmboleid metaandmete jaoks: Kasutage sĂŒmboleid metaandmete lisamiseks objektidele, segamata nende olemasolevaid omadusi.
- Kaaluge tÔelisi privaatseid vÀlju, kui on vaja tugevat privaatsust: Kui vajate tÔelist privaatsust, kasutage klassi privaatsete vÀljade jaoks `#` prefiksit (saadaval kaasaegses JavaScriptis).
KokkuvÔte
JavaScripti sĂŒmbolid pakuvad vĂ”imsat mehhanismi unikaalsete omaduste vĂ”tmete loomiseks, metaandmete lisamiseks objektidele ja objektide kĂ€itumise kohandamiseks. MĂ”istes, kuidas sĂŒmbolid töötavad ja jĂ€rgides parimaid tavasid, saate kirjutada robustsemat, hooldatavamat ja konfliktivaba JavaScripti koodi. Olgu tegemist plugin-sĂŒsteemide ehitamise, metaandmete lisamisega DOM-elementidele vĂ”i privaatsete omaduste simuleerimisega, sĂŒmbolid on vÀÀrtuslik tööriist teie JavaScripti arendustöövoo tĂ€iustamiseks.