Úvod
Při práci s jakýmkoli programovacím jazykem budete pravděpodobně potřebovat nějakou funkcionalitu, která není do tohoto jazyka nativně integrována. Buď je tedy implementujete sami, nebo se obrátíte na použití různých modulů či knihoven.
To přímo ovlivňuje efektivitu vaší aplikace (vyšší využití paměti, více požadavků HTTP atd.). Aby tomu zabránili, vývojáři pracující na vyspělých programovacích jazycích integrovali funkce do jazyků, aby nemuseli používat externí knihovny pro běžné úkoly.
Seznámení s těmito vestavěnými funkcemi je považováno za základní znalost jazyka a stále se můžete dostat docela daleko pouze s vestavěnými funkcemi. Samozřejmě budete s největší pravděpodobností nakonec používat některé moduly/knihovny pro určité úkoly.
Datové typy, struktury a objekty JavaScriptu s vestavěnými funkcemi
V JavaScriptu existuje osm datových typů :
- Řetězec
- Číslo
- Booleovská hodnota
- Null
- Nedefinováno
- Symbol
- BigInt
- Objekt
Ne každý datový typ má však vestavěnou funkci. Jsou definovány pouze pro:String, Number a Boolean .
Pokud jde o Datové struktury v JavaScriptu, sedm nejpoužívanějších struktur jsou:
- Pole
- Zásobník
- Fronta
- Propojený seznam
- Strom
- Graf
- Hashtable
Podobně jako u datových typů jsou v datových strukturách vestavěné funkce definovány pouze na Poli . Nakonec Objekty v JavaScriptu mají také vestavěné funkce, jako je Date, RegExp a Math .
V této příručce se zaměříme konkrétně na řetězce.
Vestavěné funkce řetězců v JavaScriptu
řetězec je, jak již bylo zmíněno, jedním z osmi datových typů v JavaScriptu. Je to v podstatě jako pole (řetězec) znaků .
Kromě toho stojí za zmínku, že řetězce jsou neměnné - jakmile je objekt typu string vytvořen, nelze jej změnit. Jakákoli funkce pro změnu řetězce vytvoří nový objekt řetězce a vraťte jej namísto úpravy původního.
Vzhledem k tomu, že řetězce jsou pouze pole – můžete s nimi zacházet jako s poli a získávat prvky pomocí array[index] notace.
Jak již bylo řečeno, začněme s vestavěnými funkcemi týkajícími se řetězců.
toString()
toString() je jednou z nejčastěji používaných funkcí týkajících se řetězců. Patří všem Object s a vrátí řetězcovou reprezentaci objektu, čímž efektivně převede objekt jakéhokoli typu na jeho řetězcovou reprezentaci:
let x = 100;
console.log(x.toString()); // Output: 100
toString() se bude s každým objektem chovat jinak v závislosti na jeho implementaci funkce - co to znamená reprezentovat tento objekt jako řetězec. Dále mějte na paměti, že pokud změníte jakýkoli prvek v aritmetické operaci na řetězec – JavaScript to vyvodí jako pokus o zřetězení :
let x = 100;
let y = 200;
let z1 = x+y;
let z2 = x.toString() + y;
console.log(z1); // Output: 300
console.log(z2); // Output: 100200
Zde z1 je typu Číslo protože přidáváme do proměnných typu Číslo společně a z2 je typu String protože první proměnná je typu String a y se interně transformuje na String a připojeno k x . Pokud chcete převést aritmetický výsledek na řetězec – nezapomeňte převod provést nakonec .
concat()
concat() přidá dva řetězce dohromady a vrátí nový řetězec:
let x = "some ";
let y = "string";
console.log(x.concat(y)); // Output: some string
V podstatě provádí stejnou operaci jako:
let x = "some";
let y = "string";
console.log(x+y); // Output: some string
Ve skutečnosti se doporučuje upřednostňovat concat() funkce místo operandů , kvůli výkonnostním výhodám. Zřetězením jediné struny však mnoho nezískáte – získáte na výkonu pro velké množství strun. Pojďme to rychle otestovat:
console.time('Concatenating with Operator');
concatWithOperator();
console.timeEnd('Concatenating with Operator');
console.time('Concatenating with Function');
concatWithFunction();
console.timeEnd('Concatenating with Function');
function concatWithOperator() {
let result = "";
for (let i = 0; i < 10000; i++) {
result = result += i;
}
}
function concatWithFunction() {
let result = "";
for (let i = 0; i < 10000; i++) {
result = result.concat(i);
}
}
Výsledkem je:
Concatenating with Operator: 3.232ms
Concatenating with Function: 1.509ms
Funkce je v tomto kódu asi dvakrát rychlejší. Za zmínku také stojí oficiální prohlášení MDN týkající se výkonnostních výhod:
Což se může zdát divné, vzhledem k faktu, že concat() překonává operátory v testech. Co dává? Srovnávat kód, jako je tento, není tak snadné, jako ho jednoduše spustit a sledovat výsledky.
Váš prohlížeč, jeho verze a také optimalizátor, který používá, se mohou lišit počítač od stroje a podobné vlastnosti skutečně ovlivňují výkon. Použili jsme například různé řetězce ve zřetězení, ty generované z iterace. Pokud bychom použili stejný řetězec, optimalizátor, jako je V8 od Googlu, by dále optimalizoval použití řetězce.
toLocaleUpperCase() a toUpperCase()
toLocaleUpperCase() převede daný řetězec na velká písmena, přičemž se řídí národním prostředím použitým na počítači kompilujícím kód. Kromě toho můžete zadat národní prostředí pomocí argumentu řetězce:
let word = "Straße";
console.log(word.toUpperCase()) // STRASSE
console.log(word.toLocaleUpperCase('de-DE')) // STRASSE
toLocaleLowerCase() a toLowerCase()
toLocaleLowerCase() funguje téměř stejně jako toLocaleUpperCase() , ale převede řetězec na malá písmena. Podobně toLowerCase() je lokálně agnostický. Mějte však na paměti, že určité informace se ztratí při převodu mezi velkými a malými písmeny.
Pokud například převedeme 'Straße' na velká a potom zpět na malá, ztratíte určité informace:
let word = "Straße";
upperCase = word.toLocaleUpperCase('de-DE')
console.log(upperCase) // STRASSE
console.log(upperCase.toLocaleLowerCase('de-DE')) // Strasse
Opět je to proto, že v tomto případě se němčina řídí standardním mapováním Unicode, takže toLocaleLowerCase() vytváří stejný výsledek jako toLowerCase() - která pouze změní každý znak na jeho protějšek s malými písmeny.
substring()
substring(start, end) vrátí řetězec obsahující znaky začínající od start index původního řetězce až do end-1 index původního řetězce.
let x = "this is some string";
console.log(x.substring(3, 7)); // Output: s is
Jak můžete vidět, end index nezahrnuje, takže výstupní řetězec je z start na end-1 .
Navíc to samozřejmě vrátí nový řetězec, takže jej můžete buď zachytit přiřazením k nové referenční proměnné, nebo jej použít jako vstup pro novou funkci. Původní řetězec zůstane nezměněn:
let x = "this is some string";
let y = x.substring(3, 7);
console.log(x); // Output: this is some string
console.log(y); // Output: s is
Pokud se pokusíte substring() s end za length řetězce - jednoduše podřetězec všechny existující znaky až do konce:
let x = "this is some string";
console.log(x.substring(10, 25)); // Output: me string
substr(počátek, délka)
Podobné jako substring() , substr() Funkce je generována převzetím určitých znaků z původního řetězce. Zde specifikujeme start index a velikost požadovaného podřetězce, což je length , namísto konkrétního koncového bodu:
Zdarma e-kniha:Git Essentials
Prohlédněte si našeho praktického průvodce učením Git s osvědčenými postupy, průmyslově uznávanými standardy a přiloženým cheat sheetem. Přestaňte používat příkazy Google Git a skutečně se naučte to!
let x = "this is some string";
console.log(x.substr(3, 4)); // Output: s is
Pokud délka přesahuje rozsah řetězce, jednoduše podřetězec až do konce:
let x = "hello";
console.log(x.substr(3, 10)); // Output: lo
split()
split(separator, limit) funkce rozdělí řetězec na pole řetězců pomocí separator poskytnuté a do limit počet dílů.
let x = "this is some string";
console.log(x.split(" ", 4)); // Output: ['this', 'is', 'some', 'string']
To může být užitečné pro analýzu řádků CSV, pokud nepoužíváte žádné externí knihovny, protože se jedná o hodnoty oddělené čárkami, které lze snadno rozdělit pomocí split() funkce. Při práci se soubory CSV však budete chtít provést ověření, pokud nejsou správně naformátovány.
Obvykle k tomu budete používat knihovny, protože ty věci mnohem usnadňují.
charAt() a řetězec[index]
charAt(index) funkce vrací znak na zadaném index .
let x = "abc123";
console.log(x.charAt(2)); // Output: c
Můžete to použít k iteraci řetězce a načtení jeho obsahu, například:
let x = "some string";
for (let i = 0; i < x.length; i++) {
console.log(x.charAt(i));
}
Výsledkem je:
s
o
m
e
s
t
r
i
n
g
Existuje několik důvodů, proč byste mohli preferovat charAt() přes zápis pole:
let x = "some string";
// There is no element 5.7
console.log(x[5.7]);
// 5.7 gets rounded down to 5
console.log(x.charAt(5.7));
// The array notation makes it appear as if we can just assign
// new values to elements, even though strings are immutable
x[5] = 'g';
console.log(x);
// With charAt(), it's much more obvious that
// this line doesn't make sense and will throw an exception
x.charAt(5) = 'g';
V implementaci charAt() se však skrývá dvousečná zbraň funkce - vyhodnotí daný index a zpracuje jej.
Proto 5.7 byla zaokrouhlena dolů na 5 . Tento krok zpracování provede také pro vstupy, které ve skutečnosti nemusí být platné, ale vytvoří iluzi kódu, který běží dobře:
let x = "some string";
console.log(x.charAt(true));
console.log(x.charAt(NaN));
console.log(x.charAt(undefined));
console.log(x.charAt([]))
console.log(x.charAt(""))
true se převede na 1 , zatímco false bude převedeno na 0 . NaN , undefined , prázdné pole a prázdný řetězec jsou také převedeny na 0 , takže to běží v pohodě, i když by to intuitivně nemělo:
o
s
s
s
s
Na druhou stranu pomocí modernějšího zápisu pole:
console.log(x[true]);
console.log(x[NaN]);
console.log(x[undefined]);
console.log(x[[]]);
console.log(x[""]);
Ty poskytují intuitivnější výsledek, označující selhání vstupu:
undefined
undefined
undefined
undefined
undefined
indexOf()
indexOf(character) vrátí hodnotu indexu prvního výskytu ze zadaných character :
let x = "aaabbb";
console.log(x.indexOf("b")); // Output: 3
Pokud znak neexistuje, -1 je vráceno:
let x = "some string";
console.log(x.indexOf('h')); // Output: -1
Volitelně můžete také přeskočit první n znaků zadáním fromIndex jako druhý argument:
let x = "aaabbb";
console.log(x.indexOf("b", 4)); // Output: 4
Zde přeskočíme první 3 znaky (indexování založené na 0) a začneme počítat od čtvrtého. Mimochodem, 4. znak je 'b' hledáme, takže se vrátí index.
lastIndexOf()
lastIndexOf(character) vrátí hodnotu indexu posledního výskytu ze zadaných character :
let x = "aaabbb";
conosle.log(x.lastIndexOf("b")); // Output: 5
Platí v podstatě stejná pravidla jako pro indexOf() funkce:
let x = "aaabbb";
console.log(x.lastIndexOf("b")); // Output: 5
console.log(x.lastIndexOf("b", 3)); // Output: 3
console.log(x.lastIndexOf("g")); // Output: -1
Metoda počítá zpětně od konce řetězce, ale pokud dodáme fromIndex Zde se index počítá zleva. V našem případě:
// 012345
let x = "aaabbb";
// ↑ lastIndexOf() start
A lastIndexOf() počítá od 3 na 0 , protože jsme nastavili fromIndex být 3 .
search()
search(string) funkce hledá string a pokud je nalezen, vrátí index začátku nalezeného řetězce:
let x = "JavaScript, often abbreviated as JS, is a programming language that conforms to the ECMAScript specification. JavaScript is high-level, often just-in-time compiled, and multi-paradigm.";
console.log(x.search("programming")); // Output: 42
V případě, že vyhledávacímu klíčovému slovu vyhovuje více řetězců, například 'JavaScript' , vrátí se pouze počáteční index prvního shodného případu:
let x = "JavaScript, often abbreviated as JS, is a programming language that conforms to the ECMAScript specification. JavaScript is high-level, often just-in-time compiled, and multi-paradigm.";
console.log(x.search("JavaScript")); // Output: 0
Závěr
JavaScript je široce rozšířený jazyk, převládající na webu, a seznámení se se základními vestavěnými funkcemi vám pomůže vyhnout se používání zbytečných externích knihoven, když můžete dosáhnout výsledku ve formě vanilla JS.
V této příručce jsme se podívali na vestavěné funkce řetězců – jednoho z nejběžnějších datových typů dostupných v JavaScriptu.