Translate

ads

Showing posts with label Java Script. Show all posts
Showing posts with label Java Script. Show all posts

21 Jun 2019

JavaScript | Importing and Exporting Modules

JavaScript | Importing and Exporting Modules


JavaScript Modules are basically libraries which are included in the bestowed program. They are used for connecting two JavaScript programs simultaneously to call the functions written in one program without writing the body of the functions itself in another program.

Import library: It proportion include a library in a program so that use the function is defined in that library. For this, use ‘require’ function in which pass the library name with its correlative way.

Example: envision a library is made in the same folder with file name library.js, then include the file by using require function:

    const lib = require('./library'                                                                                                                                  

Exporting a library: There is a particular object in JavaScript called module.exports. When some program include or import this  program, this object will be manifested. consequently, all those functions that requirement to be exposed or need to be available so that it can used in some other file, defined in module.exports.

Example : Write two various programs and then glance how to use functions defined in the Module in given program. Define two simple functions in the library for calculating and printing area and perimeter of a rectangle when provided with length and width. Then export the functions so that other programs can onrush them .


<script>
// Area function
let area = function (length, breadth) {
let a = length * breadth;
console.log('Area of the rectangle is ' + a + ' square unit');
}

// Perimeter function
let perimeter = function (length, breadth) {
let p = 2 * (length + breadth);
console.log('Perimeter of the rectangle is ' + p + ' unit');
}

// Making all functions available in this
// module to exports that we have made
// so that we can import this module and
// use these functions whenever we want.
module.exports = {
area,
perimeter
}
</script>



Output:




Note: To run the script 1st create both files in the identical folder and then run script.js using NodeJs interpreter in terminal.


JavaScript | Object Methods

Introduction to Object Oriented Programming in JavaScript

JavaScript :The awing Scrip


JavaScript | Object Methods

JavaScript | Object Methods


Object ways in JavaScript may be accessed by mistreatment functions. Functions in JavaScript square measure hold on as property values. The objects may be referred to as while not mistreatment bracket ().

✪In a technique, ‘this’ refers to the owner object.
✪Additional data may be value-added together with the thing technique.

Syntax:


       objectName.methodName()         


Properties:

A function may be divided into different property values, which are then combined and returned together.

For Ex: Student function contains the properties:

✪name
✪class
✪section

Return Value: It returns methods/functions stored as object
properties.

<!DOCTYPE html>
<html>

<head>
<title>
JavaScript Object Methods
</title>
</head>

<body>
<h1>Sayed 360</h1>

<h3>JavaScript Object Method</h3>

<p>
studentDetail is a function definition,
it is stored as a property value.
</p>

<p id="sis"></p>

<script>

// Object creation
var student = {
name: "Sagor",
class : "12th",
section : "B",

studentDetails : function() {
return this.name + " " + this.class
+ " " + this.section + " ";
}
};

// Display object data
document.getElementById("sis").innerHTML
= student.studentDetails();
</script>
</body>

</html>

Output:


Example 2: This example use storing property values and accessing without bracket ().

<!DOCTYPE html>
<html>

<head>
<title>
JavaScript Object Methods
</title>
</head>

<body>
<h1>Sayed 360</h1>

<h3>JavaScript Object Method</h3>

<p>
studentDetail is a function definition,
it is stored as a property value.
</p>

<p>
Function definition is returned
if we don't use ().
</p>
<p id="sis"></p>

<script>

// Object creation
var student = {
name: "sagor",
class : "12th",
section : "A",

studentDetails : function() {
return this.name + " " + this.class
+ " " + this.section + " ";
}
};

// Display object data
document.getElementById("sis").innerHTML
= student.studentDetails;
</script>
</body>

</html>
Output:


Example 3: Using function definition as property value and accessing with additional details.



<!DOCTYPE html>
<html>

<head>
<title>
JavaScript Object Methods
</title>
</head>

<body>
<h1>Sayed360</h1>

<h3>JavaScript Object Method</h3>

<p>
studentDetail is a function definition,
it is stored as a property value.
</p>

<p id="sis"></p>

<script>

// Object creation
var student = {
name: "sagor",
class : "12th",
section : "A",

studentDetails : function() {
return this.name + " " + this.class
+ " " + this.section + " ";
}
};

// Display object data
document.getElementById("sis").innerHTML
= "STUDENT " + student.studentDetails();
</script>
</body>

</html>

Output:






Introduction to Object Oriented Programming in JavaScript


JavaScript :The awing Script


26 May 2019

Introduction to Object Oriented Programming in JavaScript

Introduction to Object Oriented Programming in JavaScript





Introduction to Object bound Programming in JavaScript
As JavaScript is wide employed in net Development, during this article we might explore a number of the article bound mechanism supported by JavaScript to urge most out of it. a number of the common interview question in JavaScript on OOPS includes,- “How Object-Oriented Programming is enforced in JavaScript? however they dissent from alternative languages? are you able to implement Inheritance in JavaScript then on…”

There square measure bound options or mechanisms that makes a Language Object bound like:


  • Object
  • Classes
  • Encapsulation
  • Inheritance

Let’s dive into the small print of every one in all them and see however they're enforced in JavaScript.

Object– associate Object could be a distinctive entity that contains property and ways. as an example “car” could be a world Object, that have some characteristics like color, type, model, HP and performs bound action like drive. The characteristics of associate Object square measure known as as Property, in Object bound Programming and therefore the actions square measure known as ways. associate Object is associate instance of a category. Objects square measure all over in JavaScript virtually each component is associate Object whether or not it's a perform,arrays and string.
Note: a way in javascript could be a property of associate object whose worth could be a perform.
Object will be created in 2 ways that in



    Using an Object Literal
//Defining object
let person = {
first_name:’SI’,
last_name: ‘Sayed’,

//method
getFunction : function(){
return (`The name of the person is
${person.first_name} ${person.last_name}`)
},
//object within object
phone_number : {
mobile:’12345′,
landline:’6789′
}
}

console.log(person.getFunction());
console.log(person.phone_number.landline);


Using Object.create() method: the thing.create() methodology creates a brand new object, exploitation associate degree existing object because the model of the new created object.
// Object.create() example a


// Defining class using es6
class Vehicle {
constructor(name, maker, engine) {
this.name = name;
this.maker = maker;
this.engine = engine;
}
getDetails(){
return (`The name of the bike is ${this.name}.`)
}
}
// Making object with the help of the constructor
let bike1 = new Vehicle(‘Hayabusa’, ‘Suzuki’, ‘1340cc’);
let bike2 = new Vehicle(‘Ninja’, ‘Kawasaki’, ‘998cc’);
console.log(bike1.name); // Hayabusa
console.log(bike2.maker); // Kawasaki
console.log(bike1.getDetails());


// Defining class in a Traditional Way.
function Vehicle(name,maker,engine){
this.name = name,
this.maker = maker,
this.engine = engine
};

Vehicle.prototype.getDetails = function(){
console.log('The name of the bike is '+ this.name);
}

let bike1 = new Vehicle('Hayabusa','Suzuki','1340cc');
let bike2 = new Vehicle('Ninja','Kawasaki','998cc');

console.log(bike1.name);
console.log(bike2.maker);
console.log(bike1.getDetails());

Encapsulation – the method of wrapping property and performance inside one unit is understood as encapsulation.
Let’s perceive encapsulation with associate degree example.
//encapsulation example



class person{
constructor(name,id){
this.name = name;
this.id = id;
}
add_Address(add){
this.add = add;
}
getDetails(){
console.log(`Name is ${this.name},Address is: ${this.add}`);
}
}
let person1 = new person(‘Mukul’,21);
person1.add_Address(‘Delhi’);
person1.getDetails();


In the higher than example we tend to merely produce associate person Object victimisation the creator and Initialize it property and use it functions we tend to aren't hassle regarding the implementation details. we tend to square measure operating with associate Objects interface while not considering the implementation details.
Sometimes encapsulation refers to concealing knowledge|of knowledge|of information} or data Abstraction which implies representing essential options concealing the background detail. Most of the OOP languages offer access modifiers to limit the scope of a variable, however their aren't any such access modifiers in JavaScript however their square measure bound method by that we will limit the scope of variable inside the Class/Object.



