Array methods
dingleberry, (edited ) This would’ve been much easier to read with plain numbers. Also, easier to read for color blind people.
<span style="color:#323232;">[1, 2, 3, 4].push(5) => [1, 2, 3, 4, 5] </span><span style="color:#323232;">[1, 2, 3, 4].unshift(5) => [5, 1, 2, 3, 4] </span><span style="color:#323232;">[1, 2, 3, 4].pop() => [1, 2, 3] </span><span style="color:#323232;">[1, 2, 3, 4].shift() => [2, 3, 4] </span><span style="color:#323232;">[1, 2, 3, 4].map(x => x = 5) => [5, 5, 5, 5] </span><span style="color:#323232;">[1, 2, 1, 4].filter(x => x == 1) => [1, 1] </span><span style="color:#323232;">[1, 2, 3, 4].reverse() => [4, 3, 2, 1] </span><span style="color:#323232;">[1, 2, 3, 4].at(2) => 3 </span><span style="color:#323232;">[1, 2, 3, 4].slice(2) => [3, 4] </span>
tst123, Feel free to upload it here when you finish making it
tsonfeir, 
Does anyone else dislike the words shift and unshift for that functionality?
Xanvial, Yeah, I really like what Redis do with their commands, LPush LPop RPush RPop, are really straight forward and immediately know what they do
tsonfeir, Yes that’s a lot more specific.
lily,
mapshould probably beblueArr.map(blue => purple)instead ofblueArr.map(blue => blue = purple)
swnt, While the idea and visualisation is indeed good, there is an error in the visualization.
Namely, the meaning of “->” is inconsistent. IMO it should be the return value of the function call (like in reverse), but for at least pop, the visualization shows the array instead of the array + return value.
For pop the return value isn’t the array itself, but the popped value: developer.mozilla.org/en-US/docs/Web/…/pop
The visualisation could be improved by clarifying, that the array after the function call is visualised. And using -> isn’t the best option IMO, because people expect the right side to contain the return value.
Pyro, I agree, there should be a distinction between return value and array state.
SzethFriendOfNimi, Like how the colored shapes make what’s happening clearer.
Add comment