Is there a way to select all the items listed in an array without using a loop?

Question

#javascript (maybe #java)

ie, instead of:
for (i = 0; i < arr.length-1; i++) { //code }

something more like:
arr[everyvalue/all/ininity].//code

Answer 1

Technically, it would ever be a loop, even if you don't write explicit one ^^

Anyway, it's possible, but onelined version is not well readable:

Array.prototype.slice.call(document.getElementsByTagName('div')).map(function(x) { x.style.background='red'; });

Step by step, with few explanation:

var d = document.getElementsByTagName('div');

// not a real array, so cast it to array:
d = Array.prototype.slice.call(d);

// map your treatment, even without returning/storing value:
d.map(function(x) { x.style.background='red'; });

Answer 2

The shorter the array is there would be no problem, but when your array contains a lot of cells it going to be difficult to do it. And it depends what you plan to do with the array a d it's content.
You could use a switch case situation but then you will have a lot of cases you have to refer to.
Perhaps you could tell me what you want to do.

Answer 3

If you only have 5 elements in your array why would you use an array if this is to difficult for you. Create a series if variables with a number sequence in them like var_1, var_2, etc create two sets so you can do with them what you want in a normal recursion as with switch and case system...
To make it simple create a function that does the repeating validation, but you will always need some kind of a loop. A for or while loop. I guess you have some problems using them. To get familiar with them, write some small codes and run those testing.

Answer 4

@Your welcome. Russel, whenever you might need some help don't be afraid to ask. Asking a question is a smart way to accomplish your goals flawlessly and with success. And remember there are no stupid questions only stupid answers. Good luck in your endavours Russel

Answer 5

Improved (sprite animation handler is now method of class Smiley, and 'loop free' version by default -- code inlined comment keep the 'simple loop' version):

https://code.sololearn.com/W932FRe3hivC/#js

@Anatoli:
I've read your comments in my first version: so I've differ this post to now, for following your suggestion... but that was not the main purpose of it ;P

Answer 6

But why << without writing a loop >>?

Anyway, you can also:
+ use Css animation features to handle your sprite background position update loop
+ at least separate treatment of sprite background position update loop from the sprite global position
+ use Css properties 'top' and 'position' with a relative mode rather that 'margin-top' to be able to correctly (independently) position (else you will have context behaviour changed)
+ maybe use 'display:inline-block' rather than 'block', depending on what you expect for next sibling sprite position (at next line, or on same line)

Just some of these things by modifing your code, implemented with simple loop (and with main css declarations moved to css tab):

https://code.sololearn.com/WL2UUDWu46ru/?ref=app#js

Answer 7

I need to cram to understand this better, but thanks for a reference. Seems like these will be the kind of tools I will need in the future of some of my codes

Answer 8

Sure thing.
Lets say I have 5 div elements, and I want to make them all change from position left: x to position left: y;
I want to use a simple code like this
document.getElementsByTagName("div")[every?].style.left: y;

Does that make sense?

Answer 9

'map()' method can be very useful (as 'call()', but that's less related, as you need it to cast the list of element to an 'real' array to use the 'map' targeted method), but in this case you can write easily an explicit loop relatively not much verbose, and better readable (and easiest to remember/write):

var d = document.getElementsByTagName('div');
var i = d.length;
while (i--) d[i].style.background='red';

What's your case requiring a 'loop free' way to do?

Answer 10

Curiosity and education mainly. Targeting all of one tag type was the goal, this code ->
https://code.sololearn.com/W1X2utyWqg13/?ref=app <- I wanted to make a bunch of marching divs, instead of one. Without writing a loop

Answer 11

Improved again... new methods in 'Smiley' class object, to give example for a little more advanced handling of global animation (versus first handler dedicated to swap images components of sprite)... Adding a 'Dot' class for handling coordinates, and ajust settings to get randomized speeds but fluids (first move size value in original code was a little too much and produced jump effect ^^):

https://code.sololearn.com/WRxSoV5wO8Vq/#js

Answer 12

there is .forEach() method that executes the function with each and every of the elements as argument.
a = [1, 2, 3]
a.forEach(x => console.log(x)) u will see 1, 2 and 3 logged in your console.

Answer 13

@Edward Jomisko:

The question was about JS, wich have no 'enum' built-in type even you can emulate some... and anyway, I don't understand what's your suggested way, as I only can see how to virtual select elements (setting flags to check them), but not to select iobjects for applying them a class method without loop (map(), filter() and reduce() are powerfull methods of 'Array' object but do loops implicitly) ^^

Answer 14

I wouldn't say a problem. Just think I could do this easier than all that. Thanks for the feedback

Answer 15

I'm not sure I understand all of that, visph. Not familiar with prototype, call, or map... I'm going to read up and play around

Answer 16

Iterating an array through loop is not the only option to do it.

There are built-in array.prototype functions which can help us write efficient codes.

Try to familiar the usage of the the following array.prototype functions:

copyWithin()
fill ()
pop()
push()
shift()
sort()
splice()
unshift()
indexOf()
slice()
every()
filter()
forEach()
map()
reduce()

The functions map(), reduce() and filter() are very powerful functions. We must learn it.
Together with ES6 arrow function, a complicated result could be produce by a single line code.

Refer to Mozilla doc for more information about the commands:

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/prototype

Answer 17

@Edward Its cool, I enjoyed the read. Lol

Answer 18

@Edward Smacking yourself with a frozen Tuna could be classified as animal abuse so be careful, hahahaha, LOL😬😬😬😂😂😂😂🤣🤣🤣😎😎😎😉👀👀👀👀👣👣👣👁️

Answer 19

Thanks, I will check it out

EDIT checked out, studied, improved my own. Got it working by changing only 3 lines. Hell yeah.

Time to apply the new knowledge to the big project

Answer 20

Thanks Calvin. Thats a pretty list. Got a few of these down, definitely seems I need to work on others.