Ingebouwde Functies in TypeScript

Dit artikel legt ingebouwde functies in TypeScript uit.

YouTube Video

Ingebouwde Functies in TypeScript

Ingebouwde functies in TypeScript zijn handige functies die worden aangeboden om dagelijkse bewerkingen beknopt uit te voeren. Dit zijn standaard JavaScript-functies met toegevoegde typesafe, waardoor ze bijzonder nuttig zijn bij het coderen in TypeScript. Hier leggen we in detail enkele belangrijke ingebouwde functies, hun gebruik en typespecificatie uit.

Wat zijn Ingebouwde Functies?

De ingebouwde functies van TypeScript zijn gebaseerd op standaard JavaScript-functies. Het toepassen van het typesysteem van TypeScript verbetert typecontrole en autocomplete. De belangrijkste functies omvatten het volgende:.

• parseInt()
• parseFloat()
• isNaN()
• isFinite()
• Number()
• String()
• Array()
• Array.isArray()
• eval()
• encodeURI()
• decodeURI()
• setTimeout()
• setInterval()

Deze functies worden veel gebruikt in TypeScript-projecten voor beknopte gegevensconversie en evaluatie.

parseInt()

parseInt() is een functie die wordt gebruikt om een string naar een gehele getal te converteren. Je kunt de grondtal (zoals binair, decimaal) als tweede argument opgeven. In TypeScript kun je het type als volgt specificeren:.

 1function stringToInt(value: string, radix: number = 10): number {
 2    const result: number = parseInt(value, radix);
 3    if (isNaN(result)) {
 4        throw new Error('Invalid number format');
 5    }
 6    return result;
 7}
 8
 9console.log(stringToInt("42")); // 42
10console.log(stringToInt("101010", 2)); // 42 (converted from binary)

• Geef aan dat de invoer een string is met value: string
• De geretourneerde waarde wordt expliciet gespecificeerd als een number type.

parseFloat()

parseFloat() is een functie die wordt gebruikt om een string naar een drijvend-komma getal te converteren.

 1function stringToFloat(value: string): number {
 2    const result: number = parseFloat(value);
 3    if (isNaN(result)) {
 4        throw new Error('Invalid number format');
 5    }
 6    return result;
 7}
 8
 9console.log(stringToFloat("3.14")); // 3.14
10console.log(stringToFloat("2.71828")); // 2.71828

• parseFloat() kan getallen met decimalen correct parseren.
• Door het type te specificeren kun je een waarschuwing ontvangen tijdens typecontrole als de invoer geen getal is.

isNaN()

isNaN() is een functie die bepaalt of de opgegeven waarde NaN (Not-a-Number) is. Een voorbeeld van het gebruik in TypeScript is als volgt:.

1function checkNaN(value: unknown): boolean {
2    return isNaN(Number(value));
3}
4
5console.log(checkNaN("hello")); // true
6console.log(checkNaN(123)); // false

• Het unknown type is een generiek type dat elk type kan accepteren.
• Converteer naar een getal met behulp van de Number() functie, en controleer of het resultaat NaN is.

isFinite()

isFinite() bepaalt of een waarde eindig is.

1function isValueFinite(value: unknown): boolean {
2    return isFinite(Number(value));
3}
4
5console.log(isValueFinite("100")); // true
6console.log(isValueFinite(Infinity)); // false

• Deze functie gebruikt ook Number() om de waarde naar een getal te converteren voordat het bepaalt.

Number()

De Number() functie converteert strings of booleaanse waarden naar getallen.

1function convertToNumber(value: string | boolean): number {
2    return Number(value);
3}
4
5console.log(convertToNumber("42")); // 42
6console.log(convertToNumber(true)); // 1

• In dit voorbeeld wordt een union-type string | boolean gebruikt om aan te geven dat het argument ofwel een string of een boolean is.

String()

De functie String() converteert nummers of booleaanse waarden naar strings.

1function convertToString(value: number | boolean): string {
2    return String(value);
3}
4
5console.log(convertToString(123)); // "123"
6console.log(convertToString(false)); // "false"

• In dit voorbeeld wordt een functie gemaakt die een union van het type number | boolean accepteert en het resultaat omzet naar een string.

Array()

