top button
Flag Notify
    Connect to us
      Site Registration

Site Registration

Small Discussion about Javascript(ECMASCRIPT 6) Variable & Scoping ?

0 votes
373 views

ES(ECMASCRIPT) 6 provides two new ways of declaring variables: let and const, which mostly replace the ES5 way of declaring variables, var.

LET

let works similarly to var, but the variable it declares is block-scoped, it only exists within the current block. var is function-scoped.


function order(x, y) {
    if (x > y) { // (A)
        let tmp = x;
        x = y;
        y = tmp;
    }
    console.log(tmp===x); // ReferenceError: tmp is not defined
    return [x, y];
}

CONST
const works like let, but the variable you declare must be immediately initialized, with a value that can’t be changed afterwards.

const allows you to declare a single assignment variable lexically bound. 


const foo;
    // SyntaxError: missing = in const declaration

const bar = 123;
bar = 456;
    // TypeError: `bar` is read-only

VAR
With const and let, there is no more space for var anymore.

 

Video Tutorial

posted Oct 14, 2016 by Parampreet Kaur

  Promote This Article
Facebook Share Button Twitter Share Button LinkedIn Share Button


Related Articles

Class in Javascript

     JavaScript classes introduced in ECMAScript 6 are syntactical sugar over JavaScript's existing prototype-based inheritance. The class syntax is not introducing a new object-oriented inheritance model to JavaScript. ​

One way to define a class is using a class declaration. To declare a class, you use the class keyword with the name of the class

Example :

class Point {
    constructor(x, y) {
        this.x = x;
        this.y = y;
    }
    toString() {
        return `(${this.x}, ${this.y})`;
    }
}

 

For Calling its same like ES5  

var p = new Point(25, 8);

 Classes support prototype-based inheritance, constructors, super calls, instance and static methods.

Video for ES6 Classes

https://www.youtube.com/watch?v=p1jCfPIBh0M​

 For More Visit Official Site : https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Classes

READ MORE

What is Polymer.Js?

Polymer.js is a JavaScript library created by Google that allows reusing the HTML elements for building applications with components. Polymer is an open-source JavaScript library developed by Google developers

Polymer provides a number of features over vanilla Web Components:

  • Simplified way of creating custom elements
  • Both One-way and Two-way data binding
  • Computed properties
  • Conditional and repeat templates
  • Gesture events

Polymer.js places a hefty set of requirements on the browser, relying on a number of technologies that are in still in the process of standardization (by W3C) and are not yet present in today’s browsers. 

Examples include the shadow dom, template elements, custom elements, HTML imports, mutation observers, model-driven views, pointer events, and web animations. These are marvelous technologies, but at least as of now, that are yet-to-come to modern browsers.

The Polymer strategy is to have front-end developers leverage these leading-edge, still-to-come, browser-based technologies, which are currently in the process of standardization (by W3C), as they become available. 

The recommended polyfills are designed in such a way that (at least theoretically) will be seamless to replace once the native browser versions of these capabilities become available.

Video for Polymer.Js
https://www.youtube.com/watch?v=tvafAyxkuVk

READ MORE

What is Axios?

Axios is a promise-based HTTP client that works both in the browser and in a node.js environment. It basically provides a single API for dealing with XMLHttpRequest s and node's http interface. Besides that, it wraps the requests using a polyfill for ES6 new's promise syntax

Node Command

npm install axios

Bower Command

bower install axios

Features

  • Make XMLHttpRequests from the browser
  • Make http requests from node.js
  • Supports the Promise API
  • Intercept request and response
  • Transform request and response data
  • Cancel requests
  • Automatic transforms for JSON data
  • Client-side support for protecting against XSRF

The user interface is split up into three sections:

  • GET Request
  • GET Request with Parameters
  • POST Request

With each of these three sections the user is able to try out a specific use case for Axios.

Video for Axios

https://www.youtube.com/watch?v=1vbpBDWu1AQ

READ MORE

What is Supersonic ?

Supersonic is a robust user interface framework (UI) for developing hybrid mobile applications. The framework integrates with any REST API (Application Programming Interface) and allows data interaction/modification in the backend. With Supersonic, one can design API-connected mobile applications for iOS and Android.

Supersonic is a framework with an elegant balance of simplicity and power. By using the best of what AngularJS, web components and HTML5 have to offer, Supersonic has crafted a level of sophistication that is years ahead of the competition.

Supersonic UI is a game-changer. It's an Ionic fork that changes the way you think about hybrid app performance. Supersonic's declarative UI style makes building complex mobile apps a breeze. In the background, the seamless interplay of native UI and HTML5 bakes an end-result that is 100% indistinguishable from any native app. 

Supersonic bridges the gap by using native UI elements when HTML and CSS just don't cut it. No more position: fixed; header bars, slow tabs or choppy animations. Page transitions, modals, navigation bars, tab bars, drawers – and a whole lot more – are fully native. That means unparalleled performance and no App Store rejections.

Video for SuperSonic

https://www.youtube.com/watch?v=7uppxfhxl48

READ MORE

What is Guard?
Guards make sure that the application user with the access permission can access that particular area in the application.
It is mainly used to protect routes.

Guard Types:

  • CanActivate - this guard helps decide whether a route can be activated or not.
  • CanActivateChild - this guard helps to decide whether children routes of a route can be activated or not.
  • CanDeactivate - this guard helps decide whether a route can be deactivated or not.
  • CanLoad - this guard helps decide whether a module can be loaded lazily or not

Guards can be implemented in different ways, but after all it really boils down to a function that returns either Observable<boolean>, Promise<boolean> or boolean. In addition, guards are registered using providers, so they can be injected by Angular when needed.

To register a guard we need to define a token and the guard function. Here’s what a super simple guard implementation could look like:


@NgModule({
  ...
  providers: [
    provide: 'CanAlwaysActivateGuard',
    useValue: () => {
      return true;
    }
  ],
  ...
})
export class AppModule {}

Video for Guard

 https://www.youtube.com/watch?v=0Qsg8fyKwO4

READ MORE
...