Javascript_notes
Javascript_notes
com/sudheerj/javascript-interview-questions"
// For Reactjs theory questions: https://github.com/sudheerj/reactjs-interview-questions/tree/master/.github/workflo
// For Google, Facebook, Microsoft coding challenges: https://youtube.com/c/KevinNaughtonJr
// Jest: https://github.com/sapegin/jest-cheat-sheet
// https://plainenglish.io/blog/50-javascript-output-questions
// https://github.com/priya42bagde/javascript-interview-questions?organization=priya42bagde&organization=priya4
// https://learnersbucket.com/javascript-sde-cheat-sheet/
// https://javascript.info/
// https://frontenddeveloperinterview.netlify.app/
===============================================================================================
Code 1: Remove Duplicate characters from String
function removeDuplicateCharacters() {
var string='priya riya supriya'
let result= string.split('').filter((item, index, arr)=> {
return arr.indexOf(item) == index;
}).join('');
return result;
}
console.log(removeDuplicateCharacters());
===============================================================================================
Code 2: Remove Duplicate characters from array of element and find the count of an elements using set object
var arr = [55, 44, 55,67,67,67,67,8,8,8,8,8,65,1,2,3,3,34,5];
var unique = [...new Set(arr)]
console.log(unique) //output: [55, 44, 67, 8, 65, 1, 2, 3, 34, 5]
console.log(unique.length) //output: 10
===============================================================================================
Code 3: Remove Duplicate characters from array of element using filter
var myArray = ['a', 1, 'a', 2, '1'];
var unique = myArray.filter((value, index, arr) => arr.indexOf(value) === index);
===============================================================================================
Code 4:String reverse without reversing of individual words (Array of elements can be reverse with reverse() method
and then join().
function removeDuplicates(){
var string ="India is my country"
let result = string.split('').reverse().join('').split(' ').reverse().join(' ')
return result
}
console.log(removeDuplicates())
output = "aidnI si ym yrtnuoc"
------------------------------------------
var reverseWords = function(s) {
let res = '';
let word = '';
for (let c of s) {
if (c === ' ') {
res += word + c;
word = '';
} else {
word = c + word;
}
}
return res + word;
};
console.log(reverseWords("priya bagde"))
===============================================================================================
Code 5:String reverse with reversing of individual words
function withoutReverse(){
var string ="India is my country"
let result = string.split('').reverse().join('')
return result
}
console.log(withoutReverse())
output = "yrtnuoc ym si aidnI"
===============================================================================================
Code 6:String reverse without using inbult function
function Reverse(){
var string ="India is my country";
var result="";
for( var i=string.length-1; i>=0 ; i-- ) {
result=result+string[i] }
return result
}
console.log(Reverse())
output = "yrtnuoc ym si aidnI"
===============================================================================================
Code 7: Find factorial of user input number
const number = parseInt(prompt('Enter a positive integer: '));
if (number < 0) { console.log('Error! Factorial for negative number does not exist.')}
else if (number === 0) { console.log(`The factorial is 1.`)}
else {
let fact = 1;
for (i = 1; i <= number; i++) {
fact *= i;
}
console.log(`The factorial is ${fact}.`);
}
===============================================================================================
Code 8:Anagram
function checkStringsAnagram() {
var a="Army";
var b="Mary"
let str1 = a.toLowerCase().split('').sort().join('');
let str2 = b.toLowerCase().split('').sort().join('');
if(str1 === str2){
console.log("True");
}
else {
console.log("False");
}
}
===============================================================================================
Code 9: Swapping of 2 numbers with third variable
let a=10;
let b=20;
let c;
c=a;
a=b;
b=c;
console.log (a,b,c)
===============================================================================================
Code 10: Swapping of 2 numbers without third variable
let a=10;
let b=20;
a=a+b //30
b=a-b //10
a=a-b //20
console.log (a,b)
===============================================================================================
Code 11: To check the string or number is palindrome or not( ex: 121,madam,anna) using reverse method
function checkPalindrome(){
const string = "anmna"
let arr= string.split('').reverse().join('')
//console.log(arr)
if (string==arr){
console.log("Palindrome")
}
else{
console.log("Not Palindrome")
}
}
checkPalindrome()
===============================================================================================
Code 12: To check the string or number is palindrome or not( ex: 121,madam,anna) using diving length by 2 and then
function checkPalindrome(){
const string = "12321"
let len = string.length;
for (i=0; i<len/2;i++){
if (string[i]!==string[len-1-i]){
console.log("Not Palindrome")
}
else{
console.log(" Palindrome")
}
}
}
checkPalindrome()
===============================================================================================
Code 13: To find longest word from a string using (for of) /*for(var i=0; i>=num; i++) means iterate by indexing*/ /*fo
by indexing*/
function longestWord(){
let string = "supriya is a masooooom good girl"
var words= string.split(' ')
var longest=" "
for(var word of words){
console.log(word)
if (word.length > longest.length)
{
longest=word;
}
}
return longest.length
}
longestWord()
---------------------------
function longestWord(){
let string = "supriya is a hahahahaha good girl"
var arr= string.split(' ')
var longest=" "
for(var i=0; i<arr.length; i++){
return arr
}
console.log(listFibonacci(4))
-----------------------------------------------------------------------
function listFibonacci(n) {
var arr = [0, 1]
for (var i = 0; i < n; i++)
arr.push(arr[i] + arr[i + 1])
return arr
}
console.log(listFibonacci(4))
===============================================================================================
Code 26: Finding a missing elements in an array and then add with existing elements. (-1 means if elements not foun
function missingElement(){
var a = [1,2,5]
var missing = [];
for (var i = 1; i <= 6; i++)
{
if (a.indexOf(i) == -1)
{
missing.push(i);
}
}
console.log(missing) //missing array
console.log(a.concat(missing).sort()); //actual+missing elements
}
missingElement()
===============================================================================================
Code 27: Find the missing no. in an array
function missing(arr) {
var x = 0;
for (var i = 0; i < arr.length; i++) {
x = x + 1;
if (arr[i] != x) {
return(x); //9
}
}
}
missing([1, 2, 3, 4, 5, 6, 7, 8, 10])
-------------------------------------------
function missing(arr) {
for (var i = 0, x=1; i < arr.length; x++,i++) {
if (arr[i] != x) { //index value comparing with pointer
return x; //9
}
}
}
console.log(missing([1, 2, 3, 4, 5, 6, 7, 8, 10]))
===============================================================================================
Code 28: Sorting of an string/character
function sorting(arr) {
return arr.sort()
}
console.log(sorting(["d","g","y","e","r","p"]))
===============================================================================================
Code 29: Sorting of an number
function sorting(arr) {
return arr.sort((a,b)=>{return a-b})
}
console.log(sorting([1,23,34,2,76,78])) //[1, 2, 23, 34, 76, 78]
===============================================================================================
Code 30: To check if given number is prime or not
function isPrime(num) {
if(num < 2) return false;
for (let k = 2; k < num; k++){
if( num % k == 0){ return false}
}
return true;
}
console.log(isPrime(17)) //true
===============================================================================================
Code 31: To print all the numbers from 2 to 100
for (let i = 2; i <= 100; i++) {
let flag = 0;
for (let j = 2; j < i; j++) {
if (i % j == 0) {
flag = 1;
break;
}
}
if (i > 1 && flag == 0) {
console.log(i);
}
}
--------------------------------------
for (let i = 2; i <= 100; i++)
{
let flag = 0;
for (let j = 2; j < i; j++) { //2<2 //2<3 //3<4
if (i % j == 0) {
flag = 1;
break;
}
}
if (i > 1 && flag == 0)
{
document.write(i+ "</br>");
}
}
===============================================================================================
Code 32: To find unique values from 2 arrays and keep into one array.
function uniqueElements(arr1,arr2){
let arr =[...arr1,...arr2];
let array =[...new Set(arr)]
console.log(array)
}
uniqueElements([1,2,3,4,4],[2,3,4,5,6])
===============================================================================================
Code 33: Find first duplicate element from an array
function firstDuplicate() {
let arr = [1,2,2,5,5];
let data = {};
for (var item of arr) {
if (data[item]) {
return item
} else {
data[item] = item
console.log(data[item])
}
}
return -1
}
console.log(firstDuplicate())
===============================================================================================
Code 34: Write a program that prints the numbers from 1 to 100. But for multiples of three, print "Fizz" instead of the
For numbers which are multiples of both three and five, print "FizzBuzz"
for (var i=1; i <= 20; i++)
{
if (i % 15 == 0)
console.log("FizzBuzz");
else if (i % 3 == 0)
console.log("Fizz");
else if (i % 5 == 0)
console.log("Buzz");
else
console.log(i);
}
===============================================================================================
Code 35: Uppercase of each first letter of a words
function upperCaseFirsstLetter(){
var string ="India is my country";
var words = string.toLowerCase().split(" ")
for( var i=0; i<words.length; i++) {
words[i]=words[i][0].toUpperCase() + words[i].slice(1) //slice is used here to give all the letters except first letter.
}
return words.join(" ")
}
console.log(upperCaseFirsstLetter())
===============================================================================================
Code 36: Uppercase of each first letter of a words using map function
function upperCaseFirsstLetter(){
var string ="India is my country";
var words = string.toLowerCase().split(" ").map((ele)=>{
return ele[0].toUpperCase() + ele.slice(1)
})
return words.join(" ")
}
console.log(upperCaseFirsstLetter())
===============================================================================================
Code 37: To check ending of the string with given character/s using inbuild function
function confirmEnding(str,target){
return str.endsWith(target) //true
}
console.log(confirmEnding("priya","a"))
===============================================================================================
Code 38: To check ending of the string with given character/s using custom
function confirmEnding(str,target){
//return str.substr(-target.length)===target
return str.substring(str.length-target.length)===target
}
console.log(confirmEnding("priya","a"))
===============================================================================================
Code 39: To find the largest elements from the 2 dimensional array
function largestFromArray(arr){
var max=[];
for(var i=0; i<arr.length;i++){
var tempMax =arr[i][0] //first elements of the 4 internal arrays i,e(1,5,45,89
for(var j=0; j<arr[i].length; j++){
var currElement = arr[i][j];
if(currElement>=tempMax){
tempMax = currElement
}
}
max.push(tempMax)
}
console.log(max)
return max;
}
largestFromArray([[1,2,3,4],[5,6,7,9],[45,76,2,1],[89,90,87,9]])
===============================================================================================
Code 40: To find the largest elements fro the 2 dimensional array in another way
function largestFromArray(arr){
var max=[0,0,0,0];
for(var i=0; i<arr.length;i++){
for(var j=0; j<arr[i].length; j++)
{
if(arr[i][j]>=max[i]){
max[i] = arr[i][j]
}
}
}
console.log(max)
return max;
}
largestFromArray([[1,2,3,4],[5,6,7,9],[45,76,2,1],[89,90,87,9]])
===============================================================================================
Code 41: Print string n times using inbuilt function
function repeatStrinNumTimes(str, num){
if (num<1) return ""
return str.repeat(num)
}
console.log(repeatStrinNumTimes("priya",3))
===============================================================================================
Code 42: Print string n times in custom way
function repeatStrinNumTimes(str, num){
var final="";
if(num<0) return ""
for(var i=0; i<num;i++)
{
final=final+str
}
return final
}
console.log(repeatStrinNumTimes("priya",3))
===============================================================================================
Code 43:Print string n times in custom way
function repeatStrinNumTimes(str, num){
if(num<0) return ""
if(num===1) return str
return str+ repeatStrinNumTimes(str, num-1)
}
console.log(repeatStrinNumTimes("priya",3))
===============================================================================================
Code 44: Truncate the string
function truncateString(str, num){
if(num<=3) return str.slice(0,num)
return str.slice(0,num-3)+"..." //retuen only 4 digits thats why subtracted from 3
}
console.log(truncateString("priyabagde",2)) //pr
console.log(truncateString("priyabagde",4)) //p... //retuen only 4 digits
===============================================================================================
Code 45: Converting one dimensional array into n dimensional array using slice
function chunkArrayInGroup(arr, size){
var group=[]
while(arr.length>0){
group.push(arr.slice(0, size))
arr = arr.slice(size)
}
return group
}
console.log (chunkArrayInGroup(['a','b','c','d'],2)) //[["a", "b"], ["c", "d"]]
===============================================================================================
Code 46: Converting one dimensional array into n dimensional array using splice
function chunkArrayInGroup(arr, size){
var group=[]
while(arr.length>0){
group.push(arr.splice(0, size))
}
return group
}
console.log (chunkArrayInGroup(['a','b','c','d'],2)) //[["a", "b"], ["c", "d"]]
===============================================================================================
Code 47: To find only truthy values
function removeFalseValue(arr){
var trueth = []
for (var item of arr){
if(item){
trueth.push(item)
}
}
return trueth
}
console.log(removeFalseValue(["priya", 0 ,"", false, null,undefined, "ate", Nan ,9 ])) //["priya","ate",9]
===============================================================================================
Code 49: To find only truthy values using filter
function removeFalseValue(arr){
return arr.filter((item)=>{
return item})
}
console.log(removeFalseValue(["priya", 0 ,"", false, null,undefined, "ate", 9 ]))
===============================================================================================
Code 50: Checking all letters of second words should present in first word, in the same order using include function
function characterPresent(arr){
var first = arr[0].toLowerCase()
var second = arr[1].toLowerCase()
for (var letter of second){
if(!first.includes(letter)){
return false
}
}
return true
}
console.log(characterPresent(["hello","hey"]))
===============================================================================================
Code 51: Checking all letters of second words should present in first word, in the same order using indexOf without i
function characterPresent(arr){
var first = arr[0].toLowerCase()
var second = arr[1].toLowerCase()
for (var letter of second){
if(first.indexOf(letter)== -1){ //-1 means not found in array
return false
}
}
return true
}
console.log(characterPresent(["hello","he"]))
---------------------------------------------------
function characterPresent(arr){
var first = arr[0].toLowerCase()
var second = arr[1].toLowerCase()
for (var i=0; i<second.length; i++){
if(!first.includes(second[i])){ //-1 means not found in array
return false
}
}
return true
}
console.log(characterPresent(["hello","he"]))
===============================================================================================
Code 52: Checking all letters of second words should present in first word, in the same order using indexOf with inde
function characterPresent(arr){
var first = arr[0].toLowerCase()
var second = arr[1].toLowerCase()
for (var i=0; i<second.length; i++){
if(first.indexOf(second)== -1){ //-1 means not found in array
return false
}
}
return true
}
console.log(characterPresent(["hello","he"]))
===============================================================================================
Code 53: Unique values only from 2 arrays
function diffArrayElement(arr1, arr2){
var result =[]
for(var i=0; i<arr1.length; i++){
if(arr2.indexOf(arr1[i]) === -1){
result.push(arr1[i])
}
}
for(var j=0; j<arr2.length; j++){
if(arr1.indexOf(arr2[j]) === -1){
result.push(arr2[j])
}
}
return result
}
console.log(diffArrayElement([1,2,3,4], [2,3,4,5])) //[1,5]
===============================================================================================
Code 54: Unique values only from 2 arrays
function diffArrayElement(arr1, arr2){
var combine = arr1.concat(arr2)
return combine.filter( (num)=>{
if(arr1.indexOf(num)== -1 || arr2.indexOf(num)== -1 ) return num
})
}
console.log(diffArrayElement([1,2,3,4], [2,3,4,5])) [1,5]
===============================================================================================
Code 55: Remove Duplicates from 2 arrays using Set
function uniquefromArrays(arr1, arr2){
let arr = [...arr1, ...arr2]
let unique = [...new Set(arr)];
return unique
}
console.log(uniquefromArrays([1,2,3,4], [2,3,4,5])) //[1,2,3,4,5]
===============================================================================================
code 56: Sum of all numbers from start to end given number
function sumFromStartToEnd(arr){
var start = Math.min(arr[0], arr[1])
var end = Math.max(arr[0], arr[1])
sum =0
for(var i= start; i<=end; i++){
sum+=i
}
return sum
}
console.log(sumFromStartToEnd([1,4]))
===============================================================================================
code 57: Remove or Delete elements from an array using various ways
Way 1: Removing Elements from End of a JavaScript Array
var ar = [1, 2, 3, 4, 5, 6];
ar.length = 4; // set length to remove elements
console.log( ar ); // [1, 2, 3, 4]
OR
result = result.concat(tmp.reverse());
console.log("temp", temp) //[9, 5]
console.log("res5", result) //[1, 2, 3, 4, 8, 12, 16, 15, 14, 13, 9, 5]
console.log("in5", input) //[[6, 7], [10, 11]]
OR
const sum = (a) => (b) => (c) => (d) => a+b+c+d // using ES6
console.log(sum(1)(2)(3)(4))
===============================================================================================
Code 60: Find SUM, PRODUCT AND AVERAGE of the numbers //accumulation means collection
let arr=[1,2,3,4,5]
let sum = arr.reduce((accum, curr) =>{
return accum + curr;
})
console.log(sum) //15
OR
OR
const arr = [
['a','b'],
['c','d'],
['e',['f','g']],
]
console.log(arr.flat(2)) //["a", "b", "c", "d", "e", "f"] //bydefault 1 hota h as a argument
OR
const arr = [
['a','b'],
['c','d'],
['e',['f',['g','h']]],
]
console.log(arr.flat(3)) //["a", "b", "c", "d", "e", "f", "g", "h"]
===============================================================================================
code 62: Reverse of a number using converting into string
function reverseNumber(input){
return(
parseFloat(input.toString().split('').reverse().join(''))*Math.sign(input)
)
}
console.log(reverseNumber(123)) //321
===============================================================================================
code 63: Reverse of a nuber
function reverseNumber(input){
var result=0;
while(input!=0){ //123 //12 //1
result = result *10; //0*10=0 //3*10=30 // 32*10 =320
result = result + (input%10) //give reminder // 0+3=3 // 30+2=32 //320+1=321
input = Math.floor(input/10) //12 //1
// console.log("in", input)
}
return result
}
console.log(reverseNumber(123)) //321
===============================================================================================
code 64: Check Armstrong Number
function CheckArmstrongNum(num){ //153
var temp = num;
var result =0;
var a;
while(temp>0){ //153 //15 //1
a= temp%10; //3 //5 //1
temp= parseInt(temp/10) //15 // 1
result= result+a*a*a //0+3*3*3 // 27+ 5*5*5 // 27+ 5*5*5 +1*1*1
}
if(result==num){
return true
}
return false
}
console.log(CheckArmstrongNum(153)) //3*3*3 + 5*5*5 + 1*1*1
===============================================================================================
code 65: To find the closest number in an array
const needle = 5;
const numbers = [1, 10, 7, 2, 4, 9];
numbers.sort((a, b) => {
return Math.abs(needle - a) - Math.abs(needle - b);
})
console.log(numbers[0]);
===============================================================================================
code 66: To find the second largest number
function secondLargestNum(arr){
return arr.sort((a, b)=> b - a )[1]
}
console.log(secondLargestNum(['1', '2', '3', '4', '9']))
===============================================================================================
code 67: To check whether particular word/number present in sentence or not using inbuilt function
function wordInSentence(str){
return str.includes("world"); //true
}
console.log(wordInSentence("Hello world, welcome to the universe."))
OR
var nums =[0,1,3,5,6,7,8,9,7]
console.log(nums.includes(9)) //true
OR
var item=3
console.log(nums.some(x => x === item)) //true
===============================================================================================
code 68: To check whether particular word/number present in sentence or not using custom function
function checkValueExist(arr, item){
var status = "Not Exist"
for(var i=0; i<arr.length; i++){
if(arr[i]===item){
status = "Exist"
break;
}
}
return status
}
console.log(checkValueExist(['priya', 'riya', 'supriya'], 'priya'))
===============================================================================================
code 69: To check wheather property exist or not in object
let student ={
name : "priya",
age: 20
}
console.log('name' in student)
OR
console.log(student.hasOwnProperty('name'))
===============================================================================================
code 70: To dlete the property of an object
let student ={
name : "priya",
age: 20,
city: "pune"
}
delete student.age;
console.log(student)
OR
delete student['name']
console.log(student)
===============================================================================================
code 71: To find the length of the array in custom way
function findLength(arr){
var len =0;
while(arr[len]!==undefined){
len++
}
return len;
}
console.log(findLength([50,60,70,80,90]))
OR
function findLength(arr){
return arr.length;
}
console.log(findLength([50,60,70,80,90]))
===============================================================================================
code 72: Star Pattern
for(var i=1; i<=5;i++){ //use to create new row
for(var j=i; j<=5; j++){ //use to add in existing row
document.write("*")
}
document.write("<br/>")
}
*****
****
***
**
*
===============================================================================================
code 73: Star Pattern
for(var i=1; i<=5;i++){ //use to create new row
for(var j=1; j<=5; j++){ //use to add in existing row
document.write("*")
}
document.write("<br/>")
}
*****
*****
*****
*****
*****
===============================================================================================
code 74: Star Pattern
for(var i=1; i<=5;i++){ //use to create new row
for(var j=i; j<=5; j++){ //use to add in existing row
document.write(i)
}
document.write("<br/>")
}
11111
2222
333
44
5
===============================================================================================
code 75: Star Pattern
for(var i=1; i<=5;i++){ //use to create new row
for(var j=i; j<=5; j++){ //use to add in existing row
document.write(j)
}
document.write("<br/>")
}
12345
2345
345
45
5
===============================================================================================
code 76: Star Pattern
for(var i=1; i<=5;i++){ //use to create new row
for(var j=1; j<=i; j++){ //use to add in existing row
document.write("*")
}
document.write("<br/>")
}
*
**
***
****
*****
===============================================================================================
code 77: To find the square root
var num = [4, 9, 16, 25, 36]
var result = num.map(Math.sqrt)
console.log(result) //[2,3,4,5,6]
===============================================================================================
code 78: Make alternate character to upper case
function alternateText(str){
var char = str.toLowerCase().split('')
for(var i=0; i <char.length; i=i+2){
char[i]=char[i].toUpperCase()
}
return char.join('')
}
console.log(alternateText("Priya Bagde")) //"PrIyA BaGdE"
OR
let alt = "Priya Bagde"
alt = alt.split("")
.map((letter,index)=>(index%2)==0 ? letter.toUpperCase(): letter.toLowerCase())
.join("")
console.log(alt) //"PrIyA BaGdE"
===============================================================================================
code 79: To find the negative values in an array or 2D Array
function countNegative(arr){
let count = 0;
for(let i=0;i<arr.length; i++){
for(let j=0; j<arr[i].length; j++){
if(arr[i][j]<0){
count++
}
}
}
return count;
}
console.log(countNegative([[1,-1],[-1,-1]]))
===============================================================================================
code 80: Find first repeating character with its index from an array
function firstRepeatingIndex(arr){
let count = {};
for(let i=0;i<arr.length; i++){
if(count[arr[i]])
{
console.log("character", arr[i])
console.log("index", count[arr[i]])
return count[arr[i]] //if exist
}
else
{
count[arr[i]]=i //if not exist keep at count
}
console.log("count", count)
}
return count
}
firstRepeatingIndex([1,0,2,3,4,4,5,7,7])
===============================================================================================
code 81: To find all the subsets of the set
function generateSubsets (arr) { //[1,2]
let subsets = [];
for (const item of arr)
{
const tempSubsets = [...subsets];
console.log("tempSubsets",tempSubsets) //[]//[[1]]
for (const currSubset of tempSubsets)
{
subsets.push([...currSubset, item]);
console.log("subsets",subsets) //not came//[[1], [1,2]]
}
subsets.push([item]);
console.log("subsets1",subsets) //[[1]]//[[1], [1,2],[2]]
}
subsets.push([]);
console.log("subsets2",subsets) //[[1], [1, 2], [2], []]
return subsets;
}
generateSubsets([1, 2]);
OR
function generateSubsets (arr) {
let subsets = [];
for (const item of arr) //[1,2]
{
const tempSubsets = [...subsets];//[]//[[1]]
for (const currSubset of tempSubsets)
{
subsets.push([...currSubset, item]);//not came//[[1], [1,2]]
}
subsets.push([item]); //[[1]]//[[1], [1,2],[2]]
}
subsets.push([]);//[[1], [1, 2], [2], []]
return subsets;
}
generateSubsets([1, 2]);
OR
function findAllSubsetsoOfGivenSet(arr)
{
var result= arr.reduce((subsets, value) => subsets.concat(subsets.map(set => [value,...set])),
[[]]) //[[]] is used to pass initial value
return result
}
console.log(findAllSubsetsoOfGivenSet([8,9]));
--------------------------------------------------------
function findAllSubsets(arr){
var result = []
for(var item of arr){
let tempSub = [...result]
for(var curr of tempSub){
result.push([...curr, item])
}
result.push([item])
}
result.push([])
return result
}
console.log(findAllSubsets([1,2]))
===============================================================================================
Code 82: To find the maximum repetation of the character in a string
function maxRepeating(str)
{
let count = 0;
let character = str[0];
for (let i=0; i<str.length; i++)
{
let tempCount = 1;
for (let j=i+1; j<str.length; j++)
{
if (str[i] == str[j]) //if a is equal to a
tempCount++; //use to find out the counts of character i.e a
}
if (tempCount > count)
{
count = tempCount;
character = str[i];
}
}
console.log(count, character)
return character;
}
maxRepeating("aaaabbaaccccccccccccccccccde");
===============================================================================================
Code 83: To find all the missing numbers from an array
function MissingElements(arr)
{
for(let i = 0; i < arr.length; i++)
{
if (arr[i] - i != arr[0]) //1-0==1 //2-1==1 //6-2!=1 //checking for consecutive numbers
{
while (arr[0] < arr[i] - i)//1<4 //2<4 //3<4 //finding missing numbers
{
console.log(i + arr[0]);//2+1 //3+1 //3+1
arr[0]++; //2 //3 //4
}
}
}
}
MissingElements([1,2,6]); //3,4,5
---------------------------------------------
function MissingElements(arr)
{
for(let i = 0; i < arr.length; i++)
{
if (arr[0] != arr[i] - i)
{
while (arr[0] < arr[i] - i)
{
console.log(arr[0]+i);
arr[0]++;
}
}
}
}
MissingElements([1,2,6])
===============================================================================================
Code 84: Adding an elements to the array when elements are consecutive numbers
const as = [1,2,3,4];
for (let index = 5; index <= 10; ++index) {
as.push(index);
}
console.log(as); //[1, 2, 3, 4, 5, 6, 7, 8, 9, 10]
===============================================================================================
Code 85: Create a new array by adding one to each elements of the existing array
function plusOne(arr){
var output=[]
for (let i = 0; i < arr.length; ++i) {
output.push(arr[i]+1);
}
return output
}
console.log(plusOne([1,2,3,4]));
===============================================================================================
Code 86: To find kth smallest or largest element in an array
function findKthSmallestOrLargest(arr, num) {
arr.sort(function(a, b) { return a - b});
console.log(arr)
console.log("kth smallest", arr[num- 1]) //kth smallest
console.log("kth largest", arr[arr.length-num]) //kth smallest
};
console.log(findKthSmallestOrLargest([2,1,4,3,6,5,7], 3)); //kth is 3rd //3,5
===============================================================================================
Code 87: sort by frequency of the letters
function frequencySort(str) {
let map = {}
for (const letter of str) {
map[letter] = (map[letter] || 0) + 1; //to count the occurance
};
console.log(map) //{a: 2,A: 2,b: 3,B: 3,c: 1,C: 1}
let res = "";
let sorted = Object.keys(map).sort((a, b) => map[b] - map[a])
console.log("sorted", sorted)// ["b", "B", "a", "A", "c", "C"]
for (let letter of sorted) {
for (let count = 0; count < map[letter]; count++) {
res += letter
console.log(res)
}
}
return res;
};
console.log(frequencySort("cCaaAAbbbBBB")); //"bbbBBBaaAAcC"
-------------------------------------------------------------------
function frequencySort(str) {
let map = {}, res = "", sortedArr;
for (const letter of str)map[letter]=(map[letter] || 0) + 1;
sortedArr = Object.keys(map).sort((a, b) => map[b] - map[a]);
for (let letter of sortedArr) {
for (let count = 0; count < map[letter]; count++) {
res += letter
}
}
return res;
};
console.log(frequencySort("cCaaAAbbbBBB"));
===============================================================================================
Code 88: To find the OCCURANCE of the character
function frequencySort(str) {
let map = {}
for (var i=0; i<str.length; i++)
{
map[str[i]] = map[str[i]] ? map[str[i]]+1 : 1; //Adding an element to the object, if already present then incrementin
}
console.log(map)////{"c":1, "C:1", "a":2, "A":2, "b":3, "B":3}
};
frequencySort("cCaaAAbbbBBB");
OR
function frequencySortArr(arr) {
let map = {}
arr.forEach((element)=>{map[element] = map[element]+1 || 1 }) // will get occurance of the number
return [...arr].sort((a,b)=> map[b]-map[a])
};
console.log(frequencySortArr([2,5,67,89,2,3,4,4,4])); //[4,4,4,2,2,5,67,89,3]
===============================================================================================
Code 89: Permutation // Need to debug
let perm= (str, result)=> {
if(str.length==0){console.log("result", result)} //let //lte //elt //etl //tle //tel
===============================================================================================
===============================================================================================
===============================================================================================
===============================================================================================
Code : JAVASCRIPT slice concept i.e, it doesn't change the original array
var sentence ="I'm priya and having sounds kowledge."
console.log(sentence.slice(0,5)) //"I'm p"
console.log(sentence.slice(2,5)) //"m p"
console.log(sentence.slice(2)) //"m priya and having sounds kowledge."
console.log(sentence.slice(4)) //"priya and having sounds kowledge."
console.log(sentence.slice(-4)) //"dge."
console.log(sentence.slice(-5)) //"edge."
1. Closures-
A closure is the combination of a function and the lexical environment within which that function was declared.
OR
When inner function can have access to the outer function variables and parameter.
The return statement does not execute the inner function - function is only executed only when followed by ()parath
body of the function.
Uses/advantages of closures:
-event handlers
-callback functions
-Encapsulation: can store data in separate store
-Object data privacy
-Module Design Pattern
-Currying
-Functions like once
-memoize
-setTimeouts
-Iterators
-maintaining state in async world
Disadvantages of closures:
1. Creating function inside a function leads to duplicate in memory and cause slowing down the application means u
2. As long as the clousers are active, the memory can't be garbage collected means if we are using clousers in ten pla
it hold the memory and can overcome to set closure to Null.
1. Javascript is a prototype based language, so, whenever we are creating a function using javascript, javascript engin
Prototype property is basically an object (also known as Prototype object), where we can attach methods and proper
other objects to inherit these methods and properties.
2. We are creating prototype in constructor function. All the intances of objects can able to access properties and me
3. The prototype is an object that is associated with every functions and objects by default in JavaScript, where functi
modifiable and object's prototype property (aka attribute) is not visible.
4. object's prototype property is invisible. Use Object.getPrototypeOf(obj) method instead of __proto__ to access prot
5. prototype is useful in keeping only one copy of functions for all the objects (instances).
6. An Object has a prototype. A prototype is also an object. Hence Even it may have its own prototype object. This is r
<A>Several Types:
1. Object.prototype- It is a prototype OBJECT of object(cunstruction function where it will inherit all properties of Obj
Prototype Object of Object.prototype is NULL.
2. Array.prototype-Prototype Object of Array.prototype is Object.prototype and Prototype Object of Object.prototype
3. Function.prototype
4. Example-
var person = function(name){
this.name = name;
}
person.prototype.age = 21;
var piya = new person("Piya");
var priya = new person("Priya");
console.log(piya.age) //21
console.log(priya.age) //21
<B>Purpose/Use of prototype:
1) to find properties and methods of an object
2) to implement inheritance in JavaScript
===============================================================================================
CSS Positions:
1. Static: HTML elements are positioned static by default. Static positioned elements are not affected by the top, bott
Imapct of margin or padding. Object can't move. it is always positioned according to the normal flow of the page.
2. Relative: Object can move. It is positioned relative to its normal position. If want gap from its actual placed position
right, top, bottom properties.
3. Fixed: Not allow to scroll up or down. is positioned relative to the viewport, which means it always stays in the sam
The top, right, bottom, and left properties are used to position the element. The element is positioned relative to th
4. Absolute: it is work with relative i.e, w.r.t parent. It is positioned relative to the nearest positioned ancestor (instea
viewport, like fixed). if an absolute positioned element has no positioned ancestors, it uses the document body, an
5. Sticky: An element with position: sticky; is positioned based on the user's scroll position. Internet Explorer does no
You must also specify at least one of top, right, bottom or left for sticky positioning to work. Use for to create menu
===============================================================================================
Time based Event:
SetTimeout:
1. allows us to run a FUNCTION ONCE, after the interval of time
2. setTimeout() executes the passed function after given time. The id_value returned by setTimeout() function is store
it’s passed into the clearTimeout() function to clear the timer.
3. Syntax- let timerId = setTimeout(function, milliseconds, [arg1], [arg2], ...)
4. Don't make a mistake by adding brackets () after the function otherwise gives undefined and nothing will schedule
5. Example-
let timerId = function sayHi(phrase, who) {
console.log( phrase + who );
}
setTimeout(sayHi, 1000, "Hello", "John");
SetInterval:
1. allows us to run a function repeatedly, starting after the interval of time, then repeating continuously at that interv
2. setInterval() executes the passed function for the given time interval. The number id value returned by setInterval(
in a variable and it’s passed into the clearInterval() function to clear the interval.
3. Syntax-
4. Example
let timerId = function sayHi(phrase, who) {
console.log( phrase + who );
}
setInterval(sayHi, 1000, "Hello", "John");
ClearTimeout:
1. This method is used to cancel a setTimeout(). Inside the method you have to reference the timeoutID.
clearTimeout(timerId)
ClearInterval:
1. This method is used to cancel a setInterval(). Inside the method you have to reference the intervalID.
clearInterval(timerId)
===============================================================================================
Debouncing and Throttling in JavaScript: using in search box, scrolling or resize the widow size
1. Create impact on performance of your website, but also prevent unnecessary API calls and load on the server.
2. Debouncing and throttling techniques are used to limit the number of times a function can execute. ke button clic
and window resize allow the user to decide when to execute.
3. The main difference between throttling and debouncing is that throttling executes the function at a regular interva
after some cooling period.
4. Example: If you're scrolling, throttle will slowly call your function while you scroll (every X milliseconds). Debounce
to call your function.
Throttling-
Throttling is a technique in which, no matter how many times the user fires the event, the attached function will be e
Debouncing-
No matter how many times the user fires the event, the attached function will be executed only after the specified tim
The Debounce technique allow us to “group” multiple sequential calls in a single one.
var debounced_version = _.debounce(doSomething, 200);
$(window).on('scroll', debounced_version);
debounced_version.cancel();
===============================================================================================
CALL, APPLY and BIND method: These methods allow us to write a function once and invoke it in a different context.
and the difference is in the function invocation. Call and apply are pretty interchangeable. Just decide whether it’s ea
list of arguments. I always remember which one is which by remembering that Call is for comma (separated list) and
It returns a new function. Call and Apply execute the current function immediately. The main concept behind all this
CALL:
1. It is predefined javascript method.
2. An object can use a method belonging to another object.
3. Call invokes the function and allows you to pass in arguments one by one.
APPLY:
1. Apply invokes the function and allows you to pass in arguments as an array.
BIND:
1. We can bind an object to a common function, so that the function gives different results when its need.
2. It takes an object as an first argument and creates a new function.
Example1:
const people={
fullName: function(){
return this.firstName+" "+this.lastName;
}
}
const person1={
firstName: "Priya",
lastName:"Bagde"
}
console.log(people.fullName.call(person1)); //Priya Bagde
console.log(people.fullName.apply(person1)); //Priya Bagde
let bound = people.fullName.bind(person1)
console.log(bound()) //Priya Bagde
Example2:
const obj = {name:"Priya"}
let greeting = function(a,b){
return a+" "+this.name+" "+b;
}
console.log(greeting.call(obj, "Hello", "How are you?"));
console.log(greeting.apply(obj, ["Hello", "How are you?"]));
let test=greeting.bind(obj);
console.log(test("Hello", "How are you?"))
===============================================================================================
Hoisting:
1. To move all of the variable and function declarations at the top of the current scope.
2. Hoisting is JavaScript's default behavior of moving declarations to the top.
3. A variable can be used before it has been declared.
4. Note: JavaScript only hoists declarations, not the initializations.
5. JavaScript allocates memory for all variables and functions defined in the program before execution.
6. Due to the concept of hoisting in JavaScript, we can call a function even before we define the function definition in
7. Variables defined with let and const are hoisted to the top of the block, but not initialized.Let and const are also ho
until they are assigned because they are in Temporal dead zone.To avoid Temporal deadzone we need to declare let
***when const gets hoisted it will be defined undefined,and further processing will get assigned the value , this viola
const doesn't get hoisted and let just got tagged along with this feature.
-- Can able to access variable and function before initialise. Can able to access it without any error.
-- console.log(getName); without parenthisis -- print the body of function.
-- if we remove var x=7 then it will get as refrennce error: x is not defined because x is not present at all and we are t
-- with arrow and function expression
-- callstack
-- console.log(greetingName) //print the body of a function
JavaScript Hoisting refers to the process whereby the interpreter appears to move the declaration of functions, varia
before execution of the code.
This is a complete textbook type definition (thanks to MDN Docs for this), but what does it mean in simple words.
Hoisting simply means that we can access variables, before their initialisation & functions, before their declaration.
it gives us an advantage that no matter where functions and variables are declared, they are moved to the top of the
regardless of whether their scope is global or local
Examples:
1. Hoisting Function: If i write below code then JS compiler auto move declaration first then call of a function.
hello() //call
function hello(){ //declaration
console.log("Hello world")
}
3. Let/const Hoising:
let x=7; //declaration and assignment
console.log(x) //call //7
-------------
const x; //declaration
console.log(x) //call //Missing initializer in const declaration
x=7; //assignment
-------------------------------------------------------------------------------------
Hoisting:
var x = 1;
function greeting(){
console.log("Hi greeting");
}
console.log(x); //1
greeting(); //Hi greeting
greeting1(); //Hey greeting1
greeting2(); //Hello greeting2
-----------------------------------------------------------------------
console.log(x); //undefined //1
greeting(); //function body will assign before executing //Hi greeting- as output post execution
//greeting1(); //Uncaught TypeError: greeting1 is not a function because its treeting like a variable not a function, so r
y default.
//greeting2(); ////Uncaught TypeError: greeting1 is not a function because its treeting like a variable not a function, so
by default.
var x = 1;
function greeting(){
console.log("Hi greeting");
}
Window:
1. Javascript engine create global context execution and allocate some memory space. It is a big object with lot of me
by JS engine.
2. Window is the main JavaScript object root, aka the global object in a browser, and it can also be treated as the roo
3. window.document or just document is the main object of the potentially visible (or better yet: rendered) documen
4. window is the global object, you can reference any properties of it with just the property name - so you do not hav
.
5. window.document.getElementById("header") is the same as document.getElementById("header").
This:
1. At global level THIS points to the window.
2. With Window object THIS variable is created by default.
3. This === window //true
Example:
var a=10;
function b(){
var x=10;
}
console.log(window.a); //10
console.log(a); //10
console.log(this.a); //10
===============================================================================================
Even Propogation an STOP Propogation: Bydefault event capturing happen first and then even bubbling happen.
Event Bubbling:
1. When an event happens on an element, it first runs the handlers on it, then on its parent, then all the way up on o
first captured and handled by the innermost element and then propagated to outer elements.
2. Bydefault event bubbling execute. To run event bubbling required to mention 3rd argument as FALSE or nothing.
3. "child clicked"
"parent clicked"
"grandparent clicked"
4. Drawback: Bubbling not occur at blur, focus, resizing of window etc.
Example:
html-
<div id="grandparent">
<div id="parent">
<div id="child">
</div>
</div>
</div>
css-
div{
min-width: 10px;
min-height: 10px;
border: 1px solid red;
padding: 30px;
}
js-
for bubbling:
document.querySelector("#grandparent").addEventListener("click",()=> {console.log("grandparent clicked")}, false); o
,()=> {console.log("grandparent clicked")});
document.querySelector("#parent").addEventListener("click",()=> {console.log("parent clicked")}, false); or document.
log("parent clicked")});
document.querySelector("#child").addEventListener("click",()=> {console.log("child clicked")}, false); or document.que
("child clicked")})
for capturing:
document.querySelector("#grandparent").addEventListener("click",()=> {console.log("grandparent clicked")}, true);
document.querySelector("#parent").addEventListener("click",()=> {console.log("parent clicked")},true);
document.querySelector("#child").addEventListener("click",()=> {console.log("child clicked")},true);
stopPropogation:
document.querySelector("#grandparent").addEventListener("click",()=> {console.log("grandparent clicked")}, false);
===============================================================================================
Event Delegation:
1. Event delegation makes use of one of the Event Propagation techniques called Event Bubbling
2. if we have a lot of elements handled in a similar way, then instead of assigning a handler to each of them – we put
3. In the handler we get event.target to see where the event actually happened and handle it.
4. Less memory usage, better performance.
5. Less time required to set up event handlers on the page.
6. Event delegation is a pattern to handle events efficiently in JavaScript. The main idea is to reduce the number of ev
improving the performance of the website.
7. When there are multiple DOM elements present, instead of adding event handlers on each one of them, you can j
(on the parent/common ancestor element) which can do the exact same work which all those multiple event handl
Example:
html-
Counter: <input type="button" value="1" data-counter>
One more counter: <input type="button" value="2" data-counter>
<script>
document.addEventListener('click', function(event) {
if (event.target.dataset.counter != undefined) {
event.target.value++;
console.log(event.target.value)
}
});
</script>
===============================================================================================
Polyfill:
1. With the help of polyfill can write own implementation of BIND function.
2. Polyfills is a way to use modern features (usually JS) on browsers where it is currently unsupported. We do this by
along with our own logic.
3. A polyfill is a piece of code (usually JavaScript on the Web) used to provide modern functionality on older browsers
Polyfill: Sometimes array push, pop or filter methods and some window's functions like window.localstorage and win
by browser, so in this case we can provide our own fallback support or own code that it replace the native functions
Without Bind-
let name ={ first: "Priya", last: "Bagde"}
let printName = function(town, state){ console.log(this.first+" "+this.last+" "+town+" "+state)}
Function.prototype.mybind= function(...args){ //printName arguments
let obj = this; //printName
params = args.slice(1)
return function(...args2){ //printNameFinal arguments
obj.apply(args[0], [...params, ...args2])
}
}
let printNameFinal= printName.mybind(name, "chhindwara")
printNameFinal("MadyaPradesh")
===============================================================================================
Promises:-
ὄWhat is promise.all ?
✌ἿPromise.all is a promise that takes an array of promises as an input (an iterable), and it gets resolved when all the
xample, the syntax of promise.all method is below,
Promise.all([Promise1, Promise2, Promise3])
.then(result) => { console.log(result) })
.catch(error => console.log(`Error in promises ${error}`))
Promise.all([p1, p2]).then(
(res) => {
console.log("Response => ", res);
document.write("<b>Response => </b>" + res);
},
(err) => {
console.log("error =>", err);
}
);
===============================================================================================
Polyfill of //let myPromiseAll
Promise.all = (promises) => {
let responses = [];
let errorResp = [];
return new Promise((resolve, reject) => {
/** Loop over promises array **/
promises.forEach(async (singlePromise, i) => {
try {
/** wait for resolving 1 promise **/
let res = await singlePromise;
responses.push(res);
if (i == promises.length - 1) {
if (errorResp.length > 0) {
reject(errorResp);
} else {
// resolve(esponses)
// To know our cutom promise function returning result
resolve("custom promise ::" + responses);
}
}
} catch (err) {
errorResp.push(err);
reject(err);
}
});
});
};
let promises = [
Promise.resolve(2),
Promise.reject('This is rejected'),
new Promise((resolve, reject) => setTimeout(resolve, 400, 67)),
];
let promises = [
Promise.resolve(2),
Promise.reject('This is rejected'),
new Promise((resolve, reject) => setTimeout(resolve, 400, 67)),
];
var d= Promise.letsBuildARace([a,b,c]);
d.then(result=>console.log(result))
===============================================================================================
Polyfill of Any:
Promise.letsBuildAnAny = function(arrayOfPromises){
let errors = [];
return new Promise((resolve, reject) => {
arrayOfPromises.forEach((promise, index)=>{
Promise.resolve(promise)
.then(resolve)
.catch((error)=>{
errors.push(error);
if(errors.length == arrayOfPromises.length)
reject(errors);
})
})
})
}
For Example:
var a = new Promise((resolve) => setTimeout(()=>{resolve(3)},200));
var b = new Promise((resolve,reject)=>reject(9));
var c= new Promise((resolve) => resolve(5));
var d= Promise.letsBuildAnAny([a,b,c]);
d.then(result=>console.log(result))
===============================================================================================
Rest Parameter in Array :
function addSum(a,b,c, ...rest){ // ...rest indicating combination of those arguments which are left(rest).
console.log(...rest) //6,7
console.log(rest) //[6,7]
console.log(arguments) //ES5 //{"0":2, "1":3, "2":4, "3":6, "4":7}
return a+b+c+rest[0]+rest[1];
}
console.log(addSum(2,3,4,6,7)) //22
===============================================================================================
//Spread Operator in Array:
function getNames(name1, name2, name3){
console.log(name1,name2, name3);
}
var names =["priya", "riya", "supriya"]
getNames(names[0], names[1], names[2]); //"priya" "riya" "supriya"
getNames(...names) //spread operator here used to spread the individual arguments //best approach because here
inside function without an error. Other approaches will gives an error to pass those arguments which are used in fun
getNames(names)
===============================================================================================
Rest Spread in object:
var student ={
name: "priya",
age : 100,
hobbies : ["cooking", "dancing"]
}
var newStudent ={
...student, //coping one object to another object
age : 101
}
console.log(newStudent)
===============================================================================================
Callback, Promise and Async/await :-
const data = [ //array of object
{name: "priya", role: "software developer"},
{name: "riya", role: "software developer"},
{name: "supriya", role: "software developer"}
];
function getData(){
setTimeout(()=>{
let output ="";
data.forEach((item)=>{
output +=`<li> ${item.name}</li>`
})
document.body.innerHTML = output;
}, 1000) //use 5000 instead of 1000 then we get a name of "dhanupriya".
}
function createData(dataInput){
setTimeout(()=>{data.push(dataInput)}, 2000)
}
createData({name: "dhanupriya", role: "software developer"})
getData()
=====================================================================
Callback:
const data = [ //array of object
{name: "priya", role: "software developer"},
{name: "riya", role: "software developer"},
{name: "supriya", role: "software developer"}
];
function getData(){
setTimeout(()=>{
let output ="";
data.forEach((item)=>{
output +=`<li> ${item.name}</li>`
})
document.body.innerHTML = output;
}, 1000)
}
function createData(dataInput, callback){
setTimeout(()=>{
data.push(dataInput)
callback(); //getdata function will get call once we push the new dataInput
},2000)
}
createData({name: "dhanupriya", role: "software developer"}, getData) //we are passing getData function as a callbac
====================================================================
Promises:
const data = [ //array of object
{name: "priya", role: "software developer"},
{name: "riya", role: "software developer"},
{name: "supriya", role: "software developer"}
];
function getData(){
setTimeout(()=>{
let output ="";
data.forEach((item)=>{
output +=`<li> ${item.name}</li>`
})
document.body.innerHTML = output;
}, 1000) //use 5000 instead of 1000 then we get a name of "dhanupriya".
}
function createData(dataInput){
return new Promise((resolve, reject)=>{
setTimeout(()=>{
data.push(dataInput);
let error = false; //if trure then went to catch block
if(!error) resolve();
else reject("Error!!!!");
},2000)
})
}
createData({name: "dhanupriya", role: "software developer"})
.then(getData)
.catch(err => console.log("Errors !"))
====================================================================
Async/Await:
const data = [ //array of object
{name: "priya", role: "software developer"},
{name: "riya", role: "software developer"},
{name: "supriya", role: "software developer"}
];
function getData(){
setTimeout(()=>{
let output ="";
data.forEach((item)=>{
output +=`<li> ${item.name}</li>`
})
document.body.innerHTML = output;
}, 1000) //use 5000 instead of 1000 then we get a name of "dhanupriya".
}
function createData(dataInput){
return new Promise((resolve, reject)=>{
setTimeout(()=>{
data.push(dataInput);
let error = false; //if trure then went to catch block
if(!error) resolve();
else reject("Error!!!!");
},2000)
})
}
var userDetails2 ={
name: "Riya",
age: 101,
role: "Software Developer"
}
userDetails.printDetail.call(userDetails2); //if i want line 6th "this" should point to userDetails2 then use call function.
-----------------------------------------------------------------------------------
var userDetails ={
name: "Priya",
age: 100,
role: "Software Developer"
}
let printDetail = function(){
console.log(this.name)
}
printDetail.call(userDetails); // if function is independented of object.
var userDetails2 ={
name: "Riya",
age: 101,
role: "Software Developer"
}
printDetail.call(userDetails2);
--------------------------------------------------------------------------------
var userDetails ={
name: "Priya",
age: 100,
role: "Software Developer"
}
let printDetail = function(country){
console.log(this.name+" "+country)
}
printDetail.call(userDetails, "India"); // if function is independented of object.
var userDetails2 ={
name: "Riya",
age: 101,
role: "Software Developer"
}
printDetail.call(userDetails2, "India");
printDetail.apply(userDetails2, ["India"]);
let bindfunc= printDetail.bind(userDetails2, "India"); //creating a copy and invoke whenever require //don't call the di
bindfunc();
===============================================================================================
Foreach:
const Data=[
{name:"Google", category:"Product Based"},
{name:"Accenture", category:"service Based"},
{name:"Amazon", category:"Product Based"}
];
console.log(updated)
===============================================================================================
ProtoType: If we can inherit the property of the one class to other class called as Inheritence.
const objName = {
name : "priya",
getName : function(){
return this.name; //wanted to access above name inside block so we used "this"
}
}
console.log("1",objName.getName());
const objState = {
//name: "riya",
state : "pune",
__proto__ : objName
}
console.log("2",objState.getName()); //if will find in current object, if not available then it move to upper object contin
const objCountry = {
name: "supriya",
country : "india",
__proto__ : objState
}
console.log("3", objCountry.getName() ,objCountry.state)
-----------------------------------------------------------------
Array.prototype.convertToObject = function(){
let newObj ={}
this.forEach( ele =>{
newObj[ele]= ele;
}
)
return newObj;
}
const arr =["priya"];
console.log(arr.convertToObject()); //array to object conversion with prototype
------------------------------------------------------------------
function myProtoType(name){
return this.name=name;
}
myProtoType.prototype=objName;
const myproto = myProtoType("priya")
console.log(myproto);
console.log(myproto.getName());
===============================================================================================
Set: It contains only unique values. Can iterate.
let arr =[1,2,3]
let obj = new Set(arr) //set takesarray, string, object etc
obj.add(4)
obj.delete(3)
console.log(obj)
var obj1={name:"priya"}
obj.add(obj1)
console.log(obj)
===============================================================================================
Map: store in key value pair. Can iterate.
let myMap = new Map([["a1", "priya"],["a2","riya"]])
myMap.set("a2","supriya")
console.log(myMap.get("a2"))// will get last value which we will assign
for(let [key,value] of myMap){
console.log(`keys ${key}, value ${value}`)
}
===============================================================================================
WeakSet: only store object, can't iterate with for/foreach
let ws = new WeakSet()
const obj={"name":"priya"}
ws.add(obj)
console.log(ws.has(obj));
WeakMap: It's similar to WeakSet where can't able to iterate and only stores an object
===============================================================================================
Hoisting : Its related to memory management.
Global execution context having 2 component. In memory componenet variable and functions will store. Variable sto
of function. Var or functions will push to Callstack and then pop.
===============================================================================================
2 ways of Currying function with closures:
function add(a){
return function(b){
if(b) return add(a+b);
return a;
}
}
console.log('Sum :', add(1)(2)(3)(4)(5)(6)(7)(8)()) //"Sum :", 36
function sum(num1) {
return (num2) => {
if(!num2) {
return num1;
}
return sum(num1 + num2);
}
}
console.log('Sum :', sum(1)(2)(3)(4)(5)(6)(7)(8)()) //"Sum :", 36
[1, 2, 'b', 0, {}, '', NaN, 3, undefined, null, 5].filter(a => a);
*************Using !!*************
[1, 2, 'b', 0, {}, '', NaN, 3, undefined, null, 5].filter(a => !!a);
*************Using Boolean*************
[1, 2, 'b', 0, {}, '', NaN, 3, undefined, null, 5].filter(a => Boolean(a));
//This works because Boolean itself is a function, and the arguments filter supplies are passed directly to it.
//Boolean() is also a function that returns truthy when true and falsy when false!
===============================================================================================
Memo Function:
********************Memoizing functions**********************
*********************Using Reducer****************
function flatDeep(arr, d = 1) {
return d > 0 ? arr.reduce((acc, val) =>
acc.concat(Array.isArray(val) ? flatDeep(val, d - 1) : val), [])
: arr.slice();
};
console.log(flatDeep(arr, Infinity)) //[1,2,12,23,75,34,2,34,32,45,3,456,56,5]
===============================================================================================
Regular Expression(Regex):
A regular expression is a group of characters or symbols which is used to find a specific pattern in a text.
Regular expressions are normally case-sensitive so the regular expression The would not match the string the
===============================================================================================
Multiple functions:
var arr = [];
const checkSort =(a)=>{
if(!arr.includes(a) && Number.isInteger(a)){
arr.push(a)
}
return console.log(arr.sort((a,b)=>a-b));
}
checkSort(5);
checkSort(4);
checkSort(2);
checkSort("abc");
checkSort("44");
checkSort(-44);
//output: [-44,2,4,5]
===============================================================================================
[..."priya"]
// ['p', 'r', 'i', 'y', 'a']
"priya".split('')
// ['p', 'r', 'i', 'y', 'a']
===============================================================================================
Deep Copy and Shallow Copy:
A deep copy means that "all of the values of the new variable" are copied and disconnected from the original variabl
emory location for Y and then assigns the copied members to Y to achieve deep copy. In this way, if X vanishes Y is st
A shallow copy means that certain (sub-)values are still connected to the original variable. It is primarily utilized for co
s the elements present at the first level.
A deep copying means that value of the new variable is disconnected from the original variable
while a shallow copy means that some values are still connected to the original variable.
addresses of X and Y will be the same i.e. they will be pointing to the same memory location.
To copy an object in JavaScript, you have three options. Both spread (...) and Object.assign() perform a shallow copy w
--->Assignment operator “=”
--->Use the spread (...) syntax
--->Use the Object.assign() method
--->Use the JSON.stringify() and JSON.parse() methods --where the stringify() method converts a particular JavaScript
rsing operation and returns an object.
For a primitive value, you just simply use a simple assignment:The important takeaway here is that you can quickly c
in a separate memory space by creating and assigning another variable to the variable being copied. Take note of ho
allow later changes.
let counter = 1;
let copiedCounter = counter;
copiedCounter = 2; //And when you change the value of the copied variable, the value of the original remains the sam
console.log(counter);
Output: 1
However, if you use the assignment operator for a reference value, it will not copy the value. Instead, both variables
JS objects (as non-primitive data types) differ because they have reference values and those values are mutable. This
As we know in javascript there are two data types, one is primitive and the other is non-primitive. The primitive data
✏️ In Shallow copy, when we assign a variable to another variable using the assignment operator, We are actually as
les point to the same memory location. If we change any of them, it will be reflected in both. All non-primitive data ty
✏️ In Deep copy, when we assign a variable to another variable using the assignment operator, We are actually assig
ent locations which means if I change one, then it will not get reflected in both. All primitive data types are deep copi
===============================================================================================
function countOccurance(arr){
let map ={}, sortedArr = arr.sort((a,b)=>a-b);
for(var item of sortedArr){
if(map[item]){
map[item]++
}else{
map[item] = 1;
}
}
return map;
}
console.log(countOccurance([1, 4, 91, 21, 91, 0, 32, 4, 11, 3, 54, 34, 21]))
--------------------------------------------------------------------------------
function countOccurance(arr){
let map ={}, sortedArr = arr.sort((a,b)=>a-b);
for(var item of sortedArr){
if(!(item in map)){ map[item] = 0}
map[item]++;
}
return map;
}
console.log(countOccurance([1, 4, 91, 21, 91, 0, 32, 4, 11, 3, 54, 34, 21]))
-------------------------------------------------------------------
function countOccurance(arr){
let map ={}, sortedArr = arr.sort((a,b)=>a-b);
for(var item of sortedArr){
if(map[item] ==null){ map[item] = 0}
map[item]++;
}
return map;
}
console.log(countOccurance([1, 4, 91, 21, 91, 0, 32, 4, 11, 3, 54, 34, 21]))
-------------------------------------------------------------------
function countOccurance(arr){
let map ={}, sortedArr = arr.sort((a,b)=>a-b);
for(var item of sortedArr){
if(map.hasOwnProperty(item)){
map[item] = map[item] + 1
}else{
map[item] = 1;
}
}
return map;
}
console.log(countOccurance([1, 4, 91, 21, 91, 0, 32, 4, 11, 3, 54, 34, 21]))
-------------------------------------------------------------------
function countOccurance(arr){
let map ={}, sortedArr = arr.sort((a,b)=>a-b);
for(var item of sortedArr){
map[item] = map[item]+1 || 1
}
return map
}
console.log(countOccurance([1, 4, 91, 21, 91, 0, 32, 4, 11, 3, 54, 34, 21]))
-------------------------------------------------------------------
function countOccurance(arr){
let map ={}, sortedArr = arr.sort((a,b)=>a-b); //[0,1,3,4,4,11,21,21,32,34,54,91,91]
for(var item of sortedArr){
map[item] = (map[item] || 0) + 1
}
return map
}
console.log(countOccurance([1, 4, 91, 21, 91, 0, 32, 4, 11, 3, 54, 34, 21]))
-------------------------------------------------------------------
function countOccurance(arr){
let map ={}, sortedArr = arr.sort((a,b)=>a-b);
for(var item of sortedArr){
if(map[item]){
map[item] = map[item] + 1
}else{
map[item] = 1;
}
}
return map;
}
console.log(countOccurance([1, 4, 91, 21, 91, 0, 32, 4, 11, 3, 54, 34, 21]))
-------------------------------------------------------------------
function countOccurance(arr){
let map ={}, sortedArr = arr.sort((a,b)=>a-b);
for (var i=0; i<sortedArr.length; i++)
{
map[sortedArr[i]] = map[sortedArr[i]] ? map[sortedArr[i]]+1 : 1;
}
return map
}
console.log(countOccurance([1, 4, 91, 21, 91, 0, 32, 4, 11, 3, 54, 34, 21]))
-------------------------------------------------------------------
var frequencySort = function(nums) {
const hash={}
for(let item of nums){
hash[item]
?hash[item]++
:hash[item]=1
}
return hash
};
console.log(frequencySort([1,1,2,2,2,3]))
--------------------------------------------------------------
var frequencySort = function(nums) {
let map = new Map();
for (const i of nums) {
if (map.has(i)) {
map.set(i, map.get(i) + 1);
} else {
map.set(i, 1);
}
}
console.log(map);
return map;
};
console.log(frequencySort([1,1,2,2,2,3]))
===============================================================================================
Anagram:O(N)
let NO_OF_CHARS = 256;
function areAnagram(str1, str2)
{
// Create a count array and initialize all values as 0
let count = new Array(NO_OF_CHARS).fill(0);
let i;
// Driver code
let str1 =
"priya".split("");
let str2 =
"riyap".split("");
// Function call
if (areAnagram(str1, str2))
document.write(
"The two strings are " +
"anagram of each other");
else
document.write(
"The two strings are " +
"not anagram of each other");
===============================================================================================
// How can you make a linkedlist nodes in javascript and
// hpw to check linkedlist is cyclic or not.
class LinkedList {
constructor(data){
this.data = data;
this.next = null;
}
}
head.next = A;
A.next = B;
B.next = C;
C.next = D;
D.next = A; //it will be circluar linked list
//D.next = null; //it will be single linked list
function floyedCycleDetection(){
let fast = head, slow = head;
while(fast && fast.next){
slow = slow.next;
fast = fast.next.next;
if(slow == fast) return true;
}
return false
}
===============================================================================================
This: This is a keyword from where it gets belongs to. This is a current object. In javascript, this behave in diff manner
invoked. (https://www.youtube.com/watch?v=wp-NEcAck1k&t=427s)
debounce(printName(), 8000)()
===============================================================================================
function maxSumSubArray(arr){
let max = 0;
for(let i=0; i<arr.length; i++){
let currMax = 0;
for(let j=i; j<arr.length; j++){
currMax += arr[j]
if(currMax > max){ //or max = Math.max(max, currMax)
max = currMax
}
}
}
return max
}
console.log(maxSumSubArray([1,2,-1,3,-2]))
===============================================================================================
function hello(){
for(var i=0; i<=3; i++){
setTimeout(()=>{
console.log(i)
}, 1000)
}
}
hello() //4 4 4 4
function hello(){
for(let i=0; i<=3; i++){ //using let getting new refrences
setTimeout(()=>{
console.log(i)
}, 1000)
}
}
hello() //0 1 2 3
function hello(){
for(let i=0; i<=3; i++){ //alternative of let i.e closures and passing indexes
function hi(i){
setTimeout(()=>{
console.log(i)
}, 1000)
}
hi(i)
}
}
hello() //0 1 2 3
===============================================================================================
//move zeroes
function moveZeroes(arr){
for(let i=0; i<arr.length; i++){
if(arr[i] === 0){
arr.push(0);
arr.splice(i,1)
}
}
return arr
}
console.log(moveZeroes([0,2,3,0,50,0,3,0,8,2,0]))
===============================================================================================
function sumofTwopair(arr, target){
for(let i=0; i<arr.length; i++){
for(let j=i+1; j<arr.length; j++){
if(arr[i]+arr[j] === target) return true
}
}
return false
}
console.log(sumofTwopair([0,22,3,0,50,0,3,0,8,2,0],5))
--------------------------------------------------------
function sumofTwopair(arr, target){
let s = new Set();
for(let item of arr){
if(s.has(target-item)){
return true
}else{
s.add(item)
}
}
return false
}
console.log(sumofTwopair([0,2,3,0,50,0,3,0,8,2,0],5))
===============================================================================================
Polyfill of Flat:
function flatArray(arr){
let result = arr.reduce((accum, item)=>{
Array.isArray(item)
? accum.push(...flatArray(item))
: accum.push(item);
return accum
},[])
return result;
}
console.log(flatArray([1,2,3,[4,[5,[6,7,[8]]]]]))
===============================================================================================
Merge 2 sorted array:
function mergedTwoArrays(arr1,arr2){
let mergedArray= [];
let i = 0, j=0;
while((i < arr1.length)&&(j< arr2.length)){
if(arr1[i]<arr2[j]){
mergedArray.push(arr1[i]);
i++;
}
else{
mergedArray.push(arr2[j]);
j++;
}
}
if(i<=(arr1.length-1)){
arr1.splice(0,i);
mergedArray=mergedArray.concat(arr1);
}
else if(j<=(arr2.length-1)){
arr2.splice(0,j);
mergedArray=mergedArray.concat(arr2);
}
return mergedArray;
}
console.log(mergedTwoArrays([1,2,3,4], [2,5,6]))
-----------------------------------------------------
function mergedTwoArrays(arr1,arr2){
let result= [], i=0, j=0;
while(i < arr1.length && j< arr2.length){
if(arr1[i]<arr2[j]){
result.push(arr1[i]); i++;
}
else{
result.push(arr2[j]); j++;
}
}
while(i < arr1.length){
result.push(arr1[i]); i++;
}
while(j< arr2.length){
result.push(arr2[j]); j++;
}
return result;
}
console.log(mergedTwoArrays([1,2,3,4], [2,5,6]))
===============================================================================================
===============================================================================================
********************Implementation of Currying*****************
const obj = {
name : "John",
address : {
country : "India",
add : {
city : "Delhi"
}
}
}
===============================================================================================
===============================================================================================
----------------------------------------------------------------------------------------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------------------------------------------------------------------------------------
Dassault Systems:
const inputArray = ["INDIA:[Delhi,Mumbai,Chennai]"]; //1
const extepctedOutputArray = ["INDIA:[Delhi]", "OR", "INDIA:[Mumbai]", "OR", "INDIA:[Chennai]"];
//GENERIC JS FUNCTION --> String with comma will split as separate Items in new ARRAY and separated with OR betw
3. How does the `.bind()` method differ from other function-invoking methods?
- Answer: Unlike other methods that immediately invoke the function, `.bind()` returns a new function with the spe
6. What does the `.bind()` method do in the line `let printMyName = printName.bind(name, "Mumbai", "MH")`?
- Answer: It binds the `printName` function to the `name` object, setting the `this` value, and pre-filling the param
11. How does the `mybind` method achieve its goal in the polyfill?
- Answer: It returns a new function that calls the original function with the specified `this` value and a combination
14. Wh
at does `params = args.slice(1)` do in the polyfill?
- Answer: It extracts the parameters (excluding the `this` value) provided to the `mybind` method and stores the
15. How does the polyfill handle multiple invocations of the bound function?
- Answer: The polyfill creates a new function each time `mybind` is called, ensuring that each bound function has
18. How would you modify the polyfill to handle missing `this` value gracefully?
- Answer: You can add a check for the existence of `args[0]` and provide a default value if it is undefined.
19. How does the polyfill handle arguments when the bound function is called?
- Answer: It concatenates the bound arguments with the new arguments provided during the function call.
20. What are the advantages of using the `.bind()` method over the polyfill?
- Answer: The native `.bind()` method is widely supported, efficient, and easier to use compared to a custom polyf
ion and function composition.
21. Can you use the polyfill with functions that have a variable number of arguments?
- Answer: Yes, the polyfill can be used with functions that have a variable number of arguments, as it dynamically c
22. How would you modify the polyfill to support a variable number of arguments?
- Answer: You can use the `arguments` object within the returned function to capture all arguments dynamically.
23. What happens if you call `.bind()` on a function that is already bound?
- Answer: The `.bind()` method can be called on a function that is already bound, but it will create a new function
25. What is the purpose of the line `let printMyName2 = printName.mybind(name, "Mumbai", "MH")` in the code?
- Answer: It demonstrates the usage of the custom polyfill (`mybind`) with the `printName` function, binding it to
26. How would you modify the polyfill to support a different context for `this` dynamically?
- Answer: You can make the polyfill accept the desired `this` value as an argument during the invocation instead o
27. Can you use the `.bind()` method with arrow functions?
- Answer: No, arrow functions do not have their own `this` value, so the `.bind()` method is not applicable to them
28. Explain the potential memory implications of using the polyfill multiple times.
- Answer: Each call to the polyfill creates a new function, potentially leading to increased memory usage if used exc
riately.
29. What are some alternative ways to achieve function binding in JavaScript?
- Answer: Other methods include using the `call()` and `apply()` methods or creating wrapper functions that expl
.
31. What would happen if you didn't use `apply` in the polyfill and just called `originalFunction(context, newArgume
- Answer: Without `apply`, the arguments would not be passed correctly, and it might not behave as expected.
33. How would you apply the polyfill to a specific function in your code?
- Answer: By checking if `Function.prototype.bind` is not already defined and applying the polyfill if needed.
34. Is it possible to change the `this` value of an arrow function using the polyfill?
- Answer: No, arrow functions have a fixed `this` value and cannot be changed using `bind`.
36. Can you use the polyfill for functions with the `new` keyword?
- Answer: The polyfill is not suitable for functions used as constructors with the `new` keyword.
37. What is the impact of the polyfill on the prototype chain of functions?
- Answer: The polyfill does not affect the prototype chain of functions.
Part 1: https://www.linkedin.com/posts/priya-bagde_part1-frontend-javascript-activity-7153331959824330753-8oUH
Part 2: https://www.linkedin.com/posts/priya-bagde_part2-frontend-javascript-activity-7153332995796434945-uPvW
Part 3: https://www.linkedin.com/posts/priya-bagde_part3-frontend-javascript-activity-7153333414849347584-rIBl?u
Part 4: https://www.linkedin.com/posts/priya-bagde_part4-frontend-javascript-activity-7153333978718973953-db63?
===============================================================================================
"What's the differences between Promise.any, Promise.race, Promise.all, and Promise.allSettled with real-time exam
ᵀᵂ ᵂᵂᵂᵂᵂ, ᵂᵂᵁ
ᾑ ᵀᵂᵂᵂᵂᵂᵁ.ᵁᵂᵃ ᵁᵂᵂ ᵂᵂᵂᵁᵂ ᵂᵁᵂᵂᵂᵂᵂᵁᵂ,
ᾑ ᵀᵂᵂᵂᵂᵂᵁ.ᵂᵁᵁᵁ ᵁᵂᵂ ᵂᵂᵁᵁᵁ-ᵁᵁᵂᵂᵂᵂᵁ ᵂᵁᵁᵂᵁᵂᵂᵂᵂ,
ᾑ ᵀᵂᵂᵂᵂᵂᵁ.ᵁᵂᵂ ᵃᵂᵁᵂ ᵁᵂᵂ ᵂᵂᵂᵂᵂᵂᵁᵂ ᵂᵂᵂᵂ ᵂᵂᵁᵁᵁᵁᵁ, ᵁᵂᵁ
ᾑ ᵀᵂᵂᵂᵂᵂᵁ.ᵁᵂᵂᵁᵁᵂᵂᵂᵁᵁ ᵃᵂᵁᵂ ᵃᵂᵂ ᵃᵁᵂᵂ ᵂᵂ ᵁᵁᵂᵂᵂᵂᵁ ᵂᵂᵁ ᵂᵂᵂᵁᵂᵂᵁ ᵂᵁ ᵁᵂᵂ ᵂᵂᵂᵂᵂᵂᵁᵂ, ᵂᵁᵂᵁᵂᵁᵂᵁᵂᵂ ᵂᵁ ᵂᵂᵁᵁᵁᵂᵂ ᵂᵂ
"Absolutely, let's dive into the Promise methods. Firstly, Promise.any resolves as soon as any of the promises it recei
s is particularly handy when dealing with multiple APIs, and we want to proceed as soon as we get the first successfu
On the other hand, Promise.race resolves or rejects as soon as any of the promises resolves or rejects. This is useful
ources and taking the result from the fastest one.
Now, for scenarios where we need all promises to succeed before proceeding, we have Promise.all. It resolves only if
s valuable when aggregating data from various sources and ensuring a comprehensive success criterion.
Lastly, Promise.allSettled is beneficial when we want to wait for all promises to settle, regardless of whether they res
ndicating the status and value. This method is particularly useful for scenarios where we need to process all outcome
purposes."
===============================================================================================
Memoisation:
Taking a moment to collect my thoughts, I explained the below points, but did i missed any other point here.
✍ Memoization is a performance optimization technique where the results of expensive function calls are ᵁᵁᵁᵂᵁᵁ ᵁᵂ
✍ This helps to avoid ᵂᵁᵁᵂᵂᵁᵁᵂᵂ ᵁᵂᵂᵂᵂᵂᵁᵂᵂᵂᵂᵂ, improving the overall efficiency of the program.
✍ The key is to store the results of function calls based on their inputs and check the cache before performing a pote
✍ There are different ways to implement memoization, including manual ᵁᵁᵁᵂᵂᵂᵂ ᵃᵂᵂᵂ ᵂᵁᵂᵁᵁᵂᵂ, ᵂᵂᵂᵂᵂ ᵂᵂᵂᵂᵁᵂ-ᵂᵂ
ᵂ ᵂᵁᵂᵁᵁᵂ.
✍ For example, consider a function that computes the ᵂᵂᵂ ᵀᵂᵁᵂᵂᵁᵁᵁᵂ ᵂᵂᵂᵁᵁᵂ. Without memoization, the function m
ssary overhead. By implementing memoization, we can store previously computed results in a cache, preventing red
// Base cases
if (n <= 1) {
return n;
}
return memo[n];
}
// Example usage
const result = fibonacciWithMemoization(5);
console.log(result); // Output: 5
https://plainenglish.io/blog/50-javascript-output-questions
------------------------------------------------------------------------------------------------------------------------------------------------------------------------
// Question: What is typeof []
// Answer: Object. Actually Array is derived from Object. If you want to check array use Array.isArray(arr)
// Question: typeof(NaN)
// Anwser:"number"
// Question:null == undefined
// Answer: true
output: 5
//delete keyword only use with object properties. here a is a variable so it will not work the variable. //delete user.age
------------------------------------------------------------------------------------------
Dynamic property of object :
const property = "firstName";
const name = "Priya";
const user = {
property : name //{"property" : "Priya"}
}
console.log(user);
const user1 = {
[property] : name //dynamic property required [] //{"firstName" : "Priya"}
}
console.log(user1);
------------------------------------------------------------------------------------------
const user ={
name : "priya",
age : 100
}
console.log(user)
------------------------------------------------------------------------------------------
const a = {}
const b = {key : "b"}
const c = {key : "c"}
a[b] = 123;
a[c] = 456;
console.log(a[b]); //456
*****************
Real Usecases : Storing in local storage. We can't store the object as a value so require to convert into a string.
const user = {
name :"priya",
age : 100
}
console.log(JSON.stringify(user)) //convert into a string
console.log(JSON.parse(JSON.stringify(user))) //convert into an object
//wheen we pass as a array then it will convernt only those properties and ignore rest of the proerties
------------------------------------------------------------------------------------------
const shape = {
radius : 10,
diameter(){
return this.radius*2; //this pointing to shape
}
parimeter : () => 2*Math.PI*this.radius; //this pointing to window where it's not exist
}
console.log(shape.diameter()) //20
//console.log(shape.parimeter()) //Nan
-------------------------------------------------------------------------------------------
let user = {
name : "Priya",
age : 100
}
console.log(myName) //Priya
-------------------------------------------------------------------------------------------
let user = {
age : 100,
fullName : {
first : "Priya",
last : "Bagde"
}
}
d=c;
c.greeting = "Hello"
console.log(d.greeting); //Hello
//We are passing the refrence not the propertues of an object so when we changge the roperty of any object it will re
-------------------------------------------------------------------------------------------
let person = {name : "priya"}
const members = [person]
person = null
console.log(members);// [{"name":"priya"}]
function print(name){
setTimeout(()=>{
return `${name}`
},1000)
}
let value = print("Priya");
console.log(value)
console.log(2);
Reason : It run the code quickly and it will not wait for setTimeout so value will be undefined
---------------------------------------------------
Above code can be fix by callback:
console.log(1);
function print(name, cb){
setTimeout(()=>{
cb(`${name}`)
},1000)
}
print("Priya", (value)=>{
console.log(value)
});
console.log(2);
-------------------------------------------------------------------------------------------
let promises = new Promise((resolve, reject)=>{
setTimeout(()=>{
let state = true;
if(state){
resolve("Resolved Promises!!...");
}else{
reject("Rejected Promises!!...");
}
}, 1000)
})
promises.then((res)=>console.log(res))
.catch((err)=>console.log(err))
//resoled!!....
-------------------------------------------------------------------------------------------
console.log(1);
data.then((res)=>{
console.log(res)
})
console.log(4); //1 2 4 3
-------------------------------------------------------------------------------------------
console.log(1);
console.log(4); //1 2 4
If we are not returning anything it will not print anything .
------------------------------------------------------------------------------------------------------------------------------------------------------------------------
let a = "true";
setTimeout(()=>{
a=false;
}, 2000)
while(a){
console.log("1")
}
Reason: 1, 1, 1,......
Explanation: Event loop will add setTimeout callback in Macrotask queue and will push it to call stack for execution o
Here, since 'a' is true and isn't being set to false anywhere in main thread, the while loop will run infinitely, and setTim
------------------------------------------------------------------------------------------------------------------------------------------------------------------------
function run(value, time){
return new Promise((resolve)=>{
setTimeout(()=>{
resolve(value)
}, time)
})
}
async function task(){
let a = await run(1, 1000); //1value //1 sec
let b = run(2, 2000); //2value //2 sec
let c = run(3, 1000); //3value //execute before b so will not take extra time
console.log(a + await b+ await c);
}
task()
6 'in 3Sec'
Explanation: In line 10, a setTimeout() timer of 1 sec will be triggered and due to 'await', it will wait for the timer to ex
Then since there is no 'await' in line 11 and 12, the 2 timers of 2 sec and 1 sec will be triggered simultaneously. Then
ill wait for another 2 sec, and since the 2 timers started simultaneously, the other 1 sec timer would already have exp
So, after another 2 sec, value of b will be 2, and then immediately after that, value of c will be 3.
ὄ Output : 1 + 2 + 3 = 6
ὄ Total time: 1 (line 10) + 2 (await b, in line 14) + 0 (await c, in line 14) = 3 sec
------------------------------------------------------------------------------------------------------------------------------------------------------------------------
const fetchData = function(){
return new Promise((res, reject)=>{
reject("Error!!")
})
}
fetchData()
.then(null, (err)=>{
console.log("First");
console.log(err);
})
.catch(()=>{
console.log("Second");
console.log(err)
})
Normal function will get execute before, because of function Hoisting concept, then function expression wil get exec
------------------------------------------------------------------------------------------------------------------------------------------------------------------------
const inc = async(x) => {
x = x + await 1; //2
return x;
}
//output : Second
Promise.all() returns array of resolved promises values and if either any of the promise is rejected, then it directly ret
----------------------------------------------------------------------------------------------------------------------------------------------------------------------
console.log("start");
console.log("end");
//start priya end Dolly
//all the console will print first then aync and setTimeout
----------------------------------------------------------------------------------------------------------------------------------------------------------------------
const promise = () => Promise.resolve("Success");
function first(){
promise().then((res)=> console.log(res)); //async
console.log("First"); //sync
}
async function second(){
const res = await promise();
console.log(res); //async
console.log("Second"); //sync
}
first();
second();
//Having same key name so, the value is override and it will be "Dolly"
Explanation : As Object.assign() method will add all the key values of person2 to person1 and return the reference of
ten.
Basically person1 and person are referring to same object.
----------------------------------------------------------------------------------------------------------------------------------------------------------------------
const calc=(a)=>{
return (b)=>{
if(b) return calc(a+b);
return a;
}
}
console.log(calc(1)(2)(3)(4)()) //10 currying
----------------------------------------------------------------------------------------------------------------------------------------------------------------------
const fetchData = function(){
return new Promise((res)=> res("One"));
}
let isLoading = true;
fetchData()
.then((result)=>{
console.log(result);
})
.finally(()=>{
console.log("Two");
isLoading = false;
})
console.log(isLoading)
const person = {
name : "Priya",
displayName(){
console.log(this.name) //pointing to the person object
}
}
p.catch((error)=>{
console.log(error); //{}
console.log(error.message); //failed
}).then((result)=>{
console.log(result) //undefined //doesn't return anything
})
//Failed!! undefined
Explanation: In line 2, we are rejecting the promise 'p' with the argument as Error("Fails!"), which is an 'Error' object w
error callback passed to catch() method of promise 'p' receives the above passed Error object as the 'error' paramet
Now, as this catch handler is not returning any value so, the chained 'then' handler will be called with undefined as p
----------------------------------------------------------------------------------------------------------------------------------------------------------------------
----------------------------------------------------------------------------------------------------------------------------------------------------------------------
----------------------------------------------------------------------------------------------------------------------------------------------------------------------
----------------------------------------------------------------------------------------------------------------------------------------------------------------------
----------------------------------------------------------------------------------------------------------------------------------------------------------------------
/* Ὂ"JavaScript-with-JC" - Guess the Output? */
// ὄ MCQ-1
function MCQ1() {
const person = {
name: "Jayesh",
displayName1: function () {
console.log("name1", this.name);
},
displayName2: () => {
console.log("name2", this.name);
},
};
person.displayName1();
person.displayName2();
/*
In window browser answer is C) name1 Jayesh , name2 because arrow function inherits "this" from its outer functio
and window has by default property name that is used for setting or returning the name of a window and in above
In other compilers answer is B) name1 Jayesh , name2 undefined because arrow function inherits "this" from its out
*/
}
// MCQ1();
// ὄ MCQ-2
function MCQ2() {
let name = "Jayesh";
function printName() {
if (name === "Jayesh") {
let name = "JC";
console.log(name);
}
console.log(name);
}
printName();
/* Answer is D) JC, Jayesh because let variables are block scope, name inside if condition will shadow outer name*/
}
// MCQ2();
// ὄ MCQ-3
function MCQ3() {
var player = "Virat";
function displayPlayer() {
if (player === "Virat") {
var player = "VK";
console.log(player);
}
console.log(player);
}
displayPlayer();
/*
Answer is C) undefined because var variables are functional scope, When displayPlayer fn starts executing, Executio
displayPlayer will be created in callstack and at the memory creation phase var variable player is initialized as unde
hence if condition will become false and It will print only undefined.
*/
}
// MCQ3();
// ὄ MCQ-4
function MCQ4() {
const person = {
name: "Jayesh",
age: 24,
};
console.log(person);
console.log(getAge);
/*
Answer is B) { name: 'Jayesh' }, 24 because delete keyword deletes property of an object and we are setting getAge a
*/
}
// MCQ4();
// ὄ MCQ-5
function MCQ5() {
// No Strict Mode
name = "Jayesh"; // window.name ( property of window object )
console.log(delete name);
console.log(displayName);
/*
Answer is A) true, false, JC because delete keyword deletes only property of an object.
delete keyword can not delete local variables ( declared with var, let, and const ) and functions.
delete keyword can delete global variables as they are property of window object.
*/
}
// MCQ5();
// ὄ MCQ-6
function MCQ6() {
const arr = [];
console.log(arr[0]());
console.log(arr[4]());
// ὄA) 0, 4 ὊB) 4, 4
// ὉC) 5, 5 ὠD) TypeError
/*
Answer is C) 5, 5 because variables declared with var keyword are function-scoped or globally-scoped but not block
Inner function will form the closure and points to the updated value of i that is 5.
In the case of Let variable, as they are blocked scoped so inner function will hold different values of i from 0 to 4.
*/
console.log(arrBlock[0]()); // 0
console.log(arrBlock[4]()); // 4
}
// MCQ6();
// ὄ MCQ-7
function MCQ7() {
let person = { name: "Jayesh" };
const personArray = [person];
person = null;
console.log(personArray);
personArray = [];
console.log(personArray);
/*
Answer is B) [ { name: "Jayesh" } ] , TyperError because person = null will only disconnect the person variable from v
[0] will still point to same value { name: "Jayesh"}.
and personArray = [] at this line TyperError as const variable can't be redeclared and throws Uncaught TypeError: A
*/
}
// MCQ7();
// ὄ MCQ-8
function MCQ8() {
const value = { number: 10 };
addition();
addition();
addition(value);
addition(value);
// ὄA) 15, 20, 25, 30 ὊB) 15, 15, 20, 25
// ὉC) 15, 15, 15, 15 ὠD) 15, 15, 15, 20
/*
Answer is D) 15, 15, 15, 20 because when we call addition function 3rd time with passing value object as an argume
umber property of original object ( value in this case ) to 15.
Hence, while calling addition function 4th time will console 15 + 5 => 20.
*/
}
// MCQ8();
// ὄ MCQ-9
function MCQ9() {
function makePerson() {
return {
userName: "Jayesh",
ref: this,
};
}
/*
Answer is C) undefined because "this" keyword in makePerson function will refer to the window object,
person.ref.userName is same as Window.userName and no property named with userName is present in window o
*/
// ὄ MCQ-10
function MCQ10() {
const user = {
userName: "Jayesh",
displayName: function () {
console.log(this.userName);
},
};
setTimeout(user.displayName, 1000);
/*
Answer is B) undefined because setTimeout is using user.displayName as a callback function rather than object me
callback function's "this" will refer to the window object and It will console undefined as there is no property such a
*/
setTimeout(function () {
user.displayName(); // Here, displayName is called by user object ( object method ). Hence, "this" will refer to user
}, 1000);
}
// MCQ10();
// ὄ MCQ-11
function MCQ11() {
const series = { name: "JavaScript-with-JC" };
function getSatus(postNumber) {
return `${this.name} ἱ ${postNumber}`;
}
console.log(getSatus.call(series, 50));
console.log(getSatus.bind(series, 50));
/*
Answer is C) JavaScript-with-JC ἱ 50, [Function: bound getSatus] because call, apply and bind methods are used for f
The call method immediately invokes the borrowed function where as bind method does not invoke the borrowed
that can be called later on with or without passing new arguments to it.
*/
// ὄ We can get 'JavaScript-with-JC ἱ 50, JavaScript-with-JC ἱ 50' as an output by calling borrowed function of bind me
// ὄ MCQ-12
function MCQ12() {
var name = "Jayesh";
function displayName() {
console.log(this.name);
}
const person = {
name: "JC",
method(fn) {
fn();
},
};
person.method(displayName);
// ὄA) JC ὊB) Jayesh
// ὉC) undefined ὠD) TypeError
/*
Answer is B) Jayesh because displayName function is passed to person object method as a callback function.
"this" keyword in displayName function will refer to window object and window object has a property "name" with v
*/
// ὄ We can get JC as an output by attaching call method with fn() inside person method :-
const person2 = {
name: "JC",
method(fn) {
fn.call(this); // borrowing function and passing "this" of person2 object.
},
};
person2.method(displayName); // JC
}
// MCQ12();
// ὄ MCQ-13
function MCQ13() {
var length = 4;
function callback() {
console.log(this.length);
}
const object = {
length: 5,
method: function () {
arguments[0]();
},
};
object.method(callback, 2, 3);
// ὄA) 2 ὊB) 3
// ὉC) 4 ὠD) 5
/*
Answer is B) 3 because arguments keyword is an array of arguments passed to the function.
Here while calling object.method(), we are passing three arguments callback fn(), 2 and 3.
If we try to console arguments it will look like this ὄ
As we can clearly see, arguments is having length property that is equal to number of arguments passed to function
So, arguments[0] is nothing but the first argument passed to function that is callback function in this case.
As we know, Everything in JavaScript is an object ( arguments is also an object which has length property with value
arguments[0]() function's "this" will refer to arguments object. Hence, It will console 3 as an output.
*/
}
// MCQ13();
// ὄ MCQ-14
function MCQ14() {
var name = "Jayesh";
function displayName() {
console.log(this.name);
}
const person = {
name: "JC",
method: displayName.bind(this),
};
person.method();
/*
Answer is A) Jayesh because "this" inside the definition for person object does not refer to person object.
"this" will refer to the window object here, and binding displayName function with passing window's this
as a context will return a copy of bound function that is stored in method property of person object.
So, While calling person.method() will console Jayesh as an output.
*/
// ὄ We can get JC as an output by wrapping displayName.bind(this) inside a function because "this" inside the norm
const person2 = {
name: "JC",
method: function () {
return displayName.bind(this); // Here, "this" refers to the person2 object
},
};
person2.method()(); // JC
}
// MCQ14();
// ὄ MCQ-15
function MCQ15() {
function show() {
console.log(this.name);
}
show = show.bind(person1).bind(person2);
show();
/*
Answer is C) JC because a function which is bound with bind keyword can not be re-bound with other new context, b
once the function is bound to a particular object, It will always be bound to that object no matter how many times it
*/
}
// MCQ15();
// ὄ MCQ-16
function MCQ16() {
let person1 = {
name: { firstName: "Jayesh" },
age: 24,
};
let person2 = { ...person1 };
person2.name.firstName = "Virat";
person2.age = 33;
console.log(person1.name.firstName);
console.log(person1.age);
/*
Answer is D) Virat, 24 because The spread operator makes deep copies of data if the data is not nested.
When we have nested data in an array or object the spread operator will create a deep copy of the top most data
and a shallow copy of the nested data.
person1 and person2 is pointing to different memory address but person1.name and person2.name is pointing to t
// ὄ MCQ-17
function MCQ17() {
for (var i = 0; i < 5; i++) {
setTimeout(
(i) => {
console.log(i);
},
1000,
i
);
}
// ὄA) 0 1 2 3 4 ὊB) 5 5 5 5 5
// ὉC) 4 4 4 4 4 ὠD) 0 1 2 3 4 5
/*
Answer is A) 0 1 2 3 4 because as we are passing i ( 0 to 4 ) value as an argument to setTimeout callback function
therefore this will console different values of i from 0 to 4.
if there was no argument passed to setTimeout callback function then the output would be 5 5 5 5 5 because variab
with var keyword are function-scoped or globally-scoped but not blocked scoped. Inner function i would point to th
*/
}
// MCQ17();
// ὄ MCQ-18
function MCQ18() {
console.log(1);
fetchData();
console.log(4);
// ὄA) 1 2 3 4 ὊB) 1 4 2 3
// ὉC) 1 2 4 3 ὠD) 1 3 4 2
/*
Answer is C) 1 2 4 3 beacause promise is used to handle the asynchronous result of an operation and
callback functions attached to the promises are stored into microtask queue.
So, first synchronous code will be executed i.e 1,2,4 and once callstack is empty, event loop pushes the microtask qu
callstack will start executing the task and It will console 3 at last.
*/
}
// MCQ18();
// ὄ MCQ-19
function MCQ19() {
console.log("start");
promise.then((result) => {
console.log(result);
});
console.log("end");
/*
Answer is B) start 1 3 end 2 beacause The function we pass into the Promise constructor runs synchronously,
but anything that depends on its resolution ( resolve or reject ) will be called asynchronously.
Even if the promise resolves immediately, any handlers ( callback attached to promise then and catch ) will execute
// ὄ MCQ-20
function MCQ20() {
console.log("First");
const promise = new Promise((resolve) => {
console.log("Second");
});
promise.then((result) => {
console.log(result);
});
console.log("Third");
/*
Answer is D) First Second Third because as there is no resolve in Promise constructor, So it will not go inside of .the
*/
}
// MCQ20();
// ὄ MCQ-21
function MCQ21() {
const fetchData = function () {
return new Promise((resolve, reject) => {
reject();
});
};
fetchData()
.then(() => {
console.log("Success 1");
})
.catch(() => {
console.log("Error 1");
})
.then(() => {
console.log("Success 2");
});
/*
Answer is C) Error 1 Success 2 because in promise chaining .then method below .catch method will be called if in .ca
returning rejected promise ( by default implicitly returns a promise that is handled by it's below .then method )
*/
}
// MCQ21();
// ὄ MCQ-22
function MCQ22() {
function foo() {
let a = (b = 0);
a++;
return a;
}
foo();
console.log(typeof a);
console.log(typeof b);
// ὄA) undefined number ὊB) ReferenceError number
// ὉC) undefined undefined ὠD) number number
/*
Answer is A) undefined number because variable a is declared with let it is blocked scope and will be "not defined" o
The typeof operator returns "undefined" even for “undeclared” (or “not defined”) variables.
Notice that there was no error thrown when we executed typeof a, even though a is an undeclared variable.
This is a special safety guard in the behavior of typeof.
and variable b is a just global scope variable hence it will be available outside function foo() also.
*/
}
// MCQ22();
// ὄ MCQ-23
function MCQ23() {
console.log("start");
setTimeout(() => {
console.log("first");
}, 0);
console.log("end");
// ὄA) start end first second ὊB) start first second end
// ὉC) start end second first ὠD) start first end second
/*
Answer is C) start end second first because callback function attached to Promises added into microtask queue
whereas callback function of setTimeout added into callback ( macroTask ) queue.
microTask queue has more priority than callback ( macroTask ) queue.
*/
}
// MCQ23();
// ὄ MCQ-24
function MCQ24() {
const person1 = {
name: "Jayesh",
age: 24,
};
console.log(person1.name);
console.log(person2.name);
/*
Answer is B) Virat Virat because objects are passed as a reference, person1 and person2 will hold the same memory
and altering any property of person2 will modify property of person1 as well.
*/
}
// MCQ24();