THE BLOG

Cheat Sheet: Iterating over Arrays in Ruby and JavaScript

August 4, 2015

This “cheat sheet,” which summarizes the most commonly used methods that Ruby provides to iterate through data collections and their JavaScript equivalents, was made in collaboration with Julia Graber. Please note that most (but not all) of the Ruby methods belong to the Enumerable module, and that the JavaScript methods only work for arrays—although some JavaScript libraries will extend their functionality to object literals. Ruby code snippets are provided first, followed by the JavaScript versions. One particularly salient difference between them is the requirement for explicit returns in JavaScript.



#each and .forEach()

#each calls the given block once for each element, passing that element in as a parameter. The JavaScript equivalent is .forEach().

arr = [1, 2, 3, 4, 5]

# Ruby
arr.each { |i| puts i }

// JavaScript
arr.forEach(function(i) { console.log(i) })

/* outputs sequentially 1, 2, 3, 4, 5 */

back to top


#map and .map()

#map creates a new array using the values returned by calling the block for each element. The JavaScript equivalent is .map().

arr = [1, 2, 3, 4, 5]

# Ruby
arr.map { |i| i * 2 }

// JavaScript
arr.map(function(i) { return i * 2 })

/* [2, 4, 6, 8, 10] */

back to top


#select and .filter()

#select (or #find_all) returns a new array that contains all values that pass as true in the given block. The JavaScript equivalent is .filter().

arr = [1, 2, 3, 4, 5]

# Ruby
arr.select { |i| i % 2 == 0 }

// JavaScript
arr.filter(function(i) { return i % 2 == 0 })

/* [2, 4] */

back to top


#inject and .reduce()

#inject (or #reduce) combines all elements in an array by passing each element into a block. The accumulator is the first parameter specified within the pipes of the code block and can optionally be given a starting value by including an argument with the #inject method. The iterated variable is the second parameter included in the code block. The JavaScript equivalent is .reduce(). Note that the optional starting value is placed as the second parameter of the JavaScript .reduce() method.

arr = [1, 2, 3, 4, 5]

# Ruby
arr.inject(0) { |acc, i| acc += i }

// JavaScript
arr.reduce(function(acc, i) { return acc += i }, 0)

/* 15 */

back to top


#all? and .every()

#all? passes each element to the block, and will return true if the block never returns false or nil. The JavaScript equivalent is .every().

arr = [1, 2, 3, 4, 5]

# Ruby
arr.all? { |i| i > 1 }

// JavaScript
arr.every(function(i) { return i > 1 })

/* false */

back to top


#any? and .some()

#any? passes each element to the block, and will returns true as long as any one element evaluates as true. The JavaScript equivalent is .some(), which can also be used to mimic the behavior of Ruby’s include? method.

arr = [1, 2, 3, 4, 5]

# Ruby
arr.any? { |i| i > 4 }

// JavaScript
arr.some(function(i) { return i > 4 })

/* true */

back to top


Coda

Comparing the pairs of code snippets above reveal a somewhat surprising similarity between the Ruby and JavaScript versions of these powerful iteration options, something which I feel is usually obscured by JavaScript’s syntax.

For more information on these and many other helpful methods for data collections, the reader is referred to RubyDocs and Mozilla’s JavaScript Reference.