De functie Array() wordt gebruikt om een nieuwe array te maken. Daarnaast biedt het veel nuttige methoden om subarrays te maken van bestaande arrays of specifieke elementen te extraheren.

 1function createArray(): Array<number> {
 2    return Array(1, 2, 3, 4, 5); // 新しい配列を作成
 3}
 4
 5function getSubArray(array: Array<number>): Array<number> {
 6    return array.slice(1, 4); // サブ配列を作成
 7}
 8
 9const numbers = createArray();
10console.log(numbers); // [1, 2, 3, 4, 5]
11
12const subArray = getSubArray(numbers);
13console.log(subArray); // [2, 3, 4]

• In dit voorbeeld wordt getoond hoe je een nieuwe array maakt met behulp van de functie Array() en een subarray maakt met behulp van de methode slice().

Array.isArray()

Array.isArray() bepaalt of de opgegeven waarde een array is.

1function checkArray(value: unknown): boolean {
2    return Array.isArray(value);
3}
4
5console.log(checkArray([1, 2, 3])); // true
6console.log(checkArray("Not an array")); // false

• Met het gebruik van het unknown-type accepteren we elk type terwijl we controleren of het een array is.

eval()

De functie eval() evalueert een string als een expressie en retourneert het resultaat. Het wordt echter afgeraden om het te gebruiken vanwege beveiligings- en prestatierisico's.

1function evaluateExpression(expression: string): any {
2    return eval(expression);
3}
4
5console.log(evaluateExpression("2 + 3")); // 5
6console.log(evaluateExpression("'Hello ' + 'World!'")); // "Hello World!"

• In dit voorbeeld wordt een expressie die als string is opgegeven geëvalueerd met eval, en het resultaat wordt weergegeven.

encodeURI()

De functie encodeURI() codeert de hele URL en ontsnapt aan bepaalde tekens.

1const uri = "https://example.com/page?name=John Doe&age=30";
2const encodedURI = encodeURI(uri);
3
4console.log(encodedURI); // "https://example.com/page?name=John%20Doe&age=30"

• In dit voorbeeld worden spaties gecodeerd in %20 om een veilige URL te genereren.

decodeURI()

De functie decodeURI() decodeert een gecodeerde URL terug naar het oorspronkelijke formaat.

1const encodedURI = "https://example.com/page?name=John%20Doe&age=30";
2const decodedURI = decodeURI(encodedURI);
3
4console.log(decodedURI); // "https://example.com/page?name=John Doe&age=30"

• In dit voorbeeld wordt een gecodeerde URL-string teruggedecodeerd naar de oorspronkelijke URL.

setTimeout()

De functie setTimeout() voert een specifieke functie uit na de opgegeven wachttijd (in milliseconden).

1setTimeout(() => {
2    console.log("Executed after 2 seconds");
3}, 2000);

• In dit voorbeeld wordt een bericht weergegeven na 2 seconden.

setInterval()

De functie setInterval() voert herhaaldelijk een specifieke functie uit met het opgegeven interval (in milliseconden).

1let count = 0;
2const intervalId = setInterval(() => {
3    count++;
4    console.log(`Interval executed ${count} time(s)`);
5    if (count === 3) {
6        clearInterval(intervalId); // Stops the interval after 3 executions
7    }
8}, 1000);

• Dit voorbeeld toont een bericht met intervallen van één seconde en stopt na drie keer uitgevoerd te zijn.

Conclusie

De ingebouwde functies van TypeScript zorgen voor veiliger en efficiënter coderen door typeveiligheid toe te voegen aan standaard JavaScript-functies. Deze functies vereenvoudigen dagelijkse programmeertaken en verbeteren de leesbaarheid en onderhoudbaarheid van de code. Elke functie wordt correct gebruikt volgens zijn doel, en door types te specificeren kunnen fouten van tevoren worden opgespoord, wat een belangrijke rol speelt bij het verbeteren van de betrouwbaarheid van het ontwikkelproces.

Door TypeScript te gebruiken, kan men profiteren van statische types terwijl men gebruik maakt van de flexibiliteit van JavaScript.

Je kunt het bovenstaande artikel volgen met Visual Studio Code op ons YouTube-kanaal. Bekijk ook het YouTube-kanaal.

YouTube Video