JS Tutoriaal

JS TUIS JS Inleiding JS Waarheen JS Uitset JS Verklarings JS sintaksis JS Kommentaar JS veranderlikes JS Laat JS Konst JS-operateurs JS Rekenkunde JS Opdrag JS datatipes JS Funksies JS Voorwerpe JS Events JS Strings JS String Metodes JS String Soek JS String Templates JS nommers JS-nommermetodes JS Skikkings JS Skikking Metodes JS Array Sorteer JS Skikking Iterasie JS Array Konst JS Datums JS Datum Formate JS Datum Kry Metodes JS Datum Stel Metodes JS Wiskunde JS Random JS Booleans JS Vergelykings JS Voorwaardes JS Skakelaar JS Loop Vir JS Loop For In JS Loop Vir Van JS Loop Terwyl JS Break JS Iterables JS-stelle JS Kaarte JS tipe JS Tipe Omskakeling JS Bitwise JS RegExp JS foute JS Bestek JS Hysing JS Streng modus JS hierdie sleutelwoord JS Arrow Funksie JS Klasse JS JSON JS Ontfouting JS Stylgids JS Beste Praktyke JS foute JS prestasie JS Voorbehou Woorde

JS weergawes

JS weergawes JS 2009 (ES5) JS 2015 (ES6) JS 2016 JS 2017 JS 2018 JS IE / Edge JS Geskiedenis

JS Voorwerpe

Voorwerpdefinisies Voorwerp Eienskappe Voorwerp Metodes Voorwerp vertoon Voorwerptoebehore Voorwerpkonstrukteurs Voorwerpprototipes Object Iterables Voorwerpstelle Voorwerpkaarte Voorwerpverwysing

JS Funksies

Funksie definisies Funksie parameters Funksie Aanroep Funksie oproep Funksie Pas toe Funksie sluitings

JS Klasse

Klasintro Klas Erfenis Klas Staties

JS Async

JS Terugbelle JS Asynchroon JS Beloftes JS Async/Wag

JS HTML DOM

DOM Inleiding DOM Metodes DOM-dokument DOM Elemente DOM HTML DOM-vorms DOM CSS DOM-animasies DOM-geleenthede DOM Gebeurtenis Luisteraar DOM-navigasie DOM nodusse DOM Versamelings DOM Node lyste

JS Browser BOM

JS venster JS skerm JS ligging JS Geskiedenis JS Navigator JS Popup Alert JS Tydsberekening JS koekies

JS Web API's

Web API Inleiding Webvorms API Webgeskiedenis API Webberging API Webwerker API Web haal API Web Geolocation API

JS AJAX

AJAX Intro AJAX XMLHttp AJAX-versoek AJAX-reaksie AJAX XML-lêer AJAX PHP AJAX ASP AJAX-databasis AJAX toepassings AJAX voorbeelde

JS JSON

JSON Inleiding JSON-sintaksis JSON vs XML JSON-datatipes JSON Ontleed JSON Stringify JSON-voorwerpe JSON-skikkings JSON-bediener JSON PHP JSON HTML JSON JSONP

JS vs jQuery

jQuery keurders jQuery HTML jQuery CSS jQuery DOM

JS grafika

JS grafika JS Canvas JS Plot JS Chart.js JS Google Chart JS D3.js

JS Voorbeelde

JS Voorbeelde JS HTML DOM JS HTML-invoer JS HTML-voorwerpe JS HTML-geleenthede JS Blaaier JS Redakteur JS Oefeninge JS Vasvra JS Sertifikaat

JS Verwysings

JavaScript-voorwerpe HTML DOM-voorwerpe


JavaScript-skikkingsmetodes


Die omskakeling van skikkings na snare

Die JavaScript-metode toString()skakel 'n skikking om na 'n string (kommageskeide) skikkingwaardes.

Voorbeeld

const fruits = ["Banana", "Orange", "Apple", "Mango"];
document.getElementById("demo").innerHTML = fruits.toString();

