Category Archives: Javascript

JAVASCRIPT ES8

Javascript ES8

EcmaScript 8 or EcmaScript 2017 was officially released at the end of June by TC39. It seems that we are talking a lot about EcmaScript in the 2016. The standard is to publish a new ES specification version once a year. ES6 was published in 2015 and ES7 was published in 2016, but do someone remember when ES5 was released? It happened in 2009, before the magical rise of JavaScript. In this article we are going to discuss about ES8 and its new features. So, explore this article and know more about EcmaScript 8.

OBJECT.VALUES AND OBJECT.ENTRIES

The Object.values method returns an array of a given own object’s enumerable property values, in the same order as that provided on behalf of a loop. The declaration of the function is trivial.

Object.values(obj)

The obj parameter is the source object for the operation. It can be an object or an array.

const obj = { x: ‘xxx’, y: 1 };
Object.values(obj); // [‘xxx’, 1]

const obj = [‘e’, ‘s’, ‘8’]; // same as { 0: ‘e’, 1: ‘s’, 2: ‘8’ };
Object.values(obj); // [‘e’, ‘s’, ‘8’]

2

// when we use numeric keys, the values returned in a numerical
// order according to the keys
const obj = { 10: ‘xxx’, 1: ‘yyy’, 3: ‘zzz’ };
Object.values(obj); // [‘yyy’, ‘zzz’, ‘xxx’]

Object.values(‘es8′); // [‘e’, ‘s’, ‘8’]

The Object.entries method returns an array of a given object’s own enumerable property [key, value] pairs, in the same order as Object.values. The declaration of the function is trivial:

const obj = { x: ‘xxx’, y: 1 };
Object.entries(obj); // [[’x’, ‘xxx’], [’y’, 1]]

const obj = [’e’, ‘s’, ‘8’];
Object.entries(obj); // [[’0’, ‘e’], [’1’, ‘s’], [’2’, ‘8’]]

const obj = { 10: ‘xxx’, 1: ‘yyy’, 3: ‘zzz’ };
Object.entries(obj); // [[’1’, ‘yyy’], [’3’, ‘zzz’], [’10’, ‘xxx’]]

Object.entries(‘es8′); // [[‘0′, ‘e’], [‘1′, ‘s’], [‘2′, ‘8’]]
This section adds two functions to the String object i.e. padStart & padEnd.

As their names, the purpose of those functions is to pad the start or the end of the string, so that the resulting string reaches the given length. The user can pad the specific character or string or just pad with spaces by default. Below are the functions declaration.

str.padStart(targetLength [, padString])
str.padEnd(targetLength [, padString])

As we can see, the first parameter of the functions is the targetLength, that is the total length of the resulted string. The second parameter is optional padString that is for the string to pad the source string. The default value is space.

‘es8′.padStart(2); // ‘es8′
‘es8′.padStart(5); // ‘ es8′
‘es8′.padStart(6, ‘woof’); // ‘wooes8′
‘es8′.padStart(14, ‘wow’); // ‘wowwowwowwoes8′
‘es8′.padStart(7, ‘0’); // ‘0000es8′
‘es8’.padEnd(2); // ‘es8′
‘es8’.padEnd(5); // ‘es8 ‘
‘es8’.padEnd(6, ‘woof’); // ‘es8woo’
‘es8’.padEnd(14, ‘wow’); // ‘es8wowwowwowwo’
‘es8’.padEnd(7, ‘6’); // ‘es86666′

OBJECT.GETOWNPROPERTYDESCRIPTORS

EcmaSript lacks a method for properly copying properties between two objects. This proposal solves this seemingly simple but complex problem that has been implemented at times in almost every JS toolkit or framework. Currently it is a stumbling block for efficient immutability, true composition of ES Classes, something that would benefit Decorators, and just less surprising in general than Object.assign.

ASYNC FUNCTIONS

The async function declaration defines an asynchronous function, which returns an AsyncFunction object. Internally, async functions work much like generators, but they are not translated to generator functions.

function fetchTextByPromise() {
return new Promise(resolve => {
setTimeout(() => {
resolve(“es8″);
}, 2000);
});
}

async function sayHello() {
const externalFetchedText = await fetchTextByPromise();
console.log(`Hello, ${externalFetchedText}`); // Hello, es8
}

sayHello();

The call of sayHello will log Hello in es8 after 2 seconds.
console.log(1);
sayHello();
console.log(2);

async function
And now the prints are:
1 // immediately
2 // immediately
Hello, es8 // after 2 seconds

This is because the function call does not block the flow.

Pay attention that an async function always returns a promise and an expect keyword may only be used in functions marked with the async keyword.

SHARED MEMORY AND ATOMICS

When memory is shared, multiple threads can read and write the same data in memory. Atomic operations make sure that predictable values are written and read, that operations are completed before the next operation starts and that operations are not interrupted. This section introduces a new constructor SharedArrayBuffer and a namespace object atomics with static methods.

The atomic object is an object of static methods such as math, so we cannot use it as a constructor. Examples for static method in this object are:

