Pankaj Parkar
Indian | 30 | Ex MVP | Angular GDE
Pankaj Pralhad Parkar
(Software Engineer @TSS Consultancy)
Twitter: @pankajparkar
FB: fb.com/pankaj.parkar
LinkedIn: https://in.linkedin.com/in/pankajparkar
Email: parkarpankaj3@gmail.com
var fooArray = [1,2,3];
console.log(fooArray.join(","));
//Output
"1,2,3"
console.dir(fooArray);
function Foo(){
this.name = 'Pankaj';
}
console.log(Foo.prototype);
console.log(Foo.prototype.constructor == Foo);
//Output
{ __proto__: { constructor: Foo, __proto__: Object }}
true
E6 Class keyword is just a syntactical sugar to define a function & create a prototypal inheritance in simpler way.
class Vehicle {
constructor(name){
this.name = name;
console.log('Simple Class');
}
}
var vehicle = new Vehicle('Car');
//Output
console.log(vehicle);
function Vehicle(name){
this.name = name;
console.log('Simple Class');
};
var vehicle = new Vehicle('Car');
//Output
console.log(vehicle);
ES5
ES6
class Human {
constructor(){
this._name = 'Test';
}
myMethod(){
console.log('My method got call');
}
static myStaticMethod(){
//here you don't have to this.
console.log(`_name prop value is
${this._name}`);
}
get name(){
return this._name;
}
set name(value){
this._value;
}
}
//Static property
Human.somethingElse = 10;
Vehicle
Car
Bicycle
How Prototypal inheritance have been used by ES5?
// define the Person Class
function Vehicle(name, color) {
this.name = name;
this.color = color;
}
Vehicle.prototype.description = function() {
return `Vehicle is ${this.name}
which has ${this.color} color.`;
};
// define the Student class
function Car(name, color) {
Vehicle.call(this, name, color);
}
// inherit Person
Car.prototype =
Object.create(Vehicle.prototype);
Car.prototype.constructor = Car;
var car = new Car('BMW', 'green');
console.dir(car)
console.log(car.description());
Inheritance using Class
class Vehicle{
constructor(name, color){
this.name = name;
this.color = color;
}
description() {
return `Vehicle is ${this.name}
which has ${this.color} color.`;
};
}
class Car extends Vehicle {
constructor(name, color, wheels){
super(name, color);
this.wheels = wheels;
}
}
var car = new Car('BMW', 'Green', 4);
console.log(car.description());
ES5 => ES6
class Vehicle{
constructor(name, color){
this.name = name;
this.color = color;
}
description() {
return `Vehicle is ${this.name}
which has ${this.color} color.`;
};
}
class Car extends Vehicle {
constructor(name, color, wheels){
super(name, color);
this.wheels = wheels;
}
}
var car = new Car('BMW', 'Green', 4);
console.log(car.description());
// define the Person Class
function Vehicle(name, color) {
this.name = name;
this.color = color;
}
Vehicle.prototype.description = function() {
return 'Vehicle is ' + this.name +
'which has '+ this.color + ' color.';
};
// define the Student class
function Car(name, color) {
Vehicle.call(this, name, color);
}
// inherit Person
Car.prototype =
Object.create(Vehicle.prototype);
Car.prototype.constructor = Car;
var car = new Car('BMW', 'green');
console.log(car.description());
By Pankaj Parkar