Resultaat:

Banana,Orange,Apple,Mango

Die join()metode verbind ook alle skikkingselemente in 'n string.

Dit tree net soos toString(), maar jy kan ook die skeier spesifiseer:

Voorbeeld

const fruits = ["Banana", "Orange", "Apple", "Mango"];
document.getElementById("demo").innerHTML = fruits.join(" * ");

Resultaat:

Banana * Orange * Apple * Mango

Knal en druk

Wanneer jy met skikkings werk, is dit maklik om elemente te verwyder en nuwe elemente by te voeg.

Dit is wat knal en druk is:

Druk items uit 'n skikking, of druk items in 'n skikking.



JavaScript Array pop()

Die pop()metode verwyder die laaste element uit 'n skikking:

Voorbeeld

const fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.pop();

Die pop()metode gee die waarde terug wat "uitgespring" is:

Voorbeeld

const fruits = ["Banana", "Orange", "Apple", "Mango"];
let fruit = fruits.pop();

JavaScript Array push()

Die push()metode voeg 'n nuwe element by 'n skikking (aan die einde):

Voorbeeld

const fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.push("Kiwi");

Die push()metode gee die nuwe skikkingslengte terug:

Voorbeeld

const fruits = ["Banana", "Orange", "Apple", "Mango"];
let length = fruits.push("Kiwi");

Verskuiwende elemente

Verskuiwing is gelykstaande aan knal, maar werk aan die eerste element in plaas van die laaste.


JavaScript Array shift()

Die shift()metode verwyder die eerste skikkingselement en "skuif" alle ander elemente na 'n laer indeks.

Voorbeeld

const fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.shift();

Die shift()metode gee die waarde terug wat "uitgeskuif" is:

Voorbeeld

const fruits = ["Banana", "Orange", "Apple", "Mango"];
let fruit = fruits.shift();

JavaScript Array unshift()

Die unshift()metode voeg 'n nuwe element by 'n skikking (aan die begin), en "verskuif" ouer elemente:

Voorbeeld

const fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.unshift("Lemon");

Die unshift()metode gee die nuwe skikkingslengte terug.

Voorbeeld

const fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.unshift("Lemon");

Veranderende elemente

Toegang tot skikkingselemente word verkry deur hul indeksnommer te gebruik :

Skikkingsindekse begin met 0:

[0] is die eerste skikkingselement
[1] is die tweede
[2] is die derde ...

Voorbeeld

const fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits[0] = "Kiwi";

JavaScript Skikking lengte

Die lengtheiendom bied 'n maklike manier om 'n nuwe element by 'n skikking te voeg:

Voorbeeld

const fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits[fruits.length] = "Kiwi";

JavaScript Array delete()

Waarskuwing!

Skikkingselemente kan met die JavaScript-operateur uitgevee word delete.

Gebruik deleteblare undefinedgate in die skikking.

Gebruik eerder pop() of shift().

Voorbeeld

const fruits = ["Banana", "Orange", "Apple", "Mango"];
delete fruits[0];

Samevoeging (samevoeging) skikkings

Die concat()metode skep 'n nuwe skikking deur bestaande skikkings saam te voeg (aaneenskakel):

Voorbeeld (samevoeging van twee skikkings)

const myGirls = ["Cecilie", "Lone"];
const myBoys = ["Emil", "Tobias", "Linus"];

const myChildren = myGirls.concat(myBoys);

Die concat()metode verander nie die bestaande skikkings nie. Dit gee altyd 'n nuwe skikking terug.

Die concat()metode kan enige aantal skikkingsargumente neem:

Voorbeeld (samevoeging van drie skikkings)

const arr1 = ["Cecilie", "Lone"];
const arr2 = ["Emil", "Tobias", "Linus"];
const arr3 = ["Robin", "Morgan"];
const myChildren = arr1.concat(arr2, arr3);

Die concat()metode kan ook snare as argumente neem:

