Next Level JS Tricks

Multiple Assignments

When you have multiple variables to assign at the same time, you can combine the assignment operations into a single block using arrays.

The setup

Before
After
The results

Large Logical Expressions

Large expressions, like you might use in an If block, can be formatted using JavaScript conventions. You can use parentheses to group sub-expressions to make sure that everything is evaluated in the proper order.

($Upgrade_This_Month && (($Current_Year < $File_Year) || ($Current_Year == $File_Year && $Current_Month < $File_Month)))

This expression would evaluate to true when:

$Upgrade_This_Month is true AND either

  • $Current_Year is less than $File_Year

OR

  • $Current_Year is the same as $File_Year AND $Current_Month is less than $File_Month

Ternary Operator (Assign Conditional)

The ternary operator takes three operands: a condition followed by a question mark (?), then an expression to execute if the condition is true followed by a colon (:), and finally the expression to execute if the condition is false. This operator can be used in place of an If block.

Examples:

$result.hasOwnProperty( “quantity” ) ? $result.quantity : 0

If the $result variable has a property called quantity, then use the value of $result.quantity, otherwise use zero

List keys in a JSON Object

Say you have a javascript object, with a bunch of key value pairs. How do you key an array of only its keys? You can use Object.keys(someObj) to get an array of only the keys.

var $someObj = {
  dogs:3,
  cats:5,
  whales:1
}
 
var keys_only = Object.keys($someObj); 
// keys_only evaluates to ==> ["dogs","cats","whales"]

Reduce an Array

Say you have an array of things, and want some result that is derived by operating on each element in the array, successively. We can use someArray.reduce((previousValue,currentValue) => f(previousValue,currentValue),initialValue)

Examples:
Say we want to sum every element in an array. Heres one way:

var nums = [2,4,6,8];

var sum; // what we want to calculate
sum = 0; // initial value
nums.forEach(eachNumber => {
  sum = sum + eachNumber
});

print(sum) // sum evaluates to ==> 2+4+6+8 = 20.

Theres a better way:

var nums = [2,4,6,8];

var sum = nums.reduce((a, b) => a+b, 0);

print(sum) // sum evaluates to ==> 2+4+6+8 = 20.

Say we want to an average of every element in an array. Heres one way:

var nums = [2,4,6,8];

var avg; // what we want to calculate
avg = 0; // initial value
nums.forEach(eachNumber => {
  avg = avg + eachNumber;
});

// divide by number of things
var avg = avg / nums.length;

print(avg) // average evaluates to ==> 20/4 = 5.

Theres a better way:

var nums = [2,4,6,8];

var avg = nums.reduce((a, b) => (a+b),0) / nums.length

print(avg) // avg evaluates to ==> (2+4+6+8)/4 = 5.

String Operations

Split is often times useful in unexpected ways. Say I want to isolate the name of a cat, given some path to the cat. Heres how:

var $path = "animal/cat/tom"

// Make an array, thats the string split by some character. We'll split by "/".
var $splitPath = $path.split("/");

print($splitPath)
// I'll get ["animal","cat","tom"]

//How do we get only the last element? 
// Get the value at index of (length_of_array - 1)
// must be length - 1, because arrays start at index 0.

print($splitPath[$splitPath.length-1])
// I'll get "tom"


Likewise, I can do the inverse of split and join elements of an array into a string. Let's see an example.

var $stuff = ["animal","cat","tom"]

print( stuff.join(" AND ") )
// I'll get ==> "animal AND cat AND tom"