JavaScript Key Points-1

In this blog i am going to cover key points about functions,expressions,dates and text formatting.

Note: Here in my js keypoints blog series am not going to cover about the topics indepth. It is for the folks that already have knowledge in javascript.and wan to learn/revise its key elements in a quick manner.

How it started? 🤔

JavaScript was created at Netscape in the early days of the web, and technically, “JavaScript” is a trademark licensed from Sun Microsystems (now Oracle) used to describe Netscape’s (now Mozilla’s) implementation of the language.

Definition:😎

1.JavaScript (JS) is a lightweight, interpreted, or just-in-time compiled programming language with first-class functions.

2.JavaScript is a cross-platform, object-oriented scripting language used to make web pages interactive

Key Points Started 🧐

1.In ES6 and later, the use of new language features often implicitly invokes strict mode. For example, if you use the ES6 class keyword or create an ES6 module, then all the code within the class or module is automatically strict, and the old, flawed features are not available in those contexts.

2.The core JavaScript language defines a minimal API for working with numbers, text, arrays, sets, maps, and so on, but does not include any input or output functionality. Input and output (as well as more sophisticated features, such as networking, storage, and graphics) are the responsibility of the “host environment” within which JavaScript is embedded.

3.The original host environment for JavaScript was a web browser, and this is still the most common execution environment for JavaScript code. The web browser environment allows JavaScript code to obtain input from the user’s mouse and keyboard and by making HTTP requests. And it allows JavaScript code to display output to the user with HTML and CSS

4.ParseInt: you can specify the base code when using parseInt to convert it from either binary/octal/decimal/hexadecimal

parseInt('101', 2) // 5 here 2 represents the string as binary

An alternative method of retrieving a number from a string is with the + (unary plus) operator:

'1.1' + '1.1' // '1.11.1'
(+'1.1') + (+'1.1') // 2.2   
// Note: the parentheses are added for clarity, not required.

5.Object literal:Object property names can be any string, including the empty string. If the property name would not be a valid JavaScript identifier or number, it must be enclosed in quotes.

Property names that are not valid identifiers cannot be accessed as a dot (.) property, but can be accessed and set with the array-like notation("[]").

var unusualPropertyNames = {
  '': 'An empty string',
  '!': 'Bang!'
}
console.log(unusualPropertyNames.'');   // SyntaxError: Unexpected string
console.log(unusualPropertyNames['']);  // An empty string
console.log(unusualPropertyNames.!);    // SyntaxError: Unexpected token !
console.log(unusualPropertyNames['!']); // Bang!

6.Javascript and Java: The JavaScript language resembles Java but does not have Java’s static typing and strong type checking.

JavaScript has a prototype-based object model instead of the more common class-based object model.The prototype-based model provides dynamic inheritance; that is, what is inherited can vary for individual objects.

In javascript properties and methods can be added to any object dynamically.Where as in Java Classes and instances cannot have properties or methods added dynamically.

7.Hoisting: In the case of functions, only function declarations are hoisted — but not the function expressions.

8.Conditional Statements:If you need to use an assignment in a conditional expression, a common practice is to put additional parentheses around the assignment, like this:

if ((x = y)) {
  /* statements here */
}

9.Falsy values

The following values evaluate to false (also known as Falsy values):

• false
• undefined
• null
• 0
• NaN
• the empty string ("")

Caution: Do not confuse the primitive boolean values true and false with the true and false values of the Boolean object!

For example:

var b = new Boolean(false);
if (b)         // this condition evaluates to true
if (b == true) // this condition evaluates to false

10.Switch: By convention, the default clause is written as the last clause, but it does not need to be so.The optional break statement associated with each case clause ensures that the program breaks out of switch once the matched statement is executed, and then continues execution at the statement following switch. If break is omitted, the program continues execution inside the switch statement (and will evaluate the next case, and so on).

11.break statements:Use the break statement to terminate a loop, switch, or in conjunction with a labeled statement.

• When you use break without a label, it terminates the innermost enclosing while, do-while, for, or switch immediately and transfers control to the following statement.
• When you use break with a label, it terminates the specified labeled statement.

The syntax of the break statement looks like this:

break;
break [label];
let x = 0;
let z = 0;
labelCancelLoops: while (true) {
  console.log('Outer loops: ' + x);
  x += 1;
  z = 1;
  while (true) {
    console.log('Inner loops: ' + z);
    z += 1;
    if (z === 10 && x === 10) {
      break labelCancelLoops; //breaks out of outer while loop
    } else if (z === 10) {
      break; //breaks out of inner while loop
    }
  }
}

Note: break is applied for loops or switch or labeled statements only but not for if-else

12.Continue Statement:The continue statement can be used to restart a while, do-while, for, or label statement.

• When you use continue without a label, it terminates the current iteration of the innermost enclosing while, do-while, or for statement and continues execution of the loop with the next iteration. In contrast to the break statement, continue does not terminate the execution of the loop entirely. In a while loop, it jumps back to the condition. In a for loop, it jumps to the increment-expression.
• When you use continue with a label, it applies to the looping statement identified with that label.

The syntax of the continue statement looks like the following:

continue [label];

13.For … in Statement: for-in statement is used to iterate over properties in an object.

for (variable in object)
  statement

Note: If you use for-in with arrays, variable represents index and object[variable] represents value.

it is better to use a traditional for loop with a numeric index when iterating over arrays, because the for...in statement iterates over user-defined properties in addition to the array elements.

14.for...of statement:

The for...of statement creates a loop Iterating over iterable objects (including Array, Map, Set, arguments object and so on), invoking a custom iteration hook with statements to be executed for the value of each distinct property.

for (variable of object)
  statement

The following example shows the difference between a for...of loop and a for...in loop. While for...in iterates over property names, for...of iterates over property values:

const arr = [3, 5, 7];
arr.foo = 'hello';
for (let i in arr) {
   console.log(i); // logs "0", "1", "2", "foo"
}
for (let i of arr) {
   console.log(i); // logs 3, 5, 7
}

Note: objects are not iterable,so we can not use for-of over objects.