Example:

// Abstraction example
function person(fname,lname){
let firstname = fname;
let lastname = lname;
let getDetails_noaccess = function(){
return (`First name is: ${firstname} Last
name is: ${lastname}`);
}

this.getDetails_access = function(){
return (`First name is: ${firstname}, Last
name is: ${lastname}`);
}
}
let person1 = new person(‘Mukul’,’Latiyan’);
console.log(person1.firstname);
console.log(person1.getDetails_noaccess);
console.log(person1.getDetails_access());


In the on top of example we have a tendency to try and access some property(person1.firstname) and functions(person1.getDetails_noaccess) however it returns undefine whereas their may be a methodology that we are able to access from the person object(person1.getDetails_access()), by dynamic the thanks to outline a perform we are able to limit it


Inheritance – it's an inspiration within which some property associated strategies of an Object is being employed by another Object. in contrast to most of the OOP languages wherever categories inherit categories, JavaScript Object inherits Object i.e. bound options (property and methods)of one object will be reused by different Objects.
Lets’s perceive inheritance with example:



//Inhertiance example
class person{
constructor(name){
this.name = name;
}
//method to return the string
toString(){
return (`Name of person: ${this.name}`);
}
}
class student extends person{
constructor(name,id){
//super keyword to for calling above class constructor
super(name);
this.id = id;
}
toString(){
return (`${super.toString()},Student ID: ${this.id}`);
}
}
let student1 = new student(‘Mukul’,22);
console.log(student1.toString())