add / sub— add / subtract a value for the value at a specific position.
and / or / xor — bitwise and / bitwise or / bitwise xor.
load — get the value at a specific position.

THE VERDICT

JavaScript is in production, but it is always getting improved. The process of adopting new features to the specification is very arranged and composed. In the previous stage, these features were confirmed by the TC39 committee and implemented by the core developers. Most of them are already parts of the Typescript language, browsers or other polyfills, so the user can go and try them right now.

WHAT IS JAVA SERVLET API?

What is Java Servlet API?

The Java Servlet API lets you define HTTP-specific classes. A servlet class extends the capabilities of servers that host applications that are accessed by way of a request-response programming model. Although servlets can respond to any type of request, they are commonly used to extend the applications hosted by web servers. For instance, you might use a servlet to get the text input from an online form and print it back to the screen in an HTML page and format, or you might use a different servlet to write the data to a file or database instead. A servlet runs on the server side — without an application GUI or HTML user interface (UI) of its own. Java Servlet extensions make many web applications possible.

IMPORTANCE OF CLIENT-SIDE JAVASCRIPT SECURITY

Importance of Client-Side JavaScript Security

Javascript is extensively used for several years ever since it was first developed. There are so many reasons in the bucket that why we need to use Javascript. Firstly, Javascript is so natural to learn and utilize. And another reason is, it has the wide accessibility to simple-to-join, open source libraries like jQuery, React.js, Backbone.js, Angular.js, and Ember.js.

To better understand of Javascript security, let’s explore in deep to outline and know why it has become the future wave in developer’s perspective

Javascript is everywhere

As we all know Javascript is incredibly powerful language. It is a high-level and interpreted programming language that has been widely used since its release. Javascript is world’s 11th most prominent programming language. It is commonly used in dynamic web pages to provide extended functionalities such as interactivity, animations, user activity, tracking and more. In order to do this, the Javascript is embedded in an HTML page, where it can interact with pages Document Object Model (DOM) to perform specific functions. In addition to its usage in web browser applications, Javascript is progressively used in mobile applications via cross-platform development tools like Titanium and PhoneGap, and in server-side code via frameworks like Node.js.

Javascript Security

Since its release, there have been several Javascript security issues that have gained outspread attention. The way javascript interacts with the DOM poses a risk for end users by enabling deleterious actors to deliver scripts over the web and run them on client computers. There are two measures that can be taken to contain this Javascript security risk. The first one is sandboxing, or running scripts separately so that they can only access certain resources and perform only specific tasks. Secondly, implementing the same origin policy, this prevents scripts from one site, accessing the data that is

Javascript is one of the most versatile and effective languages used to extend functionality in websites. However, it also possesses some negative effects that might make you think twice before implementing Javascript on your websites. Every programming language has its own advantages and disadvantages. Let us review some of its pros and cons.

Advantages :

Javascript is executed on the client side: The code is executed in the user’s processor rather in the web server, thus saving the bandwidth on the web server.

Extended functionalities to web pages: Third party ad-ons like Greasemonkey enable Javascript developers to write snippets, which can execute on desired web pages to enhance its functionality. If you are using a website and you wanted to add some certain features, you can write it by yourself and can use add-ons like Greasemonkey to implement it on the webpage.

Disadvantage:

Security Issues: Javascript snippets, once it is adjoined onto the web pages, it executes on the client server immediately and, therefore, can also be used to exploit the user’s system. While a cer tain restriction is set by modern web standards on browsers, the malicious code can be still execut ed by compiling with the restrictions set.

Javascript rendering varies: Different layout engines may render the Javascript differently, thus resulting in inconsistency in terms of functionality and interface. Though the latest versions of Java script and rendering have been regulated towards a universal standard, certain variations still exist.

Thus, the rise in the use of Javascript brings you with a great promise, but the combination of its interpreted nature and its increase use also opens the entryway to more risk. You need not to be scared off, as there is much you can do to reduce the risks for your business.

IN JAVASCRIPT, WHAT IS CALL() & APPLY() vs BIND()?

In Javascript, What is call() & apply() vs bind()?

Call attaches this into function and executes the function immediately. We need to list the arguments one-by-one (comma separated): person.hello.call(person, “world”);

Apply is similar to call except that it takes an array-like object instead of listing the arguments out one at a time:person.hello.apply(person, [ar1,ar2…]);

Bind attaches this into function and it needs to be invoked separately like this:var helloFunc = person.hello.bind(person);helloFunc(“world”);

THE OUTPUT OF THE FOLLOWING PROGRAM IS 1 4 3 2. WHY?

The output of the following program is 1 4 3 2. Why?

(function () {
console.log(1);
setTimeout(function(){console.log(2)}, 1000);
setTimeout(function(){console.log(3)}, 0);
console.log(4);
})();

