Data Structure
Networking
RDBMS
Operating System
Java
MS Excel
iOS
HTML
CSS
Android
Python
C Programming
C++
C#
MongoDB
MySQL
Javascript
PHP
Following is the code for adding methods to JavaScript prototypes −Example Live Demo Document body { font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif; } .result { font-size: 20px; font-weight: 500; color: blueviolet; } Adding methods to Javascript Prototypes Click Here Click on the above button to call the methods of person1 and person2 object let resEle = document.querySelector(".result"); let BtnEle = document.querySelector(".Btn"); function personConstructor(fName, lName, birthYear) { this.fName ... Read More
Following is the code to sum nested object values in array using JavaScript −Example Live Demo Document body { font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif; } .result { font-size: 18px; font-weight: 500; color: rebeccapurple; } Sum of nested object values in Array CLICK HERE Click on the above button to sum the nested object values of json array let json = { storeData: [ { ... Read More
Functions created in JavaScript always have the prototype property added by the JavaScript engine to them. The prototype property is an object which contains the constructor property by default. The function protoype can be accessed by −functionName.prototypeWhen objects are creating using the function constructor, this prototype property can be used to share methods or properties between the objects created by that function constructor.Following is the code for function prototypes in JavaScript −Example Live Demo Document body { font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif; } .result { ... Read More
Anonymous functions are used to wrap code snippets, JavaScript libraries, functions etc to control their visibility and the namespace so that there shouldn’t be any conflict with other libraries code. IIFE (Immediately Invoked Function Expressions) are used for this purpose.Following is the code to implement Anonymous Wrapper Functions in JavaScript −Example Live Demo Document body { font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif; } .result { font-size: 20px; font-weight: 500; color: blueviolet; } Anonymous wrapper functions in JavaScript 0 let resEle = document.querySelector(".result"); (function () { resEle.innerHTML = "This piece of code is automatically executed as it is inside an IIFE"; })(); Output
Following is the code to implement private properties using closures in JavaScript −Example Live Demo Document body { font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif; } .result { font-size: 20px; font-weight: 500; color: blueviolet; } Private properties, using closures 0 CLICK HERE Click on the above button to increment the above counter using closures let BtnEle = document.querySelector(".Btn"); let resEle = document.querySelector(".result"); function test() { let a = 0; return function incrementA() { a++; return a; }; } let storeVal = test(); BtnEle.addEventListener("click", (event) => { resEle.innerHTML = storeVal(); }); OutputOn clicking the ‘CLICK HERE’ button the counter will increase on each click −
Following is the code using {} in javaScript imports −Example Live Demo Document body { font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif; } .result { font-size: 18px; font-weight: 500; color: rebeccapurple; } Using '{ }' in javascript imports CLICK HERE Click on the above button to execute the imported function script.jsimport {test, tellTime as showTime} from "./sample.js"; let resultEle = document.querySelector('.result'); document.querySelector('.Btn').addEventListener('click', ()=>{ resultEle.innerHTML+=test(); resultEle.innerHTML+=showTime(); })sample.jsfunction testImport() { return "Module ... Read More
The arrow functions should not be used as an object method because an arrow function does not have its own this. It takes this value of the enclosing lexical scope which is the window object instead of the object itself. This can cause problems as we would now be setting and accessing the window object properties instead of the intended object.Following is the code showing when should you not use JavaScript arrow functions −Example Live Demo Document body { font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif; } .result { ... Read More
Following is the code for importing an object with Sub objects and arrays in JavaScript −Example Live Demo Document body { font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif; } .result{ font-size: 18px; font-weight: 500; } Importing an Object with Sub Objects and Arrays let sampleEle = document.querySelector(".sample"); let obj = JSON.parse(sampleEle.innerHTML); script.jsimport obj from "./sample.js"; let resultEle = document.querySelector(".result"); for (let i in obj) { resultEle.innerHTML += "Property = " + i + " : Value = " + obj[i] + ""; }sample.jsexport default{ firstName: "Rohan", lastName: "Sharma", school: { name: "St Marks", address: "USA", }, sports: ["cricket", "football"], };OutputThe above code will produce the following output −
Following is the code for formatted strings using template strings in Javascript −Example Live Demo Document body { font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif; } .result, .sample { font-size: 20px; font-weight: 500; color: blueviolet; } .sample { color: red; } Formatted Strings Using Template Strings JavaScript `The person name is ${personObj.name}. His age and rollno are ${personObj.age} and ${personObj.rollno} respectively` CLICK HERE Click on the above ... Read More
Following is the code for to implement function Signatures with Default and Rest Parameters in JavaScript −Example Live Demo Document body { font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif; } .result { font-size: 20px; font-weight: 500; color: blueviolet; } Function Signatures with Default and Rest Parameters CLICK HERE Click on the above button to call the add() function with multiple parameters let BtnEle = document.querySelector(".Btn"); let resEle = document.querySelector(".result"); function add(a ... Read More