Loading...
// let age = 21;
// if (age > 18) {
// console.log('Entry Granted!');
// }
// console.log(1000 + 100);
// let num = 32;
// if (num % 2 !== 0) {
// console.log('ODD');
// }
// if (num % 2 === 0) {
// console.log('EVEN');
// }
// let num = 35;
// if (num % 2 !== 0) {
// console.log('ODD');
// } else if (num % 2 === 0) {
// console.log('EVEN');
// }
// let age = 67;
// if (age > 18) {
// console.log('Entry Granted!');
// } else if (age >= 21) {
// console.log('Drinks Allowed');
// } else if (age >= 65) {
// console.log('Drinks FREE!');
// } else {
// console.log('ENTRY DENIED!');
// }
// let num = 13;
// if (num % 2 !== 0) {
// console.log('ODD');
// } else {
// console.log('EVEN');
// }
// let age = 20;
// if (age > 18) {
// if (age >= 65) {
// console.log('Drinks FREE!');
// } else if (age >= 21) {
// console.log('Drinks Allowed');
// } else {
// console.log('Entry Granted!');
// }
// } else {
// console.log('NO ENTRY');
// }
// let isLoggedIn;
// // let name = -45;
// if (isLoggedIn) {
// console.log('Hello!');
// } else {
// console.log('Please login');
// }
// let loggedInUser = 10;
// if (loggedInUser) {
// console.log('Please log in');
// } else {
// console.log(`Welcome ${loggedInUser}`);
// }
let age = 100;
let city = 'delhi';
if (age >= 18 && age < 21 && city !== 'delhi') {
console.log('Entry Granted!');
} else if (age >= 21 && age < 65 && city !== 'delhi') {
console.log('Drinks Allowed');
} else if (age >= 65 && city !== 'delhi') {
console.log('Drinks FREE!');
} else {
console.log('ENTRY DENIED!');
}
if (city === 'delhi') {
console.log('ENTRY DENIED!');
} else if (age >= 18 && age < 21) {
console.log('Entry Granted!');
} else if (age >= 21 && age < 65) {
console.log('Drinks Allowed');
} else if (age >= 65) {
console.log('Drinks FREE!');
} else {
console.log('ENTRY DENIED!');
}
// let day = 2;
// switch (day) {
// case 1:
// case 2:
// case 3:
// console.log('HELLO WORLD');
// break;
// case 4:
// console.log('THURSDAY');
// break;
// case 5:
// console.log('FRIDAY');
// break;
// case 6:
// console.log('SATURDAY');
// break;
// case 7:
// console.log('SUNDAY');
// break;
// default:
// console.log('INVALID DAY');
// }
// let num = 'nsdkjnasdlkj';
// num === 7 ? console.log('LUCKY') : console.log('UNLUCKY');
// if (num === 7) {
// console.log('LUCKY');
// } else {
// console.log('UNLUCKY');
// }
// let status = 'Offline'.toLowerCase();
// let color =
// status === 'offline' ? 'red' : status === 'inactive' ? 'yellow' : 'green';
// // console.log(color);
// let status = 'inactive';
// let color;
// if (status === 'offline') {
// color = 'red';
// } else if (status === 'inactive') {
// color = 'yellow';
// } else {
// color = 'green';
// }
// console.log(color);
// let s = [10 < 5]
let search = 'Predator';
const currentlyPlaying = ['Alien', 'Mad Max', 'Inception', 'Predator'];
if (currentlyPlaying.includes(search)) {
console.log(`${search} is playing in theatres around you. Book now?`);
} else {
console.log('Ye kya hai');
}
// const allProducts = [];
// // products (array)
// const iPhone = ['Apple iPhone 14', 200000, 'Apple', 'gold', 4, 512];
// const onePlus = [56000, 'One Plus 9', 'One Plus', 'silver', 5, 128];
// const iPhone = {
// 0: 'Apple iPhone 14',
// 1: 20000,
// 2: 'asdsad',
// };
// const iPhone = {
// name: 'Apple iPhone 14',
// price: 200000,
// brand: 'Apple',
// color: 'gold',
// rating: 4,
// 45: 512,
// 'avg lifetime': 2,
// };
// const onePlus = {
// storage: 128,
// color: 'silver',
// brand: 'One Plus',
// };
// allProducts.push(iPhone, onePlus);
// console.log(allProducts);
// iPhone[0];
// iPhone[1];
// iPhone[3];
// const users = [];
// const user1 = {
// firstName: 'John',
// lastName: 'Doe',
// age: 25,
// phone: null,
// address: {
// city: 'Mumbai',
// state: 'Maharastra',
// streetName: 'Matunga',
// },
// favItems: [
// {
// name: 'Apple iPhone 14',
// price: 200000,
// brand: 'Apple',
// color: 'gold',
// rating: 4,
// 45: 512,
// 'avg lifetime': 2,
// },
// {
// storage: 128,
// color: 'silver',
// brand: 'One Plus',
// },
// ],
// };
// const pallette = {
// red: '#eb4d4b',
// yellow: '#f9ca24',
// blue: '#30336b',
// };
// let color = 'green';
// console.log(pallette[color]);
// const fitnessData = {
// totalSteps: 400000,
// totalKms: 253.32,
// avgCalorieBurn: 2300,
// workoutsThisWeek: '5 of 7',
// avgSleep: '5:45',
// }
// // Adding new property
// fitnessData.BPM = 98
// fitnessData['progress'] = 'Good'
// // Updating Properties
// fitnessData.workoutsThisWeek = '7 of 7'
// fitnessData.totalKms += 10
// fitnessData.totalSteps++
// const nums = [12, 34, 56, 34, 78, 54, 23, 12];
// for (let i = 0; i < nums.length; i++) {
// console.log(`The value at index ${i} is ${nums[i]}`);
// }
// const movies = [
// { movieName: 'Inception', rating: 3.8 },
// { movieName: 'Avengers', rating: 3.4 },
// { movieName: 'Iron Man', rating: 2.9 },
// ];
// for (let i = 0; i < movies.length; i++) {
// // let movie = movies[i];
// // console.log(`Movie Name: ${movie.movieName}\nRating: ${movie.rating}`);
// console.log(
// `Movie Name: ${movies[i].movieName}\nRating: ${movies[i].rating}`
// );
// }
// const word = 'Hello World';
// // for (let i = 0; i < word.length; i++) {
// // console.log(word[i]);
// // }
// let reversedWord = '';
// for (let i = word.length - 1; i >= 0; i--) {
// reversedWord += word[i];
// // console.log(word[i]);
// }
// console.log(reversedWord);
// for (let i = 1; i <= 10; i++) {
// console.log('OUTER LOOP: ', i);
// for (let j = 10; j >= 0; j -= 2) {
// console.log(' INNER LOOP', j);
// }
// }
// OUTER LOOP: 1
// INNER LOOP: 10
// INNER LOOP: 8
// INNER LOOP: 6
// INNER LOOP: 4
// INNER LOOP: 2
// INNER LOOP: 0
// OUTER LOOP: 2
const gameBoard = [
[4, 64, 8, 4],
[128, 32, 4, 16],
[16, 4, 4, 32],
[2, 16, 16, 2],
];
let total = 0;
for (i = 0; i < gameBoard.length; i++) {
for (j = 0; j < gameBoard[i].length; j++) {
total += gameBoard[i][j];
}
}
console.log(total);
// let day = 'Hello World';
// switch (day) {
// case 1:
// console.log('MONDAY');
// break;
// case 2:
// console.log('TUESDAY');
// break;
// case 'Hello World':
// console.log('WEDNESDAY');
// break;
// case 4:
// console.log('THURSDAY');
// break;
// case 5:
// console.log('FRIDAY');
// break;
// case 6:
// console.log('SATURDAY');
// break;
// case 7:
// console.log('SUNDAY');
// break;
// default:
// console.log('INVALID DAY');
// }
// let num = -1;
// num === 7 ? console.log('LUCKY') : console.log('UNLUCKY');
// for (let i = 1; i <= 10; i++) {
// console.log('OUTER LOOP: ', i);
// for (let j = 10; j >= 0; j -= 2) {
// console.log(' INNER LOOP', j);
// }
// }
let characters = 'abcdefghijklmnopqrstuvwxyz';
// for (let i = 0; i < 10; i++) {
// console.log(i);
// }
// let j = 0;
// while (j < 10) {
// console.log(j);
// j++;
// }
// const target = Math.floor(Math.random() * 100) + 1;
// let guess = Math.floor(Math.random() * 100) + 1;
// while (guess !== target) {
// console.log(`Target: ${target} | Guess: ${guess}`);
// guess = Math.floor(Math.random() * 100) + 1;
// }
// console.log(`\nGame over! \nTarget: ${target} | Guess: ${guess}`);
// Ex 2
// const target = Math.floor(Math.random() * 100) + 1;
// let guess = Math.floor(Math.random() * 100) + 1;
// while (guess !== target) {
// if (guess === 13) {
// console.log('13 is an unlucky number.\nBreaking out of this loop.');
// break; // manually break out of the loop
// }
// console.log(`Target: ${target} | Guess: ${guess}`);
// guess = Math.floor(Math.random() * 100) + 1;
// }
// console.log(`\nGame over!\nTarget: ${target} | Guess: ${guess}.`);
// Ex 3
// const target = Math.floor(Math.random() * 100) + 1;
// let guess = Math.floor(Math.random() * 100) + 1;
// // true -> loop forever
// while (true) {
// console.log(`Target: ${target} | Guess: ${guess}`);
// if (target === guess) {
// break; // break out of the loop when condition is true
// }
// guess = Math.floor(Math.random() * 100) + 1;
// }
// console.log(`\nGame over!\nTarget: ${target} | Guess: ${guess}.`);
// let categories = [
// 'fashion',
// 'electronics',
// 'mobiles',
// 'books',
// 'toys',
// 'groceries',
// ];
// for (let i = 0; i < categories.length; i++) {
// console.log(categories[i]);
// }
// for (let category of categories) {
// console.log(category);
// }
// for (let char of 'hello') {
// console.log(char.toUpperCase());
// }
// const matrix = [
// [3, 4, 7],
// [9, 7, 2],
// [9, 4, 6],
// ];
// let total = 0;
// for (let row of matrix) {
// for (let num of row) {
// console.log(num);
// total += num;
// }
// }
// console.log(total);
// const cats = ['fashion', 'mobiles', 'books'];
// const prods = ['tshirt', 'samsung', '1984', 'extra'];
// for (let i = 0; i < cats.length; i++) {
// console.log(cats[i], prods[i]);
// }
// const productPrices = {
// Apple: 80000,
// OnePlus: 50000,
// Samsung: 90000,
// };
// console.log(productPrices.length);
// for (let product of Object.keys(productPrices)) {
// console.log(`You can buy a ${product} for ${productPrices[product]}`);
// }
// const prices = Object.values(productPrices);
// let total = 0;
// for (price of prices) {
// total = total + price;
// }
// console.log(total);
// const movieRating = {
// pursuitOfHappiness: 4.8,
// satya: 4.8,
// gangsOfWasepur: 4,
// robot: -3,
// };
// let total = 0;
// for (let movie in movieRating) {
// // console.log(movie)
// console.log(`${movie} has a rating of ${movieRating[movie]}`);
// total += movieRating[movie];
// }
// console.log(total);
// Named function
// function greet() {
// console.log('Hey there!');
// console.log('How are you?');
// }
// greet();
// greet();
// greet();
// greet();
// greet();
// greet();
// greet();
// // Another Example
// function rollDie() {
// let roll = Math.floor(Math.random() * 6) + 1;
// console.log(`Rolled: ${roll}`);
// }
// // rollDie();
// function throwDice() {
// rollDie();
// rollDie();
// rollDie();
// rollDie();
// }
// throwDice();
// // Function with a parameter
// function greet(name, age) {
// if (typeof name === 'string' && typeof age === 'number') {
// console.log(`How are you, ${name}. You are ${age} years old`);
// } else {
// console.log('Please enter values of correct types.');
// }
// }
// greet('John', 25); // How are you, John
// greet('Jack', 27); // How are you, Jack
// greet('100', 'hello');
// greet([1, 2, 3, 4], true);
// function add(a, b, c) {
// console.log(a + b + c);
// }
// // add(10, 20, '100');
// add('John', 'Doe');
// function add(b, bro) {
// console.log(b + bro);
// }
// // add(10, 20, '100');
// add('John', 'Doe');
// function rollDie() {
// let roll = Math.floor(Math.random() * 6) + 1;
// console.log(`Rolled: ${roll}`);
// }
// function throwDice(times) {
// for (let i = 0; i < times; i++) {
// rollDie();
// }
// }
// throwDice(4);
// function add(a, b) {
// console.log(a + b);
// return a + b;
// }
// console.log(add(10, 15) + 100);
// function isNumber(val) {
// if (typeof val !== 'number') {
// return false;
// } else {
// return true;
// // console.log('Hello World');
// }
// }
// let res1 = isNumber(20);
// console.log(res1);
// let res2 = isNumber('hello');
// console.log(res1, res2);
// function greet(name, age) {
// if (typeof name === 'string' && isNumber(age)) {
// console.log(`How are you, ${name}. You are ${age} years old`);
// } else {
// console.log('Please enter values of correct types.');
// }
// }
// greet('John Doe', 25);
let chars = 'abcdefghijklmnopqrstuvwxyz';
let i = 0;
for (let char of chars) {
console.log(i, char);
i++;
}
// // definition
// function add(a, b) {
// return a + b;
// }
// console.log(add(10, 10));
// let fullName = 'John Doe';
// function greet() {
// let fullName = 'Jack Doe';
// console.log(fullName);
// }
// function ungreet() {
// let fullName = 'Jane Ma';
// console.log(fullName);
// }
// for (let i = 0; i < 10; i++) {
// let fullName = 'jane doe';
// console.log(fullName);
// }
// greet();
// ungreet();
// console.log(fullName);
// let first_name = 'Jack';
// let last_name = 'Ma';
// if (true) {
// var first_name = 'John';
// var last_name = 'Doe';
// console.log(first_name + ' ' + last_name);
// }
// console.log(first_name + ' ' + last_name);
// var i = 0;
// for (; i < 10; i++) {
// console.log(i);
// }
// for (; i < 100; i++) {
// console.log(i);
// }
// console.log(i);
// console.log(i + 100);
// function ungreet() {
// var fullName = 'Jane Ma';
// console.log(fullName);
// }
// ungreet();
// console.log(fullName);
// function outer(movie) {
// // let movie = 'Avengers';
// // nested function
// function inner() {
// // let movie = 'Robot';
// let ratings = `${movie} has a rating of 3`;
// console.log(ratings);
// }
// // console.log(ratings);
// inner();
// }
// outer('Krish');
// // function expression or anonymous function
// const square = function (num) {
// return num * num;
// };
// // console.log(square(10));
// const myArr = [
// function (num) {
// return num * num * num;
// },
// function (num) {
// return num * num;
// },
// ];
// console.log(myArr[0](40));
// console.log(myArr[1](40));
// const product = function (x, y) {
// return x * y;
// };
// console.log(product(45, 68));
// function add(x, y) {
// return x + y;
// }
// const sub = function (x, y) {
// return x - y;
// };
// const mul = function (x, y) {
// return x * y;
// };
// function div(x, y) {
// return x / y;
// }
// console.log(add, sub, mul, div(10, 2));
// const operations = [add, sub, mul, div];
// console.log(operations[0]); // [Function: add]
// console.log(operations[0](10, 23));
// console.log(operations[2](10, 4));
// for (let op of operations) {
// let result = op(10, 2);
// console.log(result);
// }
// const operations = {
// add: function (a, b) {
// return a + b;
// },
// sub: function (a, b) {
// return a - b;
// },
// multipy: mul,
// };
// console.log(operations.add(10, 20));
// console.log(operations.sub(10, 20));
// // console.log(operations.multipy(10, 20));
// function multipleGreets(fn, fn2) {
// fn();
// fn();
// fn();
// fn2();
// }
// function sayHello() {
// console.log('Hello World!');
// }
// // multipleGreets(sayHello);
// multipleGreets(function () {
// console.log('GOODBYE!');
// }, sayHello);
// function repeat(func, num) {
// for (let i = 0; i < num; i++) {
// func();
// }
// }
// function sayHello() {
// console.log('Hello World!');
// }
// function sayGoodbye() {
// console.log('Bye World!');
// }
// repeat(sayHello, 10);
// repeat(sayGoodbye, 5);
// function randomPick(f1, f2) {
// let randNum = Math.random();
// if (randNum < 0.5) {
// f1();
// } else {
// f2();
// }
// }
// randomPick(sayHello, sayGoodbye);
function raiseBy(num) {
return function (x) {
return x ** num;
};
}
let square = raiseBy(2);
let cube = raiseBy(3);
let tesseract = raiseBy(4);
console.log(square(2));
console.log(cube(2));
console.log(tesseract(2));
// function multipleGreets(fn) {
// fn();
// fn();
// fn();
// }
// function sayHello() {
// console.log('Hello World');
// }
// multipleGreets(sayHello);
// // const myFn = function () {
// // console.log('Good bye');
// // }
// // myFn()
// multipleGreets(function () {
// console.log('Good bye');
// });
// console.log('Starting...');
// function logHello() {
// console.log('Welcome World!');
// }
// setTimeout(logHello, 2000);
// setTimeout(function () {
// let num1 = 10;
// let num2 = 20;
// console.log(num1 + num2);
// }, 5000);
// console.log('Finished');
// var person = 'John';
// console.log(person);
// console.log(age);
// console.log(job);
// var person = 'John';
// var age = 25;
// var job = 'Programmer';
// let person = 'John';
// let age = 25;
// let job = 'Programmer';
// const nums = [9, 2, 4, 6, 2, 3, 7, 6];
// console.log(nums.length);
// nums.forEach(function (n) {
// console.log(`${n} time gaali`);
// console.log(n * n);
// });
// for (let n of nums) {
// console.log(n * n * n * n);
// }
// nums.forEach(function (el) {
// if (el % 2 === 0) {
// console.log(el);
// }
// });
// const movies = [
// {
// title: 'Avengers',
// rating: 4.1,
// },
// {
// title: 'Dr. Strange',
// rating: 3.9,
// },
// {
// title: 'Tenet',
// rating: 4.3,
// },
// {
// title: 'Joker',
// rating: 4.7,
// },
// ];
// using forEach method
// movies.forEach(function (movie) {
// console.log(movie.title.toUpperCase());
// });
// for (let movie of movies) {
// console.log(movie.title.toLowerCase());
// }
// movies.forEach(function (movie, idx) {
// console.log(idx, movie.title);
// });
// const moviesUppercase = [];
// // for (let movie of movies) {
// // moviesUppercase.push(movie.title.toUpperCase());
// // // console.log(movie.title.toLowerCase());
// // }
// movies.forEach(function (movie) {
// moviesUppercase.push(movie.title.toUpperCase());
// });
// console.log(moviesUppercase);
// const names = ['john', 'jack', 'jane', 'james'];
// const namesCapped = names.map(function (name) {
// // console.log(name.toUpperCase());
// return name.toUpperCase();
// });
// console.log(namesCapped);
// // ['JOHN', 'JACK', 'JANE', 'JAMES']
// const moviesUppercase = [];
// for (let movie of movies) {
// moviesUppercase.push(movie.title.toUpperCase());
// }
// movies.forEach(function (movie) {
// moviesUppercase.push(movie.title.toUpperCase());
// });
// const moviesUppercase = movies.map(function (movie) {
// return movie.title.toUpperCase();
// });
// console.log(moviesUppercase);
// const nums = [2, 3, 4, 7, 6, 8, 13, 10, 19, 12, 14, 22, 21, 16];
// const doubles = nums.map(function (num) {
// return num * 2; // we have to return a value
// });
// console.log(doubles);
// const numDetails = nums.map(function (num) {
// return {
// number: num,
// isEven: num % 2 === 0,
// };
// });
// console.log(numDetails);
// ----------------------
// // named function
// function square(x) {
// return x * x;
// }
// // function expression
// const square = function (x) {
// return x * x
// }
// // // arrow function
// // const square = x => {
// // return x * x;
// // };
// // const square = () => {
// // return 'Hello';
// // };
// const sq = x => x * x
// // console.log(square(5));
// console.log(sq(10))
// const nums = [2, 3, 4, 7, 6, 8, 13, 10, 19, 12, 14, 22, 21, 16];
// const doubles = nums.map((num) => {
// return num * 2;
// });
// console.log(doubles);
// const nums = [2, 3, 4, 7, 6, 8, 13, 10, 19, 12, 14, 22, 21, 16]
// const doubles = nums.map(function (num) {
// return num * 2
// })
// const triples = nums.map(x => x ** 3)
// console.log(doubles)
// console.log(triples)
const nums = [1, 2, 3, 4, 5, 6];
// const doubles3 = nums.map((n) => n * 2);
const parityList = nums.map(n => (n % 2 === 0 ? 'Even' : 'Odd'));
const parityList = [];
for (let n of nums) {
if (n % 2 === 0) {
parityList.push('Even');
} else {
parityList.push('Odd');
}
}
console.log(parityList);
// let movies = ['The Terminator', 'The Avengers', 'Jurassic Park', 'Titanic'];
// let movie1 = movies.find((movie) => {
// return movie.includes('Avenge');
// });
// let movie2 = movies.find((movie) => movie.includes('Park'));
// let movie3 = movies.find((m) => m.indexOf('A') === 0);
// console.log(movie1);
// console.log(movie2);
// console.log(movie3);
const books = [
{
title: 'The Shining',
author: 'Stephen King',
rating: 4.1,
},
{
title: 'Sacred Games',
author: 'Vikram Chandra',
rating: 4.5,
},
{
title: '1984',
author: 'George Orwell',
rating: 4.9,
},
{
title: 'The Alchemist',
author: 'Paulo Coelho',
rating: 3.5,
},
{
title: 'The Great Gatsby',
author: 'F. Scott Fitzgerald',
rating: 3.8,
},
{
title: 'Two States',
author: 'Chetan Bhagat',
rating: 5,
},
];
// const goodBook = books.find((book) => book.rating >= 4.3);
// const lowRated = books.find((book) => {
// return book.rating < 4;
// });
// console.log(goodBook);
// console.log(books.find((b) => b.author.includes('George')));
// console.log(lowRated);
// // const lowRated = books.find(function (book) {
// // return book.rating < 4;
// // });
// books.find((book) => book.rating < 4)
// const nums = [9, 8, 3, 4, 6, 12, 17, 23, 0];
// const odds = nums.filter((n) => n % 2 === 1);
// const odds = nums.filter((n) => n === 0);
// const odds = nums.find((n) => n === 0);
// const odd = nums.find((n) => n % 2 === 1);
// console.log(odds);
// console.log(odd);
// const bigNums = nums.filter((n) => n > 10);
// console.log(bigNums);
// const goodBooks = books.filter((b) => b.rating >= 4.3);
// const georgeBooks = books.filter((b) => b.author.includes('George'));
// const lowRated = books.filter((book) => book.rating < 4);
// console.log(goodBooks);
// console.log(georgeBooks);
// console.log(lowRated);
// let query = 'Alch';
// const filteredBooks = books.filter((book) => {
// const title = book.title.toLowerCase();
// return title.includes(query.toLowerCase());
// });
// console.log(filteredBooks);
// const names = ['jack', 'james', 'john', 'jana', 'josh', 'brad'];
// console.log(names.every((word) => word[0] === 'j'));
// console.log(names.every((word) => word.length > 3));
// let result = names.every((w) => {
// let lastChar = w[w.length - 1];
// return lastChar !== 'a';
// });
// console.log(result);
// const bestBooks = books.every((book) => book.rating >= 3);
// console.log(bestBooks);
// const notAuthor = books.every(
// (book) => book.author.toLowerCase() !== 'chetan bhagat'
// );
// console.log(notAuthor);
// const names = ['jack', 'james', 'john', 'jane', 'josh', 'brad'];
// const res = names.some((word) => {
// return word[0] === 'b';
// });
// console.log(res);
// const prices = [500.4, 211, 23, 5, 4, 22.2, -23.2, 9233];
// // console.log(prices.sort());
// // lowest to highest
// // console.log(prices.sort((a, b) => a - b));
// // console.log(prices.sort((a, b) => b - a));
// console.log(books.sort((a, b) => b.rating - a.rating));
// console.log(books);
// const nums = [3, 2, 4, 6, 9, 10];
// const res = nums.reduce((acc, currVal) => {
// return acc - currVal;
// });
// console.log(res);
// let nums = [21, 221, 2, 1, 34, 123, 4342, 56, 4];
// const maxVal = nums.reduce((max, currentVal) => {
// if (currentVal > max) {
// return currentVal;
// }
// return max;
// });
// console.log(maxVal);
// const maxVal = nums.reduce((max, currVal) => Math.max(max, currVal));
// console.log(maxVal);
// const nums = [3, 2, 4, 6, 9];
// const res = nums.reduce((acc, currVal) => {
// return acc + currVal;
// }, 1000);
// console.log(res);
// const multiply = (x = 1, y = 1) => {
// return x * y;
// };
// const multiply = (x, y) => {
// if (typeof y === 'undefined') {
// y = 1;
// }
// y = typeof y === 'undefined' ? 1 : y;
// return x * y;
// };
// console.log(multiply(8, 5));
const greet = (name = 'Ukn', msg) => {
console.log(`${msg}, ${name}`);
};
// greet('John', 'Hey'); // "Hey John"
// greet(); // "Hi Ukn"
greet('hello'); // "Hi John"
let age = 99;
let welcome = age < 18 ? () => console.log('Baby') : () => console.log('Adult');
welcome();
// function printVals(a, b, c) {
// console.log(a);
// console.log(b);
// console.log(c);
// }
// const names = ['john', 'jack', 'jane', 'brad', 'tom', 45, true, 'gaali'];
// const name = 'john';
// // printVals(names);
// // printVals(['john', 'jack', 'jane'], undefined, undefined);
// // printVals(...names);
// // printVals('john', 'jack', 'jane');
// // printVals(...names);
// printVals(...name);
// const moderator = { canEdit: true, authority: 5 };
// const user = { canView: true, authority: 2.5 };
// const admin = { ...moderator, access: 'GROUP' };
// function add(x, y) {
// return x + y;
// }
// console.log(add(10, 45, 50));
// console.log(Math.max(10, 45, 32, 67, 4, 4500));
// const addAll = (...nums) => nums.reduce((acc, curr) => acc + curr);
// console.log(addAll(10, 45, 32, 67, 89, 100, 200));
// function printNames(name1, name2, name3, ...others) {
// console.log(name1);
// console.log(name2);
// console.log(name3);
// console.log(others);
// }
// printNames('john', 'jane', 'jack', 'josh', 'james', 'jamie');
// const user = {
// firstName: 'John',
// lastName: 'Doe',
// email: 'john.doe@gmail.com',
// phone: 99982234567,
// };
// const firstName = user.firstName;
// const lastName = user.lastName;
// const emailAddress = user.email;
// const { firstName, lastName, email: emailAddress } = user;
// console.log(firstName, lastName, emailAddress);
// const firstName = user.firstName;
// const { firstName, lastName, emailAddress, phone } = user;
// const { firstName, lastName, email, phone } = user;
// console.log(firstName, lastName, email);
// const { firstName, lastName, ...others } = user;
// console.log(firstName, lastName, others);
// console.log(others);
// const fullName = ({ firstName: first, lastName: last }) => {
// return `${first} ${last}`;
// };
// const fullName = ({ firstName, lastName }) => {
// return `${firstName} ${lastName}`;
// };
// // const fullName = (obj) => {
// // return `${obj.firstName} ${obj.lastName}`;
// // };
// const user = {
// firstName: 'John',
// lastName: 'Doe',
// emailAddress: 'john.doe@gmail.com',
// };
// console.log(fullName({ firstName: 'Jane', lastName: 'Doe' }));
// const movieReviews = [4.5, 5.0, 3.2, 2.1, 4.7, 3.8, 3.1, 3.9, 4.4];
// const highest = Math.max(...movieReviews);
// const lowest = Math.min(...movieReviews);
// let total = 0;
// movieReviews.forEach((rating) => (total += rating));
// const average = total / movieReviews.length;
// console.log(highest);
// console.log(lowest);
// console.log(average);
// const info = {
// highest: highest,
// lowest: lowest,
// average: average,
// };
// const info = {
// highest,
// lowest,
// averageRating: average,
// };
// const info = { highest, lowest, average };
// console.log(info);
// const getReviewDetails = (arr) => {
// const highest = Math.max(...arr);
// const lowest = Math.min(...arr);
// const total = arr.reduce((accumulator, nextVal) => accumulator + nextVal);
// const average = total / arr.length;
// return {
// highest,
// lowest,
// total,
// average,
// };
// };
// const res = getReviewDetails([4.5, 5.0, 3.2, 2.1, 4.7, 3.8, 3.1, 3.9, 4.4]);
// console.log(res);
function printVals(a, b, c) {
console.log(a);
console.log(b);
console.log(c);
}
const names = ['john', 'jack', 'jane'];
const name = 'john';
// printVals(names); // incorrect behaviour
// printVals(...names); // works!
printVals(...name);
// let fullName = 'John Doe';
// let role = 'Moderator';
// let label = 'age';
// let info = ['age', 25];
// const user = {
// firstName: fullName.split(' ')[0],
// lastName: fullName.split(' ')[1],
// role: role.toUpperCase(),
// [label]: info[1],
// [info[1] * 100]: 'Test Value',
// };
// console.log(user);
// const addProperty = (obj, k, v) => {
// return { ...obj, [k]: v };
// };
// const res = addProperty({ name: 'John' }, 'age', 25);
// console.log(res);
// const math = {
// multiply: function (x, y) {
// return x * y;
// },
// divide: function (x, y) {
// return x / y;
// },
// subtract: function (x) {
// return x - x;
// },
// };
// const square = (x) => x * x;
// const math = {
// PI: 3.14,
// multiply: (x, y) => x * y, // method
// divide: (x, y) => x / y, // method
// subtract: (x, y) => x - y, // method
// square,
// };
// console.log(math.square(5));
// console.log(square(5));
// // function
// const multiply = (x, y) => x * y;
// console.log(multiply(10, 5));
// console.log(math.subtract(10, 5));
// console.log(console);
// console.log(Math);
// const math = {
// PI: 3.14,
// multiply(x, y) {
// return x * y;
// },
// divide(x, y) {
// return x * y;
// },
// subtract(x, y) {
// return x * y;
// },
// square,
// };
// console.log(math);
// console.log(math.multiply(10, 10));
// function sayHello() {
// console.log('Hello World!');
// // console.log(this.closed);
// // console.log(window.closed);
// function greet() {
// console.log(this);
// }
// greet();
// }
// sayHello();
// const helloWorld = 'Hello World !!!!!';
// sayHello();
// window.sayHello();
// console.log(window.helloWorld);
// const user = {
// firstName: 'John',
// lastName: 'Doe',
// role: 'admin',
// fullName() {
// console.log(this);
// },
// };
// const math = {
// PI: 3.14,
// multiply(x, y) {
// console.log(this.PI);
// return x * y;
// },
// divide(x, y) {
// return x * y;
// },
// subtract(x, y) {
// return x * y;
// },
// };
// function logThis() {
// console.log(this);
// }
// user.fullName();
// math.multiply(10, 34);
// logThis();
// const firstName = "Jack"
// const user = {
// firstName: 'John',
// lastName: 'Doe',
// role: 'admin',
// fullName() {
// console.log(`${this.firstName} ${this.lastName} is an ${this.role}`);
// },
// };
// user.fullName();
// const user = {
// firstName: 'John',
// lastName: 'Doe',
// role: 'admin',
// fullName() {
// const { firstName, lastName, role } = this; // Object Destructuring
// console.log(`${firstName} ${lastName} is an ${role}`);
// },
// };
// user.fullName();
// user.firstName = 'Jack';
// user.fullName();
// const user = {
// firstName: 'John',
// lastName: 'Doe',
// role: 'admin',
// fullName() {
// return `${this.firstName} ${this.lastName} is an ${this.role}`;
// },
// logDetails() {
// console.log(this);
// return `${this.fullName()} and is cool!`;
// },
// square(x) {
// return x * x;
// },
// };
// const logDetails = user.logDetails;
// user.logDetails();
// logDetails();
// user.logDetails();
// const square = user.square;
// console.log(square(5));
// const logDetails = user.logDetails;
// console.log(logDetails());
// logDetails();
// const hellos = {
// messages: [
// 'hello world',
// 'hello universe',
// 'hello darkness',
// 'hello hello',
// 'heylo',
// ],
// pickMsg() {
// const index = Math.floor(Math.random() * this.messages.length);
// return this.messages[index];
// },
// begin: () => `Hello ${this.pickMsg()}`,
// begin2() {
// return `Hello ${this.pickMsg()}`;
// },
// start() {
// setInterval(() => {
// console.log(this.pickMsg());
// }, 1000);
// },
// };
// console.log(hellos.pickMsg());
// hellos.start();
// console.log(hellos.begin2());
// console.log('\n\n\n');
// console.log(hellos.begin());
// const products = [
// { title: 'hello world', price: 99 },
// { title: 'console log this', price: 99 },
// { title: 'hello universe', price: 99 },
// { title: 'start this product', price: 99 },
// ];
// const findProducts = (searchTerm) => {
// return products.filter((prod) => prod.title.includes(searchTerm));
// };
// let res = findProducts('hello');
// console.log(res);
// let USD = 75;
// const productsINR = products.map((prod) => prod.price * USD);
//Exercise 6;
// const productINR = products.map((prod) => ({
// id: prod.id,
// title: prod.title,
// description: prod.description,
// category: prod.category,
// image: prod.image,
// price: prod.price * 75,
// }));
const productINR = products.map((prod) => ({
...prod,
price: prod.price * 75,
}));
console.log(productINR);
// console.log('Hello world');
// const pageTitle = document.getElementById('mainTitle');
// const paras = document.getElementsByTagName('p');
// const imgs = document.getElementsByTagName('img');
// // console.dir(pageTitle);
// // console.dir(paras);
// // for (let p of paras) {
// // console.log(p.outerHTML);
// // }
// console.dir(imgs);
// const myImage = document.getElementById('impImg');
// // console.dir(myImage);
// const specialEls = document.getElementsByClassName('special');
// // console.dir(specialEls[1]);
// const specialLists = document.getElementsByClassName('special-list');
// // console.dir(specialLists[0]);
// // console.log(document.getElementsByClassName('special'));
// const pageTitle = document.querySelector('#mainTitle');
// const pageLists = document.querySelector('.special');
// const unordered = document.querySelectorAll('ul > li');
// const title = document.querySelectorAll('h1');
// console.log(pageTitle);
// console.log(pageLists);
// console.log(unordered);
// console.log(title);
// const h1 = document.querySelector('h1');
// console.log(h1.innerText);
// h1.innerText = 'RST FORUM';
// console.log(document.body.innerText);
// const img = document.querySelector('img');
// // document.body.innerText = 'HELLO WORLD';
// img.innerText = 'HI!';
// const ul = document.querySelector('ul');
// ul.innerText = 'CHANGED all of this';
// // console.log(ul);
// const h1 = document.querySelector('h1');
// console.log(h1.textContent);
// const para = document.querySelector('.special2');
// console.log(para.textContent);
// const myPara = document.querySelector('.my-para'); // object
// console.log(myPara.innerHTML);
// // myPara.innerText = '<strong>Hello</strong> this has been modified';
// myPara.innerHTML =
// '<strong style="color: red">Hello</strong> this has been modified';
// myPara.innerHTML += '. <em>Extra information.</em>';
// const inputs = document.querySelectorAll('input');
// inputs[0].value = 'John';
// inputs[1].value = 'Doe';
const img = document.querySelector('img');
// img.src =
// 'file:///C:/Users/rahul.LAPTOP-IB8N85JR/Desktop/Training/Full_Stack_15/HTML-CSS/js/images/car.jpg';
// // console.log(img.src);
// // console.log(img.width);
// img.width = '300';
// const range = document.querySelector('input[type="range"]');
// // console.log(img.getAttribute('alt'));
// // console.log(range.getAttribute('max'));
// console.log(img.getAttribute('src'));
// console.log(img.src);
// console.log(img.getAttribute('width'));
// img.setAttribute('alt', 'Text added via JS');
// img.setAttribute('width', '50%');
// const btn = document.querySelector('button');
// btn.setAttribute('type', 'button');
// btn.setAttribute('style', 'border: 2px solid red');
// const multiply2 = (x = 1, y = 1) => {
// return x * y;
// };
// multiply(10);
// function addAll2(...nums) { // rest args
// console.log(nums)
// let total = 0
// nums.forEach(num => (total += num))
// return total
// }
// const fullName = (user) => {
// return `${user.firstName} ${user.lastName}`
// }
// fullName({firstName: 'John', lastName: 'Doe'})
// const fullName = ({ firstName, lastName }) => {
// return `${firstName} ${lastName}`
// }
// const movieReviews = [4.5, 5.0, 3.2, 2.1, 4.7, 3.8, 3.1, 3.9, 4.4];
// const highest = Math.max(...movieReviews);
// const lowest = Math.min(...movieReviews);
// let total = 0;
// movieReviews.forEach((rating) => (total += rating));
// const average = total / movieReviews.length;
// const info1 = { highest: highest, lowest: lowest, average: average };
// console.log(info1);
// function multiply(x, y) {
// return x * y
// }
// const math = {
// multiply: function (x, y) {
// return x * y
// }
// }
// const math2 = {
// multiply(x, y) {
// return x * y
// }
// }
// function greet() {
// console.log('Hello World!');
// console.log(this);
// }
// greet();
// const window = {
// greet() {
// console.log('Hello World!');
// console.log(this);
// }
// }
// greet()
// window.greet()
const user = {
firstName: 'John',
lastName: 'Doe',
role: 'admin',
fullName() {
console.log(`${this.firstName}
${this.lastName}
is an ${this.role}`);
},
};
// const firstLi = document.querySelector('li');
// const ul = document.querySelector('ul');
// // console.log(firstLi.parentElement.parentElement);
// const allLis = ul.children;
// const form = document.querySelector('form');
// // console.log(ul.children);
// // for (let li of allLis) {
// // console.log(li.innerText);
// // }
// // console.log(form.children[0].innerHTML);
// // console.log(form.nextElementSibling);
// console.log(form.previousElementSibling);
// const lis = document.querySelectorAll('li');
// for (li of lis) {
// // console.log(li.innerText)
// // li.innerText = 'Programmatically CHANGED!'
// li.innerHTML = 'Programmatically <b>CHANGED!</b>';
// }
// const heading = document.querySelector('h1');
// // console.log(heading.style);
// heading.style.color = 'red';
// heading.style.textDecoration = 'underline';
// heading.style.fontSize = '50px';
// const lis = document.querySelectorAll('li');
// const colors = ['red', 'yellow', 'green', 'orange', 'teal'];
// for (li of lis) {
// li.style.color = colors[Math.floor(Math.random() * colors.length)];
// li.style.fontSize = '20';
// li.style.fontWeight = 'bold';
// li.style.backgroundColor = colors[Math.floor(Math.random() * colors.length)];
// li.style.fontFamily = 'Helvetica, sans-serif';
// }
// const para = document.querySelector('.styled-el');
// // console.log(para.style);
// const paraStyles = getComputedStyle(para);
// // console.log(paraStyles);
// console.log(paraStyles.textDecoration);
// console.log(paraStyles.color);
// console.log(paraStyles.fontSize);
// para.style.color = 'green';
// console.log(paraStyles.color);
// const todo = document.querySelector('.todo');
// console.log(todo);
// todo.style.textDecoration = 'line-through';
// todo.style.opacity = 0.5;
// todo.style.color = 'red';
// todo.setAttribute('class', 'done');
// console.log(todo.classList);
// todo.classList.add('done');
// todo.classList.remove('done');
// todo.classList.toggle('done');
// const subtitle = document.createElement('h2');
// subtitle.innerText = 'This is a subtitle';
// subtitle.style.fontSize = '35px';
// const section = document.querySelector('section');
// // section.appendChild(subtitle);
// const photo = document.createElement('img');
// photo.setAttribute(
// 'src',
// 'https://images.unsplash.com/photo-1619448532901-bdfa33279554?ixid=MnwxMjA3fDB8MHxlZGl0b3JpYWwtZmVlZHwxfHx8ZW58MHx8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=600&q=60'
// );
// photo.style.width = '400px';
// const photoLink = document.createElement('a');
// photoLink.setAttribute(
// 'href',
// 'https://images.unsplash.com/photo-1619448532901-bdfa33279554?ixid=MnwxMjA3fDB8MHxlZGl0b3JpYWwtZmVlZHwxfHx8ZW58MHx8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=600&q=60'
// );
// photoLink.setAttribute('target', '_blank');
// photoLink.appendChild(photo);
// section.appendChild(photoLink);
// const todos = document.querySelector('#todos');
// const newTask = document.createElement('li');
// newTask.innerText = 'Brand new task to complete';
// // newTask.innerHTML = 'Brand new task to complete <button>X</button>'
// newTask.classList.add('todo');
// newTask.style.color = 'purple';
// newTask.style.fontWeight = 'bold';
// // todos.appendChild(newTask); // append to the end
// const firstTask = todos.querySelector('li');
// // console.log(firstTask);
// todos.insertBefore(newTask, firstTask);
// const b = document.createElement('b');
// b.innerText = 'HELLO WORLD';
// const p = document.querySelector('p');
// // p.insertAdjacentElement('beforebegin', b);
// // p.insertAdjacentElement('afterbegin', b);
// // p.insertAdjacentElement('beforeend', b);
// p.insertAdjacentElement('afterend', b);
// const b = document.createElement('b');
// b.innerText = 'HELLO WORLD';
// const i = document.createElement('i');
// i.innerText = 'GOODBYE GALAXY';
// const p = document.querySelector('p');
// // p.append(b, i); // append both b and i to the end of p
// // p.append(b); // just append b to the end of p
// p.prepend(i); // prepend i to the start of p
// const todos = document.querySelector('#todos');
// const firstTask = todos.querySelector('li');
// console.log(firstTask);
// const secondTask = firstTask.nextElementSibling;
// console.log(secondTask);
// // todos.removeChild(firstTask);
// // todos.removeChild(secondTask);
// // firstTask.remove();
// // secondTask.remove();
// const btn = document.querySelector('#btn1');
// btn.onclick = () => console.log('I GOT CLICKED');
// btn.onclick = () => console.log('Click second event');
// btn.addEventListener('click', () => {
// alert('ALERT MESSAGE FROM CLICK EVENT');
// });
// btn.addEventListener('click', () => {
// console.log('CONSOLE MESSAGE FROM CLICK EVENT');
// });
// btn.addEventListener('mouseover', () => {
// console.log('I have been hovered upon');
// });
// btn.addEventListener('mouseover', function () {
// btn.innerText = 'Button Hovered!';
// });
// btn.addEventListener('mouseout', function () {
// btn.innerText = 'Button 1';
// });
// // Attach a scroll event on the window itself
// window.addEventListener('scroll', function () {
// console.log('Stop Scrolling!');
// });
// const btn = document.querySelector('button');
// btn.addEventListener('mouseover', function () {
// // console.log('Mouse over button')
// // To get the current height and width of your browser screen
// const height = Math.floor(Math.random() * window.innerHeight);
// const width = Math.floor(Math.random() * window.innerWidth);
// btn.style.left = `${width}px`;
// btn.style.top = `${height}px`;
// });
// btn.addEventListener('click', function () {
// btn.innerText = 'You Won!';
// document.body.style.backgroundColor = 'green';
// });
const colors = [
'red',
'orange',
'yellow',
'green',
'blue',
'purple',
'indigo',
'violet',
];
// const printColor = function (box) {
// console.log(box.style.backgroundColor);
// };
// We can make use of `this`
const printColor = function () {
console.log(this.style.backgroundColor);
};
const changeColor = function () {
const h1 = document.querySelector('h1');
h1.style.color = this.style.backgroundColor;
h1.innerText = this.style.backgroundColor + ' selected';
};
const container = document.querySelector('#boxes'); // Select the container
// Loop to add each color as a background color (create as many boxes as length of colors)
for (let color of colors) {
const box = document.createElement('div'); // Create a square box
box.style.backgroundColor = color; // Style the box
box.classList.add('box'); // Add a class
container.append(box); // Append box to container
// // Add event listener to the box
// box.addEventListener('click', function () {
// // console.log('Box clicked!')
// // console.log(box.style.backgroundColor);
// printColor(box);
// });
box.addEventListener('click', printColor);
box.addEventListener('click', changeColor);
}
// const colors = [
// 'red',
// 'orange',
// 'yellow',
// 'green',
// 'blue',
// 'purple',
// 'indigo',
// 'violet',
// ];
// const printColor = function (event) {
// console.log(this.style.backgroundColor);
// };
// const changeColor = function (event) {
// console.log(event);
// const h1 = document.querySelector('h1');
// h1.style.color = this.style.backgroundColor;
// h1.innerText = this.style.backgroundColor + ' selected';
// };
// const container = document.querySelector('#boxes'); // Select the container
// // Loop to add each color as a background color (create as many boxes as length of colors)
// for (let color of colors) {
// const box = document.createElement('div'); // Create a square box
// box.style.backgroundColor = color; // Style the box
// box.classList.add('box'); // Add a class
// container.append(box); // Append box to container
// box.addEventListener('click', printColor);
// box.addEventListener('click', changeColor);
// }
// const input = document.querySelector('#username');
// // input.addEventListener('keydown', function (e) {
// // console.log('KEY DOWN', e);
// // });
// // input.addEventListener('keyup', function (e) {
// // console.log('KEY UP', e);
// // });
// input.addEventListener('keypress', function (e) {
// console.log('KEY PRESS', e);
// });
// const taskAdd = document.querySelector('#addtask');
// const todos = document.querySelector('#todos');
// const output = document.querySelector('#output');
// // let val = '';
// taskAdd.addEventListener('keypress', function (e) {
// // console.log(e.key);
// // console.dir(this);
// // val = e.target.value;
// // this.value = val;
// output.innerText = e.target.value;
// if (e.key === 'Enter') {
// if (!this.value) {
// return;
// }
// const newTask = document.createElement('li');
// newTask.innerText = this.value;
// newTask.style.cursor = 'pointer';
// todos.append(newTask);
// this.value = '';
// newTask.addEventListener('click', function () {
// newTask.remove();
// });
// }
// });
// const form = document.querySelector('#payment-form');
// const creditCard = document.querySelector('#cc');
// const terms = document.querySelector('#terms');
// const brand = document.querySelector('#brand');
// form.addEventListener('submit', function (e) {
// // alert('FORM SUBMITTED');
// e.preventDefault(); // prevent the default form behavior
// console.log('cc - ', creditCard.value);
// console.log('terms - ', terms.checked);
// console.log('brand - ', brand.value);
// });
// const formData = {};
// creditCard.addEventListener('input', function (e) {
// // console.log('CC changed', e);
// formData['cc'] = e.target.value;
// console.log(e.target.value);
// });
// brand.addEventListener('input', function (e) {
// // console.log('brand changed', e);
// formData['brand'] = e.target.value;
// console.log(e.target.value);
// });
// terms.addEventListener('input', function (e) {
// // console.log('terms changed', e);
// formData['terms'] = e.target.checked;
// console.log(e.target.checked);
// });
// const form = document.querySelector('#payment-form');
// const creditCard = document.querySelector('#cc');
// const terms = document.querySelector('#terms');
// const brand = document.querySelector('#brand');
// const formData = {};
// for (let input of [creditCard, terms, brand]) {
// input.addEventListener('input', (e) => {
// formData[e.target.name] =
// e.target.type === 'checkbox' ? e.target.checked : e.target.value;
// });
// }
// form.addEventListener('submit', function (e) {
// // alert('FORM SUBMITTED');
// e.preventDefault(); // prevent the default form behavior
// console.log(formData);
// });
// const multiply = (x, y) => x * y;
// const square = (x) => multiply(x, x);
// const rightTriangle = (a, b, c) => {
// return square(a) + square(b) === square(c);
// };
// rightTriangle(3, 4, 5);
// console.log('The first log');
// alert('An interruption in between');
// console.log('The last log');
// console.log('The first log');
// setTimeout(() => {
// console.log('The line that takes time to complete');
// }, 3000);
// console.log('The last log');
// const btn = document.querySelector('button');
// const moveX = (element, amount, delay, callback) => {
// setTimeout(() => {
// element.style.transform = `translateX(${amount}px)`;
// if (callback) {
// callback();
// }
// }, delay);
// };
// moveX(btn, 100, 1000, () => {
// moveX(btn, 200, 1000, () => {
// moveX(btn, 300, 1000, () => {
// moveX(btn, 400, 1000, () => {
// moveX(btn, 500, 1000, () => {
// moveX(btn, 500, 1000, () => {
// moveX(btn, 500, 1000);
// });
// });
// });
// });
// });
// });
// setTimeout(() => {
// btn.style.transform = `translateX(100px)`;
// setTimeout(() => {
// btn.style.transform = `translateX(200px)`;
// setTimeout(() => {
// btn.style.transform = `translateX(300px)`;
// setTimeout(() => {
// btn.style.transform = `translateX(400px)`;
// setTimeout(() => {
// btn.style.transform = `translateX(500px)`;
// }, 1000);
// }, 1000);
// }, 1000);
// }, 1000);
// }, 1000);
// const subtitle = document.createElement('h2');
// subtitle.innerText = 'This is a subtitle';
// subtitle.style.fontSize = '35px';
// const section = document.querySelector('section');
// section.appendChild(subtitle);
// const photo = document.createElement('img');
// photo.setAttribute(
// 'src',
// 'https://images.unsplash.com/photo-1619448532901-bdfa33279554?ixid=MnwxMjA3fDB8MHxlZGl0b3JpYWwtZmVlZHwxfHx8ZW58MHx8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=600&q=60'
// );
// photo.style.width = '400px';
// const photoLink = document.createElement('a');
// photoLink.setAttribute(
// 'href',
// 'https://images.unsplash.com/photo-1619448532901-bdfa33279554?ixid=MnwxMjA3fDB8MHxlZGl0b3JpYWwtZmVlZHwxfHx8ZW58MHx8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=600&q=60'
// );
// photoLink.setAttribute('target', '_blank');
// photoLink.appendChild(photo);
// section.appendChild(photoLink);
// const todos = document.querySelector('#todos');
// const newTask = document.createElement('li');
// newTask.innerText = 'Brand new task to complete';
// // newTask.innerHTML = 'Brand new task to complete <button>X</button>'
// newTask.classList.add('todo');
// newTask.style.color = 'purple';
// newTask.style.fontWeight = 'bold';
// // todos.appendChild(newTask); // append to the end
// const firstTask = todos.querySelector('li');
// todos.insertBefore(newTask, firstTask); // insert before a certain element
// const b = document.createElement('b');
// b.innerText = 'HELLO WORLD';
// const p = document.querySelector('p');
// p.insertAdjacentElement('beforebegin', b);
// p.insertAdjacentElement('afterbegin', b);
// p.insertAdjacentElement('beforeend', b);
// p.insertAdjacentElement('afterend', b);
// const b = document.createElement('b');
// b.innerText = 'HELLO WORLD';
// const i = document.createElement('i');
// i.innerText = 'GOODBYE GALAXY';
// const p = document.querySelector('p');
// // // p.append(b, i); // append both b and i to the end of p
// // // p.append(b); // just append b to the end of p
// // p.prepend(i); // prepend i to the start of p
// const todos = document.querySelector('#todos');
// const firstTask = todos.querySelector('li');
// // console.log(firstTask);
// const secondTask = firstTask.nextElementSibling;
// // console.log(secondTask);
// todos.removeChild(firstTask);
// todos.removeChild(secondTask);
// firstTask.remove();
// secondTask.remove();
// const btn = document.querySelector('button');
// // btn.onclick = console.log('Incorrect EVENT');
// btn.onclick = function () {
// console.log('Click first event');
// return 'hello';
// };
// btn.onclick = function () {
// console.log('Click second event');
// };
// const btn = {
// hello: 'hello',
// onclick: function () {
// console.log('Click second event');
// },
// };
// const btn = document.querySelector('button');
// // it takes a callback
// btn.addEventListener('click', () => {
// // alert('ALERT MESSAGE FROM CLICK EVENT');
// console.log('CONSOLE MESSAGE FROM');
// });
// // can add as many events as you want
// btn.addEventListener('click', () => {
// console.log('CONSOLE MESSAGE FROM CLICK EVENT');
// });
// // can add as many events as you want
// btn.addEventListener('mouseover', () => {
// console.log('CONSOLE MESSAGE FROM CLICK EVENT');
// });
// btn.addEventListener('mouseover', function () {
// btn.innerText = 'Button Hovered!';
// });
// btn.addEventListener('mouseout', function () {
// btn.innerText = 'Button 1';
// });
// window.addEventListener('scroll', function () {
// console.log('Stop Scrolling!');
// });
// const btn = document.querySelector('button');
// btn.addEventListener('mouseover', function () {
// const height = Math.floor(Math.random() * window.innerHeight);
// const width = Math.floor(Math.random() * window.innerWidth);
// btn.style.left = `${width}px`;
// btn.style.top = `${height}px`;
// });
// btn.addEventListener('click', function () {
// btn.innerText = 'You Won!';
// document.body.style.backgroundColor = 'green';
// });
const colors = [
'red',
'orange',
'yellow',
'green',
'blue',
'purple',
'indigo',
'violet',
];
const container = document.querySelector('#boxes'); // Select the container
// // Loop to add each color as a background color (create as many boxes as length of colors)
// for (let color of colors) {
// const box = document.createElement('div'); // Create a square box
// box.style.backgroundColor = color; // Style the box
// box.classList.add('box'); // Add a class
// container.append(box); // Append box to container
// // Add event listener to the box
// box.addEventListener('click', function () {
// // console.log('Box clicked!')
// console.log(box.style.backgroundColor);
// });
// }
const printColor = function () {
console.log(this.style.backgroundColor);
};
const changeColor = function () {
const h1 = document.querySelector('h1');
h1.style.color = this.style.backgroundColor;
h1.innerText = this.style.backgroundColor + ' selected';
};
for (let color of colors) {
const box = document.createElement('div'); // Create a square box
box.style.backgroundColor = color; // Style the box
box.classList.add('box'); // Add a class
container.append(box); // Append box to container
// Add event listener to the box
box.addEventListener('click', printColor);
box.addEventListener('click', changeColor);
}
// moveX(btn, 100, 1000, () => {
// moveX(btn, 200, 1000, () => {
// moveX(btn, 300, 1000, () => {
// moveX(btn, 400, 1000, () => {
// moveX(btn, 500, 1000, () => {
// moveX(btn, 500, 1000, () => {
// moveX(btn, 500, 1000);
// });
// });
// });
// });
// });
// });
// const willGetAPlayStation = new Promise((resolve, reject) => {
// const rand = Math.random();
// if (rand < 0.5) {
// resolve();
// } else {
// reject();
// }
// });
// // console.log(willGetAPlayStation);
// willGetAPlayStation.then(() => console.log('I got a playstation. Thank you.'));
// willGetAPlayStation.catch(() => console.log('Mai ghar chod dunga'));
// const fakeRequest = (url) => {
// return new Promise((resolve, reject) => {
// setTimeout(() => {
// const pages = {
// '/users': [
// { id: 1, username: 'john' },
// { id: 2, username: 'jane' },
// ],
// '/about': 'This is the about page',
// };
// const data = pages[url];
// if (data) {
// resolve({ status: 200, data });
// } else {
// reject({ status: 404 });
// }
// }, 2000);
// });
// };
// // const result = fakeRequest('/users');
// // result
// // .then((response) => console.log(response))
// // .catch((response) => console.log(response));
// fakeRequest('/users')
// .then((res) => console.log(res.status, res.data))
// .catch((res) => console.log(res.status));
const fakeRequest = (url) => {
return new Promise((resolve, reject) => {
setTimeout(() => {
const pages = {
'/users': [
{ id: 1, username: 'john' },
{ id: 2, username: 'jane' },
],
'/users/1': {
id: 1,
username: 'johndoe',
topPostId: 53231,
city: 'mumbai',
},
'/users/4': {
id: 1,
username: 'janedoe',
topPostId: 32443,
city: 'pune',
},
'/posts/53231': {
id: 1,
title: 'Really amazing post',
slug: 'really-amazing-post',
},
};
const data = pages[url];
if (data) {
resolve({ status: 200, data });
} else {
reject({ status: 404 });
}
}, 1000);
});
};
// fakeRequest('/users')
// .then((res) => {
// console.log(res);
// const id = res.data[0].id;
// fakeRequest(`/users/${id}`).then((res) => {
// console.log(res);
// const postId = res.data.topPostId;
// fakeRequest(`/posts/${postId}`).then((res) => {
// console.log(res);
// });
// });
// })
// .catch((err) => console.log(err));
fakeRequest('/users')
.then((res) => {
const id = res.data[0].id;
return fakeRequest(`/users/${id}`);
})
.then((res) => {
const postId = res.data.topPostId;
return fakeRequest(`/posts/${postId}`);
})
.then((res) => {
console.log(res);
})
.catch((err) => console.log(err));
// const req = new XMLHttpRequest(); // make new object
// // // provide 2 callbacks
// req.onload = function () {
// // if successful
// console.log('SUCCESS!');
// const data = JSON.parse(this.responseText);
// console.log(data);
// };
// req.onerror = function (err) {
// // if failure
// console.log('ERROR', err);
// };
// req.open('get', 'https://swapi.dev/api/people/1', true); // request type and url
// req.setRequestHeader('Accept', 'application/json'); // send headers
// req.send(); // send request
// // Event listeners
// const req = new XMLHttpRequest();
// // Adding event listeners instead of attributes
// req.addEventListener('load', function () {
// const data = JSON.parse(this.responseText);
// // console.log('It worked!', data);
// for (let planet of data.results) {
// console.log(planet.name);
// }
// });
// req.addEventListener('error', function (err) {
// console.log('Error', err);
// });
// req.open('get', 'https://swapi.dev/api/planets', true);
// req.send();
// console.log(req); // req object has the responseText field
// const req = new XMLHttpRequest();
// req.addEventListener('load', function () {
// console.log('First Request');
// const data = JSON.parse(this.responseText);
// const filmUrl = data.results[0].films[0];
// ///////////////////////// SECOND REQUEST
// // Second Request (nested)
// const filmReq = new XMLHttpRequest();
// filmReq.addEventListener('load', function () {
// console.log('Second Request');
// const filmData = JSON.parse(this.responseText);
// console.log(filmData.title);
// /////////////////// THIRD REQUEST
// });
// filmReq.addEventListener('error', function (err) {
// console.log(err);
// });
// filmReq.open('GET', filmUrl, true);
// filmReq.send();
// //////////////////////// END SECOND REQUEST
// });
// req.addEventListener('error', function (err) {
// console.log('Error', err);
// });
// req.open('get', 'https://swapi.dev/api/planets', true);
// req.send();
// fetch('https://swapi.dev/api/planets', {
// headers: { Accept: 'application/json' },
// })
// .then((response) => {
// // console.log(response);
// if (response.status !== 200) {
// console.log('Problem', response.status);
// return;
// }
// // // Have to use response.json as we get back a stream
// // // and not the json directly.
// response.json().then((data) => {
// // itself is a promise
// console.log(data);
// });
// })
// .catch(function (err) {
// console.log('Fetch err', err);
// });
// fetch('https://swapi.dev/api/plannets')
// .then((response) => {
// if (!response.ok) {
// // console.log('Something went wrong!', response.status);
// throw new Error(`Status code error: ${response.status}`);
// } else {
// response.json().then((data) => {
// for (let planet of data.results) {
// console.log(planet.name);
// }
// });
// }
// })
// .catch((err) => {
// console.log('ERROR!', err);
// });
// fetch('https://swapi.dev/api/plannnnnnnets')
// .then((response) => {
// console.log(response);
// if (!response.ok) {
// throw new Error(`Status code error: ${response.status}`);
// }
// return response.json();
// })
// .then((data) => {
// console.log('Fetched all planets');
// const filmUrl = data.results[0].films[0];
// return fetch(filmUrl);
// })
// .then((response) => {
// if (!response.ok) {
// throw new Error(`Status code error: ${response.status}`);
// }
// return response.json();
// })
// .then((data) => {
// console.log('Fetched first film');
// console.log(data.title);
// })
// .catch((err) => {
// console.log('ERROR!', err);
// });
// // Custom function to extract checking and parsing logic
// const checkStatusAndParse = (res) => {
// if (!res.ok) {
// throw new Error(`Status code error: ${res.status}`);
// }
// return res.json();
// };
// fetch('https://swapi.dev/api/planets')
// .then((response) => {
// return checkStatusAndParse(response);
// })
// .then((data) => {
// console.log('Fetched all planets');
// const filmUrl = data.results[0].films[0];
// return fetch(filmUrl);
// })
// .then((response) => {
// return checkStatusAndParse(response);
// })
// .then((data) => {
// console.log('Fetched first film');
// console.log(data.title);
// })
// .catch((err) => {
// console.log('ERROR!', err);
// });
// // Custom function to extract checking and parsing logic
// const checkStatusAndParse = (res) => {
// if (!res.ok) {
// throw new Error(`Status code error: ${res.status}`);
// }
// return res.json();
// };
// fetch('https://swapi.dev/api/planets')
// .then(checkStatusAndParse)
// .then((data) => {
// console.log('Fetched all planets');
// const filmUrl = data.results[0].films[0];
// return fetch(filmUrl);
// })
// .then(checkStatusAndParse)
// .then((data) => {
// console.log('Fetched first film');
// console.log(data.title);
// })
// .catch((err) => {
// console.log('ERROR!', err);
// });
// axios
// .get('https://swapi.dev/api/planets')
// .then(({ data }) =>
// data.results.forEach((planet) => console.log(planet.name))
// )
// .catch((err) => console.log('In Catch Block: \n\n', err));
axios
.get('https://swapi.dev/api/planets')
.then(({ data }) => {
data.results.forEach((planet) => console.log(planet.name));
return axios.get(data.next);
})
.then(({ data }) =>
data.results.forEach((planet) => console.log(planet.name))
)
.catch((err) => console.log('ERROR OCCURRED', err));
// function getData() {
// const data = axios.get('https://swapi.dev/api/planets');
// console.log(data); // Promise {<pending>}
// }
// getData();
// function getData() {
// axios.get('https://swapi.dev/api/planets').then((res) => {
// console.log(res); // {data: {…}, status: 200, …}
// });
// }
// getData();
// async function greet() {
// return 'Hello!';
// }
// console.log(greet());
// async function problem() {
// throw new Error('Problem!');
// }
// // console.log(problem());
// // greet().then((res) => {
// // console.log(res);
// // });
// problem().catch((res) => {
// console.log(res);
// });
// async function add(x, y) {
// if (typeof x !== 'number' || typeof y !== 'number') {
// throw new Error('X and Y must be numbers');
// }
// return x + y;
// }
// // console.log(add(10, 10));
// add('hello', 10)
// .then((res) => {
// console.log(res);
// })
// .catch((res) => {
// console.log(res);
// });
// function getPlanets() {
// return axios.get('https://swapi.dev/api/planets');
// }
// getPlanets().then((res) => {
// console.log(res.data);
// });
// async function getPlanets() {
// try {
// const res = await axios.get('https://swapi.dev/api/planets');
// console.log(res.data);
// } catch (err) {
// console.log(err);
// } finally {
// console.log('Hello world');
// }
// }
// getPlanets().catch((err) => {
// console.log('In catch block:', err);
// });
// getPlanets();
// console.log('Hello World!');
// async function getPokemon() {
// const pokemon1 = await axios.get('https://pokeapi.co/api/v2/pokemon/1');
// const pokemon2 = await axios.get('https://pokeapi.co/api/v2/pokemon/2');
// const pokemon3 = await axios.get('https://pokeapi.co/api/v2/pokemon/3');
// console.log(pokemon1.data);
// console.log(pokemon2.data);
// console.log(pokemon3.data);
// }
// getPokemon();
// async function getPokemon() {
// const pokemon1 = axios.get('https://pokeapi.co/api/v2/pokemon/1');
// const pokemon2 = axios.get('https://pokeapi.co/api/v2/pokemon/2');
// const pokemon3 = axios.get('https://pokeapi.co/api/v2/pokemon/3');
// await pokemon1;
// await pokemon2;
// await pokemon3;
// console.log(pokemon1); // undefined
// console.log(pokemon2); // undefined
// console.log(pokemon3); // undefined
// }
// getPokemon();
// async function getPokemon() {
// // 15
// const promise1 = axios.get('https://pokeapi.co/api/v2/pokemon/1');
// const promise2 = axios.get('https://pokeapi.co/api/v2/pokemon/2');
// const promise3 = axios.get('https://pokeapi.co/api/v2/pokemon/3');
// // 5
// const pokemon1 = await promise1;
// const pokemon2 = await promise2;
// const pokemon3 = await promise3;
// console.log('Pokemon 1', pokemon1.data);
// console.log('Pokemon 2', pokemon2.data);
// console.log('Pokemon 3', pokemon3.data);
// }
// getPokemon();
// console.log('Pokemon 1', await promise1);
// console.log('Pokemon 2', await promise2);
// console.log('Pokemon 3', await promise3);
// async function getPokemon() {
// const promise1 = axios.get('https://pokeapi.co/api/v2/pokemon/1');
// const promise2 = axios.get('https://pokeapi.co/api/v2/pokemon/2');
// const promise3 = axios.get('https://pokeapi.co/api/v2/pokemon/3');
// const results = await Promise.all([promise1, promise2, promise3]);
// console.log(results); // array
// }
// getPokemon();
// async function getPokemon() {
// const promise1 = axios.get('https://pokeapi.co/api/v2/pokemon/1');
// const promise2 = axios.get('https://pokeapi.co/api/v2/pokemon/2');
// const promise3 = axios.get('https://pokeapi.co/api/v2/pokemon/3');
// const results = await Promise.all([promise1, promise2, promise3]);
// // console.log(results) // array
// logPokemonToConsole(results);
// }
// function logPokemonToConsole(results) {
// for (let pokemon of results) {
// console.log(pokemon.data.name);
// }
// }
// getPokemon();
// function initializeDeck() {
// const deck = [];
// const suits = ['hearts', 'diamonds', 'spades', 'clubs'];
// const values = '2,3,4,5,6,7,8,9,10,J,Q,K,A';
// for (let value of values.split(',')) {
// for (let suit of suits) {
// deck.push({ value, suit });
// }
// }
// return deck;
// }
// function drawCard(deck, drawnCards) {
// const card = deck.pop();
// drawnCards.push(card);
// return card;
// }
// function drawMultiple(numCards, deck, drawnCards) {
// const cards = [];
// for (let i = 0; i < numCards; i++) {
// cards.push(drawCard(deck, drawnCards));
// }
// return cards;
// }
// function shuffle(deck) {
// // loop over array backwards
// for (let i = deck.length - 1; i > 0; i--) {
// // pick random index before current element
// let j = Math.floor(Math.random() * (i + 1));
// [deck[i], deck[j]] = [deck[j], deck[i]];
// }
// return deck;
// }
// const myDeck = initializeDeck();
// const cardsInHand = [];
// console.log(myDeck.length);
// drawCard(myDeck, cardsInHand);
// drawCard(myDeck, cardsInHand);
// drawCard(myDeck, cardsInHand);
// console.log(myDeck.length);
// drawMultiple(5, myDeck, cardsInHand);
// console.log(cardsInHand);
// const myDeck = initializeDeck();
// shuffle(myDeck);
// console.log(myDeck);
// const makeDeck = () => {
// return {
// deck: [],
// drawnCards: [],
// suits: ['hearts', 'diamonds', 'spades', 'clubs'],
// values: '2,3,4,5,6,7,8,9,10,J,Q,K,A',
// initializeDeck() {
// const { suits, values, deck } = this;
// for (let value of values.split(',')) {
// for (let suit of suits) {
// deck.push({ value, suit });
// }
// }
// return deck;
// },
// drawCard() {
// const card = this.deck.pop();
// this.drawnCards.push(card);
// return card;
// },
// drawMultiple(numCards) {
// const cards = [];
// for (let i = 0; i < numCards; i++) {
// cards.push(this.drawCard);
// }
// return cards;
// },
// shuffle() {
// const { deck } = this;
// for (let i = deck.length - 1; i > 0; i--) {
// console.log(deck);
// let j = Math.floor(Math.random() * (i + 1));
// [deck[i], deck[j]] = [deck[j], deck[i]];
// }
// },
// };
// };
// const myDeck = makeDeck();
// myDeck.initializeDeck();
// myDeck.drawCard();
// myDeck.drawCard();
// myDeck.drawCard();
// myDeck.drawCard();
// console.log(myDeck.drawnCards);
// function makePerson(fname, lname, age) {
// return {
// firstName: fname,
// lastName: lname,
// age: age,
// sayName() {
// console.log(this.firstName, this.lastName);
// },
// };
// }
// const john = makePerson('John', 'Doe', 25);
// const jane = makePerson('Jane', 'Doe', 25);
// // john.sayName();
// // jane.sayName();
// console.log(typeof john);
// ------------------
// function Person(firstName, lastName, age) {
// this.firstName = firstName;
// this.lastName = lastName;
// this.age = age;
// }
// Person.prototype.sayName = function () {
// console.log(`My name is ${this.firstName} ${this.lastName}`);
// };
// const jim = new Person('Jim', 'Doe', 25);
// const jack = new Person('Jack', 'Doe', 25);
// // jim.sayName();
// // jack.sayName();
// console.log(typeof jim);
// class Person {
// constructor(firstName, lastName, age) {
// console.log('INSIDE CONSTRUCTOR');
// console.log(firstName, lastName, age);
// this.firstName = firstName;
// this.lastName = lastName;
// this.age = age;
// }
// greet() {
// console.log(`Hello friend, from ${this.firstName}`);
// }
// }
// const person1 = new Person('John', 'Doe', 25);
// const person2 = new Person('Jane', 'Doe', 25);
// console.log(person1);
// person1.greet();
class User {
constructor(username, password) {
this.username = username;
this.password = password;
}
login(pass) {
if (pass === this.password) {
console.log('Welcome back');
} else {
console.log('Incorrect password entered.');
}
}
}
class Subscriber extends User {
logout() {
console.log('You have successfully logged out, Subscriber');
}
}
class Creator extends User {
constructor(username, password, totalVideos = 0) {
super(username, password);
this.totalVideos = totalVideos;
}
uploadVideo(videoName) {
this.totalVideos++;
console.log(
`Thank you for uploading ${videoName}.\nChannel: ${this.totalVideos} video(s)`
);
}
logout() {
console.log('You have successfully logged out, Creator');
}
}
const john = new User('john', 'john@123');
const jane = new Subscriber('jane', 'jack@123');
const jack = new Creator('jack', 'jack@987', 100);
john.login('jane@123');
jane.login('jack@123');
// console.log(john);
// console.log(jane);
jack.login('jack@987');
jack.uploadVideo('tiktok video #555');
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>React</title>
</head>
<body>
<div id="root"></div>
<script src="https://unpkg.com/react@^16/umd/react.development.js"></script>
<script src="https://unpkg.com/react-dom@^16/umd/react-dom.development.js"></script>
<script src="https://unpkg.com/@babel/standalone/babel.min.js"></script>
<script type="text/babel">
// const rootElement = document.querySelector('#root');
// const heading = document.createElement('h1');
// heading.innerText = 'Hello World!';
// rootElement.append(heading);
// const element = React.createElement('h1', {
// className: 'title', // add a class to this element
// children: 'Hello Universe!', // the content of this h1 element
// });
// Nested
// const headingEl = React.createElement(
// 'h1',
// { className: 'myHeading' },
// 'Hello World!'
// );
// const heading = <h1 id="title">Hello World</h1>;
// const paraEl = React.createElement(
// 'p',
// {},
// 'I am rendered using React JS'
// );
// const element = React.createElement('div', {
// className: 'intro-div',
// children: [heading, paraEl], // children property can be an array
// });
// console.log(element);
// const children = 'Hello World. This is the page title';
// const className = 'title';
// const props = { children, className };
// // JSX tags can be self closing
// // Below we spread the props object in the JSX element
// const element = <h1 {...props} className="new" />;
const message = 'Hello World';
const myClassName = 'special';
// Interpolated myClassName and message
const element = <h1 className={myClassName}>{message.toUpperCase()}</h1>;
ReactDOM.render(element, document.querySelector('#root'));
</script>
</body>
</html>