In the higher than example we have a tendency to outline AN Person Object with bound property and technique and so we have a tendency to inherit the Person Object within the Student Object and use all the property and technique of person Object furthermore outline bound property and ways for Student.
Note: The Person and Student object each have same technique i.e toString(), this can be referred to as as technique dominant. technique dominant permits technique in a very kid category to possess a similar name and technique signature as that of a parent category.
In the higher than code, super keyword is employed to refer immediate parent category instance variable.


Please write comments if you discover something incorrect, otherwise you need to share a lot of info regarding the subject mentioned higher than.


JavaScript :The awing Script

JavaScript :

The awing Script



Either you like it or hate it, however within the age of Microservice and REST API, you'll be able to not ignore JavaScript.
JavaScript was once upon a time used solely in consumer side(browser), however node js (execution engine/run time/web server) have created doable to run javascript on server aspect. JavaScript is all over – on Desktop/Server/Mobile.You can produce mobile internet app with javascript and html5, that has ton of benefits like save licensing price $99 yearly to pay Apple for creating IOS apps and you don’t have to be compelled to purchase macintosh portable computer to form your IOS app(Apple’s app will solely be created in MAC).

.JS

JavaScript has stormed the net technology and these days tiny package ventures to fortune five hundred, all ar victimization node js for internet apps. Recently wordpress.com has rewritten its dashboard in javascript, paypal additionally selected to rewrite a number of its parts in javascript. Be it google/twitter/facebook, javascript is vital for everybody. it's employed in applications like single page applications, Geolocation genus Apis, internet advertisements etc.
However JavaScript is quirky/dynamic/scripting/ purposeful destined language, and it's its own idiosyncrasies. it's not climbable, it's smart for a few 3000 line of code except for a much bigger app, it becomes troublesome to manage ,read and rectify. additionally not everyone seems to be greatly acquainted to JavaScript.

You might generally suppose that, I don't understand abundant of a JavaScript then “How to be JavaScript Developer while not abundant data of JavaScript?”

To ease down our work, some sensible developers/companies have created compiler/transpiler that convert your alternative language code into javascript code.(Best of each worlds)




C++: If you recognize C++, then it's doable to induce it born-again into JavaScript. Cheerp could be a free compiler for open supply business comes additionally as for closed supply non business comes.It is the C++ compiler for the net.You just write an internet application or port your existing one, all in C++. Cheerp can generate its JavaScript code that may run on any browser.

Java: Java could be a darling of open supply, backed by Oracle/IBM/Google/Red hat. most variety of developers within the world ar Java developers(around ten millions). most variety of comes in github and apache ar supported Java.

GWT could be a development toolkit for building and optimizing advanced browser-based application.
Its goal is to alter productive development of superior internet applications while not the developer having to be Associate in Nursing skilled in browser quirks, XMLHttpRequest, and JavaScript. It’s open supply, fully free, and utilized by thousands of developers round the world.
JSweet: A transpiler from Java to TypeScript/JavaScript It contains 1000+ well-typed JavaScript libraries offered from Java.
Kotlin :-Kotlin could be a statically-typed programing language that runs on the Java Virtual Machine and can also be compiled to JavaScript ASCII text file. in contrast to most programming languages, Kotlin language isn't created by domain or work however it's created by an expert company jetbrains.
Scala: mixture of object destined and purposeful approach. it's a static language, however is use as a dynamic language. several massive enterprises like LinkedIn, Twitter ar written in Scala. Again, you write code in scala and scala-js involves rescue and code gets