Voorbeeld (samevoeging van 'n skikking met waardes)

const arr1 = ["Emil", "Tobias", "Linus"];
const myChildren = arr1.concat("Peter"); 

Splyting en sny skikkings

Die splice()metode voeg nuwe items by 'n skikking.

Die slice()metode sny 'n stuk van 'n skikking uit.


JavaScript Array splice()

Die splice()metode kan gebruik word om nuwe items by 'n skikking te voeg:

Voorbeeld

const fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.splice(2, 0, "Lemon", "Kiwi");

Die eerste parameter (2) definieer die posisie waar nuwe elemente bygevoeg moet word (ingevoeg).

Die tweede parameter (0) definieer hoeveel elemente verwyder moet word .

Die res van die parameters ("Suurlemoen", "Kiwi") definieer die nuwe elemente wat bygevoeg moet word .

Die splice()metode gee 'n skikking met die geskrap items:

Voorbeeld

const fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.splice(2, 2, "Lemon", "Kiwi");

Gebruik splice() om elemente te verwyder

Met slim parameterinstelling kan jy gebruik splice()om elemente te verwyder sonder om "gate" in die skikking te laat:

Voorbeeld

const fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.splice(0, 1);

Die eerste parameter (0) definieer die posisie waar nuwe elemente bygevoeg moet word (ingevoeg).

Die tweede parameter (1) definieer hoeveel elemente verwyder moet word .

Die res van die parameters word weggelaat. Geen nuwe elemente sal bygevoeg word nie.


JavaScript Skikking sny()

Die slice()metode sny 'n stuk van 'n skikking uit in 'n nuwe skikking.

Hierdie voorbeeld sny 'n deel van 'n skikking uit vanaf skikkingselement 1 ("Oranje"):

Voorbeeld

const fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
const citrus = fruits.slice(1);

Let wel

Die slice()metode skep 'n nuwe skikking.

Die slice()metode verwyder geen elemente uit die bronskikking nie.

Hierdie voorbeeld sny 'n deel van 'n skikking uit vanaf skikkingselement 3 ("Apple"):

Voorbeeld

const fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
const citrus = fruits.slice(3);

Die slice()metode kan twee argumente soos slice(1, 3).

Die metode kies dan elemente vanaf die beginargument, en tot (maar nie ingesluit nie) die eindargument.

Voorbeeld

const fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
const citrus = fruits.slice(1, 3);

As die eindargument weggelaat word, soos in die eerste voorbeelde, slice() sny die metode die res van die skikking uit.

Voorbeeld

const fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
const citrus = fruits.slice(2);

Outomatiese toString()

JavaScript skakel outomaties 'n skikking om na 'n kommageskeide string wanneer 'n primitiewe waarde verwag word.

Dit is altyd die geval wanneer jy probeer om 'n skikking uit te voer.

Hierdie twee voorbeelde sal dieselfde resultaat lewer:

Voorbeeld

const fruits = ["Banana", "Orange", "Apple", "Mango"];
document.getElementById("demo").innerHTML = fruits.toString();

Voorbeeld

const fruits = ["Banana", "Orange", "Apple", "Mango"];
document.getElementById("demo").innerHTML = fruits;

Let wel

Alle JavaScript-objekte het 'n toString()-metode.


Vind maksimum en minimum waardes in 'n skikking

Daar is geen ingeboude funksies om die hoogste of laagste waarde in 'n JavaScript-skikking te vind nie.

Jy sal leer hoe jy hierdie probleem oplos in die volgende hoofstuk van hierdie tutoriaal.


Sorteer skikkings

Sorteer skikkings word in die volgende hoofstuk van hierdie tutoriaal behandel.

Voltooi Skikkingsverwysing

For a complete Array reference, go to our:

Complete JavaScript Array Reference.

The reference contains descriptions and examples of all Array properties and methods.

Test Yourself With Exercises

Exercise:

Use the correct Array method to remove the last item of the fruits array.

const fruits = ["Banana", "Orange", "Apple"];
;