Javscript: expressions and operators

An expression is a javascript phrase that can be evaluated to produce a value.a constant embedded literally in your program is a simple kind of expression. A variable is also a simple expression that evaluates to whatever the value was assigned to it. complex expressions are built using simpler expressions like addition which has two expressions (operands) evaluates to produce a value. Lets look at different category of expressions.

primary expressions

primary expressions are those that are stand alone, they do not include any more simpler expressions. Literals, variables, and certain keywords are some of the examples of primary expressions.

"hello" // "string literal"
1.25    // "number literal"
true    // "keyword"
false   // "keyword"
null    // "keyword"
name    // "variable reference"

complex expressions

expressions that contain sub-expressions are known as complex expressions. some of examples include

1. function definition expression

    let cube = function (x){ return x*x*x} // function returns cube of the argument passed
   

2. property access expressions

    // The syntax for property acces of an object or array 
    // expression.identifier 
    // expression[expression] this is useful when property is not known before runtime
    let zero = "0"
   
    let x = [1,2,3]
    x[0]    // => 1
    x.zero  // 1
   
    let y = {
             zero: 0,
             one: 1,
             two: 2
    }
    y[two]  // => 2
    y.zero  // => 0
   

3. object, array initializers

   
    let y = {
             zero: 0,
             one: 1,
             two: 2
    }
   
    let x = [1,2,3]
   

4. arithmetic like addition, subtraction so on.

    let sum = 2 + 5 // => 7
    let x = 6,y = 4
    sum = x + y // => 10
    sum = x * y // => 24
   

operators

There are many types of operators in javascript just like any other programming language with some of them being specific to javascript. Operators can be mainly categorized into assignment operators, relational operators, logical operators and some miscellaneous operators. The below table shows all the operators in javascript. we will be looking at some of them. Multiple operators on the same horizontal line have the same precedence. Vertically they were sorted in decreasing order of precedence.

• column a specifies the associativity which means the order of operation when the same precedence level operators are used. R(right to left), L(left to right)

• column n specifies the no of operands required

• column Types specifies the type of operands it expects

Arithmetic operators

1. Addition(+)
   The plus(+) operator expects two operands. If the two operands are numeric it adds else if the two operands are strings it concatenates. The + operator is very flexible in type conversion. It converts to its type with whatever type you provide. if one operand is a string and the other is numeric, it converts the numeric to a string and then concatenates.If it cannot convert them into its type the output would be NAN.

2. Subtraction(-)
   Expects two operands of numeric type and subtracts them. It is very flexible in type conversion it converts the given operands into its type if the operands are not numeric. If it cannot convert them into numeric the output would be NAN.

3. Division(/)

4. Multiplication(\)*

5. exponentiation(\*)*

6. modulus(%)
   These are pretty straightforward operators which expect two operands, do type conversion if necessary and calculate the respective values.

Unary arithmetic operators

1. unary plus(+) It expects one operand and tries to convert it to number if possible or NaN and returns that value.

2. unary minus(-) It expects one operand. It tries to convert the operand to number type if necessary and changes the sign.

3. increment(++) It expects one operand of an lvalue(variable,element of an array,object property). it tries to convert the operand to a number if needed and then It increments its value by one and assigns it back to the operand. It is used in two positions before the operand and after the operand which defines its behavior. Look at the below example.

let x =1
let y = x++ //  x is incremented by one but returns the original value so y is 1
let z = ++x // x is incremented by one  and returns the incremented value so z is 3

similarly, the decrement operator decrements the value by one. Note that x++ is not the same as x=x+1. The increment operator converts the operand to a number if it's not numeric. For example, if x is string "2", x++ is 3 but x=x+1 is "21".

Logical operators

A boolean represents two values true or false, on or off, yes or no. The keywords true and false evaluate these values. Booleans are mostly the result of comparisons in programs. Any javascript value can be converted into a boolean. There are values to which they evaluate to false and are called falsy values.

1. null

2. undefined

3. 0

4. empty string

5. NAN

6. 0

Apart from the above values all evaluate to true such as object, array and are called truthy values.

There are three boolean operators which are logical AND, logical OR, and logical NOT.

1. AND (&&):
   It evaluates to true value if both the operands are true otherwise false. If the first operand is false it just returns the first operand without evaluating the second operand. If the first operand is true it evaluates the second operand and returns it.

    let obj = {x:1,y:2,z: 0}
    let arr = [1,2,3]
    let output = obj.x && arr //=> left operand is true so returns right operand
    console.log(output) //=> [1,2,3] 
   
    output = obj.z && arr // => left operand is false and returns it without evaluating the second operand
    console.log(output) // 0
   

2. OR (||):
   It evaluates to falsy value if both the operands are false otherwise true. If the first operand is true it returns the first operand without evaluating the second operand. If the first operand is false it returns the second operand.

    et obj = {x:1,y:2,z: 0}
    let arr = [1,2,3]
    let output = obj.x || arr //=> left operand is true so returns it without evaluating the right operand
    console.log(output) //=> 1 
   
    output = obj.z || arr // => left operand is false and returns second operand
    console.log(output) // [1,2,3]
   

3. NOT (!):
   It evaluates to true if the operand is false and false if the operand evaluates to true.

    let x = 1
    let y = !x 
    console.log(y)  //=> false
   

Miscellaneous Operators

1. The conditional operator(?) It is a ternary operator which expects three operands. It evaluates the first operand, if it's true then the second operand is evaluated and returned else the third operand is evaluated and returned.

let x = 6 > 5 ? "yes" : "no"
console.log(x) //=> yes

2. First defined(??) This operator expects two operands. It returns the first operand if the first operand is not null or undefined otherwise it evaluates the second operand and returns it.

let maxWidth = undefined
let b = maxWidth ?? 0     // b is 0

2. typeof() operator
The typeof () operator expects one operand of any type. It returns a string of what type the operand is. Look at the following table.