JavaScript splice() πότε να τη χρησιμοποιείς και τι να προσέξεις!

  • Time to read less than 1 minute
javascript-image

Γεια και πάλι! Σε αυτό το άρθρο θα ήθελα να πω λίγα πράγματα για JavaScript και συγκεκριμένα για τη μέθοδο splice(). Θέλω να σου πω πότε να τη χρησιμοποιείς και τι να προσέξεις.

Η μέθοδος splice() χρησιμοποιείται για να αφαιρέσουμε (δηλαδή να πάρουμε ένα μέρος των στοιχείων ενός πίνακα), ή για να προσθέσουμε ή για να αντικαταστήσουμε στοιχεία σε έναν πίνακα και συντάσσεται έτσι:

array.splice(start[, deleteCount[, item1[, item2[, ...]]]])

Ας μεταφράσω τα κινέζικα! Καταρχάς την καλείς πάνω σε έναν πίνακα.

  • Το start πρέπει να είναι αριθμός και του λες από ποιο index του πίνακα να ξεκινήσει να κάνει αυτό που θέλεις. Η αρίθμηση ξεκινάει από το 0. Αν δώσεις αρνητικό αριθμό θα ξεκινήσει από το τέλος του πίνακα αντί για την αρχή.
  • Το deleteCount δεν είναι υποχρεωτικό, αλλά αν του το δώσεις, του λες πόσα στοιχεία να αφαιρέσει από τον πίνακα ξεκινώντας από την αρχή  (εκτός αν του πεις κάτι διαφορετικό). Αν του δώσεις 0 ή αρνητικό αριθμό, δεν αφαιρεί κανένα στοιχείο.
  •  Τα Item1, item2… αφορούν σε στοιχεία τα οποία θέλεις να προσθέσεις στον  πίνακα που δημιουργείς, ξεκινώντας από την αρχή του πίνακα. Δεν είναι υποχρεωτικά αφού μπορεί να θέλεις μόνο να αφαιρέσεις και όχι να προσθέσεις στοιχεία στον πίνακα.

Η splice() επιστρέφει έναν πίνακα με τα στοιχεία που ζήτησες να αφαιρεθούν ή να προστεθούν ή να αντικατασταθούν και είναι πολύ σημαντικό να προσέξεις ότι τροποποιεί τον αρχικό σου πίνακα! Δηλαδή οι αλλαγές που ζητάς θα γίνουν πάνω στον πίνακα που της δίνεις.

Σε περίπτωση που δε θέλεις να τροποποιηθεί ο αρχικός σου πίνακας, θα πρέπει να χρησιμοποιήσεις τη μέθοδο slice() η οποία σου επιστρέφει ένα νέο πίνακα με τα στοιχεία που επέλεξες, χωρίς να τροποποιεί τον αρχικό πίνακα.

Να θυμάσαι ότι η splice() μπορεί να πάρει n πλήθος ορισμάτων, ενώ η slice() παίρνει 2, δηλαδή από ποιο index θέλεις να επιλέξεις στοιχεία μέχρι ποιο. Αν δεν δώσεις κανένα όρισμα στη slice() τότε σου αντιγράφει τον αρχικό σου πίνακα σε νέο.

Δες μερικά παραδείγματα για να καταλάβεις καλύτερα πως λειτουργούν και οι δύο:

 

Έστω ο πίνακας:

var array=[1,2,3,4,5];

console.log(array.splice(2));

// επιστρέφει [3, 4, 5] δηλαδή τα στοιχεία του πίνακα από τη θέση 2 και μετά
console.log(array);

// επιστρέφει [1, 2] δηλαδή τον αρχικό σου πίνακα μετά την τροποποίηση

 

Έστω ο πίνακας :

var array2=[6,7,8,9,0];

console.log(array2.splice(2,1));

// επιστρέφει [8] γιατί ξεκινάει από τη θέση 2 και επιλέγει ένα μόνο στοιχείο, αυτό το οποίο βρίσκεται στη θέση 2
console.log(array2.splice(2,0));

//επιστρέφει []  αφού του είπες να ξεκινήσει από τη θέση 2 και να επιλέξει 0 στοιχεία
console.log(array2);

// επιστρέφει [6,7,9,0] δηλαδή τον αρχικό σου πίνακα μετά την τροποποίηση

 

Έστω ο πίνακας :

var array=[1,2,3,4,5]
console.log(array.slice(2));

// επιστρέφει [3, 4, 5] δηλαδή τα στοιχεία από τη θέση 2 και μετά
console.log(array.slice(-2));

// επιστρέφει [4, 5] δηλαδή τα στοιχεία από τη θέση -2 (η τελευταία θέση του πίνακα έχει index -1) και μετά, με κατεύθυνση από την αρχή προς το τέλος του πίνακα 
console.log(array);

// επιστρέφει [1, 2, 3, 4, 5] δηλαδή τον αρχικό σου πίνακα ο οποίος δεν τροποποιείται από την slice()

 

Happy coding!!!

Add new comment

Restricted HTML

  • Allowed HTML tags: <a href hreflang> <em> <strong> <cite> <blockquote cite> <code> <ul type> <ol start type> <li> <dl> <dt> <dd> <h2 id> <h3 id> <h4 id> <h5 id> <h6 id>
  • Lines and paragraphs break automatically.
  • Web page addresses and email addresses turn into links automatically.