Octal Literal

  • ES5
    • Prior to ES6 to represent an octal literal we would use the zero prefix (0) followed by a sequence of octal digits (from 0 to 7).
    • If the octal literal contains a number that is out of range, JavaScript ignores the leading 0 and treats the octal literal as a decimal
    • You can use octal literals in non-strict mode. If you use them in strict mode, JavaScript will throw an error.
    
//Octal Representation in ES5
var octalNumber =012;
console.log(octalNumber);
//will Display 10

var numberWithNonOctalDigits =079;
console.log(numberWithNonOctalDigits);
//Will consider as decimal as 9 in 079 is not a octal digit
//In Strict mode the above code lines will throw an error
//"Decimals with leading zeros are not allowed in strict mode"
  • ES6
    • Allows you to specify the octal literal by using the prefix 0o followed by a sequence of octal digits from 0 through 7
    • If you use an invalid number in the octal literal, JavaScript will throw a SyntaxError "Invalid or unexpected token"
    • Octal literals can be used in both strict and non strict mode without any issues.
//Octal Representation in ES6
var octalNumberEs6 = 0o12;
console.log(octalNumberEs6);
//Below code throws Invalid or unexpected token exception
var numberWithNonOctalDigitsES6 = 0o79;
console.log(numberWithNonOctalDigitsES6);

BINARY LITERAL

  • Prior to ES6 there was no support to Binary Literals in Javascript. In order to represent binary numbers we used to take the help of parseInt method
var e = parseInt('1111',2);
console.log(e); //15
  • ES6 added support for binary literal by using the 0b prefix followed by a sequence of binary numbers (0 and 1).
var e = 0b1111;
console.log(e) //15

UNICODE STRING

  • ES6 improved unicode support in three areas and uses unicode version 5.1.0.
    • Unicode escapes for code points beyond 16 bits \u{…} can be used in identifiers, string literals, template literals and regular expression literals.
      • In order to represent code points beyond 16 bits in ES5, it was required to create two surrogate pairs each of UTF-16 code units. For example in ES5 Unicode Character “SCREEN” is represented by two UTF-16 code units ‘\uD83D\uDDB5’, the same can be represented in ES6 as ‘\u{1f5b5}’
    • In Strings,
      • Iterations honor unicode code points
      • String.prototype.codePointAt() can be used to read code point values
      • String.fromCodePoint() can be used to create a string from code point values.
    • In Regular Expressions
      • A new flag /u improves handling of surrogate pairs

REGULAR EXPRESSION LITERAL

The following regular expression features are new in ES6:

  • The new flag /y (sticky) anchors each match of a regular expression to the end of the previous match.
  • The new flag /u (unicode) handles surrogate pairs (such as \uD83D\uDE80) as code points and lets you use Unicode code point escapes (such as \u{1F680}) in regular expressions.
  • The new data property flags gives you access to the flags of a regular expression, just like source already gives you access to the pattern in ES5:
> /abcd/ig.source // ES5'abcd'> /abcd/ig.flags // ES6'gi'
  • You can use the constructor RegExp() to make a copy of a regular expression:
> new RegExp(/abc/ig).flags'gi'> new RegExp(/abc/ig, 'i').flags // change flags'i'

OBJECT LITERALS

Object literals are used to quickly create objects with properties defined in key:value pairs delimited by comma. ES6 has made this even easier by

  • providing a shorthand syntax for initializing object properties from the variables that are passed to a function
    • Prior to ES6 in order to initialize properties to an object using object literals we followed the below syntax
function getStudent(name, fathername, studentNumber){
    return {
        name: name,
        fatherName: fatherName,
        studentNumber: studentNumber
    }
}

getStudent("Jayaprakash", "Venkat Rao", "S14829")
//{name: "Jayaprakash", fatherName: "Venkat Rao", studentNumber: "S14829"}
  • In ES6 if the variables passed to function had same names as that of the object properties, we can avoid using key:value pair while returning the object literal as below
function getStudent(name, fathername, studentNumber){
    return {
        name,
        fatherName,
        studentNumber
    }
}

getStudent("Jayaprakash", "Venkat Rao", "S14829")
//{name: "Jayaprakash", fatherName: "Venkat Rao", studentNumber: "S14829"}
  • providing shorthand syntax for defining methods
    • Prior to ES6 for writing any methods in objects we used below syntax
function getStudent(name, fathername, studentNumber){
    return {
        getName: function(){
            return name;
        }
    }
}

getStudent("Jayaprakash", "Venkat Rao", "S14829").getName();
//"Jayaprakash"
  • In ES6 there is no need to mention function keyword for object methods
function getStudent(name, fathername, studentNumber){
return {
getName(){
return name;
}
}
}

getStudent("Jayaprakash", "Venkat Rao", "S14829").getName();
//"Jayaprakash"
  • enabling ability to have computed property names in an object literal definition.
    • ES6 allows external variable values as object property name by enclosing the variable in Square brackets
let personName = "name";
let phoneNumber = "phone";

let person = {
    [personName]: "Jayaprakash",
    [phoneNumber]: "222-222-2222";
}

console.log(person);
//{"name":"Jayaprakash","phone":"222-222-2222"}
  • We can even use computed method names within the object
let functionName = "show";
let computedFunction = {
    [functionName + "Me"](){
        console.log("Inside Computed Function Name");
    }
};

computedFunction.showMe();

Leave a Reply

Your email address will not be published. Required fields are marked *