Solution:
The browser has an event loop which checks the event queue and processes pending events. For example, if an event happens in the background (e.g., a script onload event) while the browser is busy (e.g., processing an onclick), the event gets appended to the queue. When the onclick handler is complete, the queue is checked and the event is then handled (e.g., the onload script is executed).
Similarly, setTimeout() also puts execution of its referenced function into the event queue if the browser is busy.
1 and 4 are displayed first since they are logged by simple calls to console.log() without any delay. 2 is displayed after 3 because 2 is being logged after a delay of 1000 msecs (i.e., 1 second) whereas 3 is being logged after a delay of 0 msecs.
When a value of zero is passed as the second argument to setTimeout(), it attempts to execute the specified function “as soon as possible”. Specifically, execution of the function is placed on the event queue to occur on the next timer tick. Note, though, that this is not immediate; the function is not executed until the next tick.
That’s why in the above example, the call to console.log(4) occurs before the call to console.log(3) (since the call to console.log(3) is invoked via setTimeout, so it is slightly delayed).

5 ESSENTIAL JAVASCRIPT TOOLS WORTH LEARNING

5 Essential Javascript Tools Worth Learning

javascript has rocketed into prominence as the symbol of new generation web technologies ruling tech world. Web developers rate Javascript as a critical component of HTML5 technologies along with JQuery and CSS. Javascript is ubiquitous and it is impossible to think of a web development arena without Javascript. It has been reported that Javascript is the most used language on GitHub..

As an article published in a web development journal succinctly put it, “Javascript is the number one language in the world. It’s the language of the web and a starting point for so many web developers”. JSON, Ajax, Angular.JS, BackboneJS and Node.js, are the most used Javascript concepts beyond any doubt of dispute.

JSON

JSON stands for Javascript Object Notation and it has become the major technical specification used in the web development arena. As JSON can be used with any programming language, its primary usage is for transmitting data between server and web application. JSON naturally becomes a best choice for web developers to connect to their applications to backend services (developed in Java or PHP or ASP.NET or similar). Mauritius Although JSON is derived from Javascript scripting language, it is a language independent data format. JSON’s basic types are Number, String, Boolean, Array, Object, and Null. It is the primary data format used for asynchronous browser or server communication largely replacing XML.

Ajax

Ajax is the acronym for Asynchronous Java and XML. AJAX helps to update a portion of the webpage without the need to refresh the whole page (for any data updates). It is the prominent technique of single page application. Objective of single page application is to build a website that fits on a single web page to provide a more fluid web experience. Implementation of Single Page Application is done using XMLHttpRequest object from Javascript. Ajax lets developers to write web applications to send and retrieve data from a server asynchronously and they can ensure that it is performed without causing interference to display existing page. AJAX supports various data types such as html,string,json and xml. There have been a number of developments in the technologies used in Ajax application ever since its inception.

Angular.JS

Angular.JS is an open source web development (MVC) framework built by the Internet giant and omnipotent Google. It was introduced for the purpose of simplification of application development and Angular.JS takes care of HTML’s inability to build dynamic views in web applications. With the help of Angular.JS, web development experts can extend HTML dimension for web application. Angular.JS collects data from server and compiles templates locally for presentation through client side MVC framework. Angular JS library works by first reading the HTML page which is embedded into additional custom tag attributes. According to information available from a Javascript analytics service provider, Angular JS is used by many major companies such as Verizon, Apple, Cisco, Etrade, ATT and more. One of the prominent features of AngularJS is two-way data binding which is missing in most of other JS-MVC frameworks.

Backbone.JS

Backbone.JS is an effective Javascript library equipped with JSON interface and it is based on the model view presenter. According to the description given in Backbone.JS website, “Backbone.js gives structure to web applications by providing models with key-value binding and custom events, collections with a rich API of enumerable functions, views with declarative event handling, and connects all to your existing API over a RESTful JSON interface”. Backbone.JS has gained huge popularity among web developer community because it is a robust and scalable platform for building web applications. Web applications of Digg, Foursquare, LinkedIn Mobile, Pandora Radio, and Pinterest are built with Backbone.JS. As Backbone.JS technology is dependent on one Javascript library, it is known for being light weight. It leads to more code and lean MVC framework for organizing Javascript application. Backbone.JS comes with models, collections, views, events, router, and other great features. In the context of Backbone.js, the model is a place where data is kept and the business logic is distributed between the views and main application’s file.

Node.Js

Node.js acts as the backbone of success of Javascript and it is a platform used for building fast network applications. Being based on Google’s V8 Javascript engine and Chrome browser runtime, Node.js has gained immense fame among web development aficionados. A unique feature of Node.js is that it contains a built-in library that allows applications to act as an independent web server. It is to be recalled that other prominent software platforms used for building network applications depend on Apache HTTP server and IIS. Node.js features an event-driven architecture (Software architecture pattern promoting the production and reaction to events) and non blocking I/O API. Web development projects of upcoming years will be based on the uniform web language of Node.js. Node.js can be run within the run time on OSX, Microsoft Windows, Linux, Free BSD and IBM-I. It has been reported that Node.JS is used by multinational corporations including PayPal, Microsoft, Yahoo as well as Walmart. When Node.js was invented in 2009, neither its developer Ryan Dahl nor others thought that it would become a stupendous hit among web developers.