After learning Ruby, getting stuff done in Javascript can seem much harder. Many methods in Ruby, such as sort, are just a dot notation away. However, in JS you have to write out the whole function. Check it…
# Ruby
numbers = [2, 5, 6, 11, 1, 23, 3]
numbers.sort!
# numbers = [1, 2, 3, 5, 6, 11, 23] Not bad at all!
# That was so easy. Let's try it with names....
names = ['Martha', 'Tony', 'Sarah','Bob', 'Clara']
names.sort!
# names = ["Bob", "Clara", "Martha", "Sarah", "Tony"]
# Woah! It's the same!
// JS
let numbers = [2, 5, 6, 11, 1, 23, 3]
numbers = numbers.sort((a, b) => a - b)
// Well that's not so bad
// Let's try it with names
let names = ['Martha', 'Tony', 'Sarah','Bob', 'Clara']
names = names.sort((a, b) => {
if (a < b) {
return -1;
} else if (a > b) {
return 1;
} else {
return 0;
}
});
// Yuck. Quite a bit more verbose
Well, unfortunately there are just some things in JavaScript that are the way they are. Like my Scottish father-in-law says, “You cannot fart against thunder”. Some things you just have to accept. Sometimes, you (or people that make the thunder) can change it. ES6 has brought some cool changes that have made programming in JS much more fun. I’ve been messing around with some cool shortcuts that you can use to give your fingers a bit of a break. Some of these were already available pre-ES6.
First let’s take a look at flattening an array of arrays.
# Just for fun I'll include the Ruby magic arrays = [1, [2, 3], [4, [5, 6]], 7] arrays.flatten! # [1, 2, 3, 4, 5, 6, 7] - Too easy // Pre ES6 var arrays = [1, [2, 3], [4, [5, 6]], 7]; var flattenedArrays = [].concat.apply([], arrays); // [1, 2, 3, 4, 5, 6, 7] // Not horrible, but the spread operator makes it even better... const arrays = [1, [2, 3], [4, [5, 6]], 7]; const flattenedArrays = [].concat(...arrays) // Not a huge difference, but - Less typing = Happier coder
Ok that wasn’t a huge deal. Here are some examples using operands. Thanks to these wonderful humans for bringing them to my attention.
var number = 1, string = "1", // How would you normally change number to a string? Personally, I'd use the .toString() method number.toString() // "1" // But this is more fun... number + "" // "1" // I like // How bout changing that string to an integer? // A little parseInt() shall we? parseInt(string) // 1 // The following is much more succinct +string // 1 // Shiiiiit. That's cool.
How bout finding the max/min from an array. Well the Math prototype does not accept an array as it’s arguments.
// Pre-JS6 const numbers = [8, 7, 55, 4]; Math.max.apply(null, numbers) // 55 Math.min.apply(null, numbers) // 4 // JS6 Math.max(...numbers) // 55 Math.min(...numbers) // 4 // Very nice! # Just for S & G's - Ruby numbers.max # 55 - beautiful
The spread operator makes this possible by spreading the values in the array out into arguments of the math functions. Not quite the magical abstractness of Ruby, but cool nonetheless! There are of course libraries like lodash that fill in some of the cracks, but there are always new things to discover about a language. The never ending mountain is waiting to be climbed. She is forever shifting and you can never reach the top. You just have to learn to love climbing. And remember…you cannot fart against thunder (in a very broad Scottish accent). That man has some stories.
siamking 