Skip navigation

Tag Archives: Javascript


jQuery initially released on August 26, 2006 by John Resig. The entire web community started its journey towards this particular JavaScript library. As on October 12, 2018 still 83,547,613 websites using jQuery as per builtwith trends.

After browsers become ever green and newer version of JavaScripts like ES6 started flowing, the return journey became inevitable. Inbound journey may not be as fast as out bound journey but return journey has started already.

It may not be possible to ignore jQuery right away but it is good time to use as much as vanilla JavaScript possible in place of jQuery. In that direction, this series going to talk about JavaScript equivalents of jQuery most used methods.

This series is for who already knew jQuery and wants to get rid of it gradually to use plain JavaScript instead using its latest features.

jQuery to JavaScript, the return journey – Introduction.

Advertisements

Today, we are going to expose some inner working of angular 2.

You know what, the double curly braces aka interpolation always  seems awesome magic.

<h1>{{ text }} </h1>

Really, this is sugar syntax for:

<h1 [innerText]=”text”></h1>

Yeah… angular 2 property binding using DOM attribute directly. So, is it possible to add class to a div tag?? Well

<h1 [className]=”active”></h1>

This is equivalent to

h1 = document.querySelector(‘h1’);
h1 = ‘active’;  // className is property of DOM element div

Interesting, isn’t it?


Pass by value and pass by reference is age old concept. It is working similar way in JavaScript too. If you like to see some code so that you can understand better. Keep reading.

Brief theory before jump into code. JavaScript primitive types (string, number, boolean, null and undefined) are passed by value. Whereas non-primitive types (objects, arrays, functions, etc.) are passed by reference.

// Primitive types: Immutable by default
let x = 5
let y = x
y = 10
console.log(x) // output 5
console.log(y) // output 10

// Non-primitive types: Mutable
let animal = {
    name: 'Rat'
}
let anotherAnimal = animal
anotherAnimal.name = 'Horse'
console.log(animal) // {name: "Horse"}
console.log(anotherAnimal) // {name: "Horse"}
console.log(animal === anotherAnimal) // true

This knowledge might be useful while learning react.js, redux architecture.