https://github.com/dinanathsj29/javascript-exercise-beginners
Lets go-through, learn and understand different logical Javascript exercises and algorithms for beginners.
https://github.com/dinanathsj29/javascript-exercise-beginners
array-count-search-occurances array-filter-sort-map array-get-max-largest-number fizzbuzz-algorithms javascript-algorithms javascript-dom-object-array javascript-es5-es6-examples javascript-examples javascript-examples-beginners javascript-exercises javascript-logical-examples javascript-logical-loop-condition javascript-practical-examples javascript-practice-examples javascript-var-let-const-function number-loop object-create-factory-constructor object-equality random-bingo-card show-prime-numbers
Last synced: 5 months ago
JSON representation
Lets go-through, learn and understand different logical Javascript exercises and algorithms for beginners.
- Host: GitHub
- URL: https://github.com/dinanathsj29/javascript-exercise-beginners
- Owner: dinanathsj29
- Created: 2020-03-29T17:15:18.000Z (about 5 years ago)
- Default Branch: master
- Last Pushed: 2020-04-06T06:10:32.000Z (about 5 years ago)
- Last Synced: 2024-12-09T16:06:03.346Z (5 months ago)
- Topics: array-count-search-occurances, array-filter-sort-map, array-get-max-largest-number, fizzbuzz-algorithms, javascript-algorithms, javascript-dom-object-array, javascript-es5-es6-examples, javascript-examples, javascript-examples-beginners, javascript-exercises, javascript-logical-examples, javascript-logical-loop-condition, javascript-practical-examples, javascript-practice-examples, javascript-var-let-const-function, number-loop, object-create-factory-constructor, object-equality, random-bingo-card, show-prime-numbers
- Language: JavaScript
- Homepage:
- Size: 4.79 MB
- Stars: 168
- Watchers: 6
- Forks: 55
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
JavaScript Essential exercise for Beginners
=====================
JavaScript exercise/examples for Beginners
=====================
## 01. What is JavaScript?
- JavaScript is a programming language that adds interactivity to Web pages
- JavaScript is a scripting language
- A JavaScript script is a program that is included on an HTML page
- JavaScript scripts are text on Web pages that are interpreted and run by Web browsers
- JavaScript is initially named and developed as `LiveScript` at Netscape Navigator Corporation
- JavaScript is `not Java`
- Due to Java wave or Java popularity and buzz, `LiveScript` renamed to `JavaScript`
## 02. What can JavaScript do?
- Create an active User Interface
- Control the user experience based on Day, Date, Time and Browser, etc
- Validate user input on forms
- Create custom HTML pages on the fly/dynamically
- Control Web browsers interactivity and behaviors
## 03. What can't JavaScript do?
- JavaScript can't talk to a Database (Its possible with NodeJs)
- JavaScript can't write to files (Its possible with NodeJs)
- Keep track of state (except with cookies)
Topics include
=====================
1. [Example 1 - swapping variables](#example-1-swapping-variables)
2. [Example 2 - max number](#example-2-max-number)
3. [Example 3 - Landscape Portrait](#example-3-landscape-portrait)
4. [Example 4 - FizzBuzz Algorithms](#example-4-fizzbuzz-algorithms)
5. [Example 5 - Speed Limits](#example-5-speed-limits)
6. [Example 6 - Odd Even Number Loop](#example-6-odd-even-number-loop)
7. [Example 7 - Count Truthy Falsy Values](#example-7-count-truthy-falsy-values)
8. [Example 8 - Object String Properties Key](#example-8-object-string-properties-key)
9. [Example 9 - Sum of Multiples](#example-9-sum-of-multiples)
10. [Example 10 - Netsted Loop Star Pattern](#example-10-netsted-loop-star-pattern)
11. [Example 11 - Marks Average Grade](#example-11-marks-average-grade)
12. [Example 12 - Random Bingo Card](#example-12-random-bingo-card)
13. [Example 13 - Show Prime Numbers](#example-13-show-prime-numbers)
14. [Example 14 - Sum Of Arguments](#example-14-sum-of-arguments)
15. [Example 15 - Sum Of Arguments Array](#example-15-sum-of-arguments-array)
16. [Example 16 - Circle Area Object Read Only Property](#example-16-circle-area-object-read-only-property)
17. [Example 17 - Create Array From Argument Range](#example-17-create-array-from-argument-range)
18. [Example 18 - Array Includes Element Exists](#example-18-array-includes-element-exists)
19. [Example 19 - Array Excludes Value To New Array](#example-19-array-excludes-value-to-new-array)
20. [Example 20 - Array Count Search Occurances](#example-20-array-count-search-occurances)
21. [Example 21 - Array Get Max Largest Number](#example-21-array-get-max-largest-number)
22. [Example 22 - Array Filter Sort Map](#example-22-array-filter-sort-map)
23. [Example 23 - Object Create Students and Address Object](#example-23-object-create-students-and-address-object)
24. [Example 24 - Object Create Object Factory Constructor Function](#example-24-object-create-object-factory-constructor-function)
25. [Example 25 - Object Equality](#example-25-object-equality)
Example 1 swapping variables
=====================
Image 1 - Swapping Variables
> **Syntax & Example**: `1-swapping-variables.html`
```html
swapping-variables
1-swapping-variables!
Swap the values of variable
```
> **Syntax & Example**: `script.js`
```js
console.log('1-swapping-variables');
let value1 = 'one';
let value2 = 'two';
// original values
console.log('original', value1);
console.log('original', value2);
// swapping values
let value3 = value1;
value1 = value2;
value2 = value3;
console.log('swap', value1);
console.log('swap', value2);
```
> **Syntax & Example**: global `style.css`
```css
body{
font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
}
h1, th{
font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
}
table{
/* border: 2px solid #696969;
border-collapse: collapse; */
font-size: 18px;
}
th{
width: 20%;
}
th, td{
padding: 10px;
border: 2px solid #696969;
text-align: center;
}
#freeSquare{
background-color: coral;
}
```
Example 2 max number
=====================
Image 2 - Max Number
> **Syntax & Example**: `2-max-number.html`
```html
max-number
2-max-number!
Write a function which returns the maximum of two number
```
> **Syntax & Example**: `script.js`
```js
console.log('2-max-number');
function findMaxNumber(num1, num2){
// 1. long syntax
/* if(num1 > num2){
return num1
} else {
return num2
} */
// 2. short syntax
/* if(num1 > num2) return num1;
else return num2; */
// 3. ternary short syntax
return (num1 > num2) ? num1 : num2;
}
let checkMax1 = findMaxNumber(10, 5);
console.log('Max Number:',checkMax1);
let checkMax2 = findMaxNumber(10, 15);
console.log('Max Number:',checkMax2);
let checkMax3 = findMaxNumber(100, 100);
console.log('Max Number:',checkMax3);
```
Example 3 Landscape Portrait
=====================
Image 3 - Landscape Portrait
> **Syntax & Example**: `3-landscape-portrait.html`
```html
landscape-portrait
3-landscape-portrait!
Write a function which checks given width and height, returns true (landscape) if width is greater than height and vice versa
```
> **Syntax & Example**: `script.js`
```js
console.log('3-landscape-portrait');
function isLandscape(width, height){
// 3. ternary short syntax
return (width > height);
}
let checkWidthHeight1 = isLandscape(800, 600);
console.log('Landscape:',checkWidthHeight1);
let checkWidthHeight2 = isLandscape(600, 800);
console.log('Landscape:',checkWidthHeight2);
let checkWidthHeight3 = isLandscape(1024, 768);
console.log('Landscape:',checkWidthHeight3);
```
Example 4 FizzBuzz Algorithms
=====================
Image 4 - Ffizzbuz Algorithms
> **Syntax & Example**: `4-fizzbuzz-algorithms.html`
```html
fizzbuzz-algorithms
4-fizzbuzz-algorithms!
Write a function which checks given input/parameter:
- If input/parameter is divisible by 3 print => Fizz
- If input/parameter is divisible by 5 print => Buzz
- If input/parameter is divisible by 3 or 5 print => FizzBuzz
- If input/parameter is NOT divisible by 3 or 5 print => given Input Number/Value
- If input/parameter is other than Number/Value print => 'Nan - Not a Number! Please Input Number'
```
> **Syntax & Example**: `script.js`
```js
console.log('4-fizzbuzz-algorithms');
/*
Write a function which checks given input/parameter:
- If input/parameter is divisible by 3 print => Fizz
- If input/parameter is divisible by 5 print => Buzz
- If input/parameter is divisible by 3 or 5 print => FizzBuzz
- If input/parameter is NOT divisible by 3 or 5 print => given Input Number/Value
- If input/parameter is other than Number/Value print => 'Nan - Not a Number! Please Input Number'
*/
function isfizzBuzz(arg){
if(typeof arg !== 'number'){
return ('Nan - Not a Number! Please Input Number');
}
if((arg % 3 === 0) && (arg % 5 === 0)) {
return 'FizzBuzz';
}
if(arg % 3 === 0) {
return 'Fizz';
}
if(arg % 5 === 0) {
return 'Buzz';
}
else {
return 'Some odd number entered: ' + arg;
}
}
let checkFizzBuzz1 = isfizzBuzz('one');
console.log(checkFizzBuzz1);
let checkFizzBuzz2 = isfizzBuzz(true);
console.log(checkFizzBuzz2);
let checkFizzBuzz3 = isfizzBuzz(9);
console.log(checkFizzBuzz3);
let checkFizzBuzz4 = isfizzBuzz(10);
console.log(checkFizzBuzz4);
let checkFizzBuzz5 = isfizzBuzz(30);
console.log(checkFizzBuzz5);
let checkFizzBuzz6 = isfizzBuzz(11);
console.log(checkFizzBuzz6);
```
Example 5 Speed Limits
=====================
Image 5 - Speed Limits
> **Syntax & Example**: `5-speed-limits.html`
```html
speed-limits
5-speed-limits!
Write a function which checks given input/parameter:
- If input/parameter is below speedlimit of 70 print => 'Good Safe Driving'
- If input/parameter is above speedlimit of 70, every 5 kilometers is Penalty Point, print => 'Speed Limit Crossed by Penalty Point' + Point
- If Driver gets more than 10 penalty points ie. above the speed limit 120, print => 'License Suspended'
```
> **Syntax & Example**: `script.js`
```js
console.log('5-speed-limits');
/*
Write a function which checks given input/parameter:
- If input/parameter is below speedlimit of 70 print => 'Good Safe Driving'
- If input/parameter is above speedlimit of 70, every 5 kilometers is Penalty Point, print => 'Speed Limit Crossed by Penalty Point' + Point
- If Driver gets more than 10 penalty points ie. above the speed limit 120, print => 'License Suspended'
*/
const SPEEDLIMIT = 70;
const KMPERPOINT = 5;
function checkSpeedLimit(curSpeed) {
if (curSpeed <= SPEEDLIMIT) {
return ('Good Safe Driving!');
} else {
let penaltyPoint = Math.floor((curSpeed - SPEEDLIMIT) / KMPERPOINT);
if (penaltyPoint < 10) {
return ('Speed Limit Crossed by Penalty Point: ' + penaltyPoint);
} else {
return ('License Suspended!');
}
}
}
let checkPoin1 = checkSpeedLimit(40);
console.log(checkPoin1);
let checkPoin2 = checkSpeedLimit(70);
console.log(checkPoin2);
let checkPoin3 = checkSpeedLimit(75);
console.log(checkPoin3);
let checkPoin4 = checkSpeedLimit(99);
console.log(checkPoin4);
let checkPoin5 = checkSpeedLimit(120);
console.log(checkPoin5);
```
Example 6 Odd Even Number Loop
=====================
Image 6 - Odd Even Number Loop
> **Syntax & Example**: `6-odd-even-number-loop.html`
```html
odd-even-number-loop
6-odd-even-number-loop!
Write a function which checks number till given input/parameter is odd or even
```
> **Syntax & Example**: `script.js`
```js
console.log('6-odd-even-number-loop');
function isOddEvenNumber(curLimit) {
for(let i = 0; i <= curLimit; i++) {
/* if (i % 2 === 0) {
console.log(i , 'EVEN');
} else {
console.log(i , 'ODD');
} */
const alertMessage = (i % 2 === 0) ? 'EVEN' : 'ODD';
console.log(i , alertMessage);
}
}
isOddEvenNumber(10);
// isOddEvenNumber(17);
```
Example 7 Count Truthy Falsy Values
=====================
Image 7 - Count Truthy Falsy Values
> **Syntax & Example**: `7-count-truthy-falsy-values.html`
```html
count-truthy-falsy-values.html
7-count-truthy-falsy-values!
Write a function which checks and count the truthy values from an array
Falsy values in JavaScript are:
- false
- 0 (zero)
- undefined
- null
- ''
- NaN
```
> **Syntax & Example**: `script.js`
```js
console.log('7-count-truthy-falsy-values');
/*
Write a function which checks and count the truthy values from an array
Falsy values in JavaScript are:
- false
- 0 (zero)
- undefined
- null
- ''
- NaN
*/
const valuesArray = [0, 1, '', undefined, false, true];
function checkCountTruthyFalsy(curArray) {
let truthyCount = 0;
for (let value of curArray) {
// no need to check if(value !== false || value !== 0 || value !== '' or ...)
if (value) {
truthyCount++;
}
}
return truthyCount;
}
console.log(checkCountTruthyFalsy(valuesArray));
```
Example 8 Object String Properties Key
=====================
Image 8 - Object String Properties Key
> **Syntax & Example**: `8-object-string-properties-key.html`
```html
object-string-properties-key
8-object-string-properties-key!
Write a function which checks and prints only the string type properties of an object
```
> **Syntax & Example**: `script.js`
```js
console.log('8-object-string-properties-key');
function showStringProperties(curObj) {
for(let key in curObj) {
// console.log('key/prop:', key);
if(typeof(curObj[key]) === 'string') {
console.log(key,':', curObj[key]);
}
}
}
const Person = {
name: 'Dinanath',
age: 40,
height: 5.6,
country: 'India',
designation: 'UI Developer'
}
showStringProperties(Person);
console.log('----------');
const Technology = {
name: 'JavaScipt',
version: 6,
purpose: 'Scripting language for Web',
developer: 'Netscape Corporation'
}
showStringProperties(Technology);
console.log('----------');
```
Example 9 Sum of Multiples
=====================
Image 9 - Sum of Multiples
> **Syntax & Example**: `9-sum-of-multiples.html`
```html
sum-of-multiples
9-sum-of-multiples!
Write a function which Calculate the sum of multiples of 3 and 5 for a given limit
```
> **Syntax & Example**: `script.js`
```js
console.log('9-sum-of-multiples');
function sumOfMultiples(curLimit) {
let sumOfMultipleValue = 0;
for(let i = 0; i <= curLimit; i++) {
if (i % 3 === 0 || i % 5 === 0) {
// console.log(i);
sumOfMultipleValue +=i;
}
}
// return sumOfMultipleValue;
console.log(`sumOfMultipleValue of 3 & 5 upto ${curLimit} digit is:`, sumOfMultipleValue);
}
sumOfMultiples(10);
```
Example 10 Netsted Loop Star Pattern
=====================
Image 10 - Netsted Loop Star Pattern
> **Syntax & Example**: `10-netsted-loop-star-pattern.html`
```html
10-netsted-loop-star-pattern
10-netsted-loop-star-pattern!
Write a function which Prints/Shows star-aestrikes (or any pattern) for the number of times and rows provided
```
> **Syntax & Example**: `script.js`
```js
console.log('10-netsted-loop-star-pattern');
function showPattern(totalRowsPatternCount) {
for (let curRow = 1; curRow <= totalRowsPatternCount; curRow++) {
// console.log(curRow);
let patternDesign = '';
for (let i = 0; i < curRow; i++) {
patternDesign += '*'
}
console.log(patternDesign);
}
}
showPattern(5);
```
Example 11 Marks Average Grade
=====================
Image 11 - Marks Average Grade
> **Syntax & Example**: `11-marks-average-grade.html`
```html
marks-average-grade
11-marks-average-grade!
Write a function which Calculate the sum of marks provided in an array, average it and also show Grade
Grade criteria/mechanism is:
- 0% to 70% => D Grade
- 71% to 79% => C Grade
- 81% to 89% => B Grade
- 91% to 100% => A Grade
```
> **Syntax & Example**: `script.js`
```js
console.log('11-marks-average-grade');
// approach 1
/* const MARKSARRAY = [55, 85, 55, 65];
function calculateAverageGrade(currentMarks) {
let totalMarks = 0;
let averageMarks = 0;
let grade;
for(let mark of currentMarks) {
totalMarks += mark;
}
// console.log('totalMarks:', totalMarks);
averageMarks = (totalMarks/currentMarks.length);
// console.log('averageMarks:', averageMarks);
if(averageMarks < 70) return grade = 'D';
if(averageMarks < 80) return grade = 'C';
if(averageMarks < 90) return grade = 'B';
if(averageMarks <= 100) return grade = 'A';
}
console.log('Grade:', calculateAverageGrade(MARKSARRAY)); */
// approach 2 - create two different functions with single responsibility principle
const MARKSARRAY = [55, 85, 55, 65];
function calculateAverage(currentArray) {
let total = 0;
for (let curValue of currentArray) {
total += curValue;
}
// console.log('total:', total);
return (total/currentArray.length);
}
// console.log(calculateAverage(MARKSARRAY));
function calculateGrades(_currentArray) {
const average = calculateAverage(_currentArray);
// console.log('average:', average);
if(average < 70) return grade = 'D';
if(average < 80) return grade = 'C';
if(average < 90) return grade = 'B';
if(average <= 100) return grade = 'A';
}
console.log('Grade:',calculateGrades(MARKSARRAY));
```
Example 12 Random Bingo Card
=====================
Image 12 - Random Bingo Card
> **Syntax & Example**: `12-random-bingo-card.html`
```html
random-bingo-card
12-random-bingo-card!
Write a function to create a Bingo Card with Random numbers upto 75
B
I
N
G
O
Free
Click here (Reload/Refresh) to create Random Bingo Card!
```
> **Syntax & Example**: `script.js`
```js
console.log('12-random-bingo-card');
window.onload = createBingoCard;
function createBingoCard() {
// console.log('in createBingoCard');
for (var i = 1; i <= 24; i++) {
var newRandomNum = Math.floor(Math.random() * 75);
// console.log('newRandomNum', newRandomNum);
document.getElementById('Square' + i).innerHTML = newRandomNum;
}
}
```
Example 13 Show Prime Numbers
=====================
Image 13 - Show Prime Numbers
> **Syntax & Example**: `13-show-prime-numbers.html`
```html
show-prime-numbers
13-show-prime-numbers!
Write a function which show or print Prime Number upto provided range
- Prime Numbers are those numbers whose factors are only `1` and `the number itself`
- In simple language Prime Numbers are divisible by only `1` and `the number itself/himself`
- Prime Numbers have only two factors: `1` and `the number itself/himself`
- Example: 2, 3, 5, 7, 11, 13, 17, 19 and so on...
```
> **Syntax & Example**: `script.js`
```js
console.log('13-show-prime-numbers');
// approach 1
/* function showPrimeNumbers(numberLimit) {
for (let curNum = 2; curNum <= numberLimit; curNum++) {
// console.log('curNum', curNum);
let isPrime = true;
for (let factor = 2; factor < curNum; factor++) {
// console.log('factor', factor);
if (curNum % factor === 0) {
isPrime = false;
break;
}
}
if (isPrime) {
console.log('Prime Number', curNum);
}
}
}
showPrimeNumbers(20);*/
// approach 2
function showPrimeNumbers(numberLimit) {
for (let curNum = 2; curNum <= numberLimit; curNum++) {
// console.log('curNum', curNum);
if (isPrimeNumber(curNum)) {
console.log('Prime Number:', curNum);
}
}
}
function isPrimeNumber(_number) {
for (let factor = 2; factor < _number; factor++) {
// console.log('factor', factor);
if (_number % factor === 0) {
return false;
}
}
return true;
}
showPrimeNumbers(20);
```
Example 14 Sum Of Arguments
=====================
Image 14 - Sum Of Arguments
> **Syntax & Example**: `14-sum-of-arguments.html`
```html
sum-of-arguments
14-sum-of-arguments!
Write a function which show or print Sum of Arguments passed
```
> **Syntax & Example**: `script.js`
```js
console.log('14-sum-of-arguments');
function sumOfArguments(...items){
// rest operator converts anything passed as an array
console.log('current items/values to add:', items);
return items.reduce((n1, n2) => n1 +n2);
}
console.log('Sum:', sumOfArguments(10, 2, 8, 4, 6));
// console.log('Sum:', sumOfArguments([10, 2, 8, 4, 6]));
```
Example 15 Sum Of Arguments Array
=====================
Image 15 - Sum Of Arguments Array
> **Syntax & Example**: `15-sum-of-arguments-array.html`
```html
sum-of-arguments-array
15-sum-of-arguments-array!
Write a function which show or print Sum of Arguments passed as an Array
```
> **Syntax & Example**: `script.js`
```js
console.log('15-sum-of-arguments-array');
function sumOfArguments(...items){
// as rest operator converts anything passed as an array check following
if(items.length === 1 && Array.isArray(items[0])) {
// reset item as a new array
items = [...items[0]]
console.log('current items/values to add:', items);
return items.reduce((n1, n2) => n1 +n2);
}
}
// pass arguments as an array
// console.log('Sum:', sumOfArguments([10, 2, 8, 4, 6]));
console.log('Sum:', sumOfArguments([10, 2, 8, 4, 6]));
```
Example 16 Circle Area Object Read Only Property
=====================
Image 16 - Circle Area Object Read Only Property
> **Syntax & Example**: `16-circle-area-object-read-only-property.html`
```html
circle-area-object-read-only-property
16-circle-area-object-read-only-property!
Create an object with read only propety named 'area'
```
> **Syntax & Example**: `script.js`
```js
console.log('16-circle-area-object-read-only-property');
const CIRCLE = {
name: 'mainCircle',
lineColor: 'red',
bgColor: 'gray',
radius: 1,
get area() {
return Math.PI * this.radius * this.radius;
}
}
console.log('CIRCLE.area:', CIRCLE.area);
```
Example 17 Create Array From Argument Range
=====================
Image 17 - Create Array From Argument Range
> **Syntax & Example**: `17-create-array-from-argument-range.html`
```html
create-array-from-argument-range
17-create-array-from-argument-range!
Create an array of the values from the 'min' and 'max' (start & end) range provided
```
> **Syntax & Example**: `script.js`
```js
console.log('17-create-array-from-argument-range');
function generateArrayFromRange(startNum, endNum) {
const rangeArray = [];
for(let curNum = startNum; curNum <= endNum; curNum++) {
// console.log('curNum: ', curNum);
rangeArray.push(curNum);
// console.log('rangeArray: ', rangeArray);
}
return rangeArray;
}
const range1 = generateArrayFromRange(1, 5);
console.log(range1);
console.log('----------');
const range2 = generateArrayFromRange(-5, 0);
console.log(range2);
```
Example 18 Array Includes Element Exists
=====================
Image 18 - Array Includes Element Exists
> **Syntax & Example**: `18-array-includes-element-exists.html`
```html
array-includes-element-exists
18-array-includes-element-exists!
Create a method named 'includes' which checks an element exists in an array
```
> **Syntax & Example**: `script.js`
```js
console.log('18-array-includes-element-exists');
function includes(arrayToSearch, elementToSearch) {
console.log('arrayToSearch: ', arrayToSearch);
console.log('elementToSearch: ', elementToSearch);
for(let curElement of arrayToSearch) {
if(curElement === elementToSearch) {
return true;
}
}
return false;
}
const versionArray = [1, 2, 5, 7, 2];
console.log(includes(versionArray, 2));
console.log('---------');
const ageArray = [21, 22, 25, 27, 25];
console.log(includes(ageArray, 30));
```
Example 19 Array Excludes Value To New Array
=====================
Image 19 - Array Excludes Value To New Array
> **Syntax & Example**: `19-array-excludes-value-to-new-array.html`
```html
array-excludes-value-to-new-array
19-array-excludes-value-to-new-array!
Create a method named 'excludes' which cut/excludes values from existing array and push to new array
```
> **Syntax & Example**: `script.js`
```js
console.log('19-array-excludes-value-to-new-array');
function excludes(arrayToExclude, elementsToExcluded) {
console.log('arrayToExclude: ', arrayToExclude);
console.log('elementsToExcluded: ', elementsToExcluded);
const outputArray = [];
for(let curElement of arrayToExclude) {
if(!elementsToExcluded.includes(curElement)) {
outputArray.push(curElement)
}
}
return outputArray;
}
const versionArray = [1, 2, 5, 7, 2];
const newVesionArray = (excludes(versionArray, [2]));
console.log('newVesionArray: ', newVesionArray);
console.log('---------');
const ageArray = [21, 25, 22, 25, 30, 25, 30];
const newAgeArray = (excludes(ageArray, [25,30]));
console.log('newAgeArray: ', newAgeArray);
```
Example 20 Array Count Search Occurances
=====================
Image 20-01 - Array Count Search Occurances
> **Syntax & Example**: `array-count-search-occurances.html`
```html
array-count-search-occurances
20-array-count-search-occurances!
Create a function which counts the search occurances from an array
```
> **Syntax & Example**: `script.js`
```js
console.log('20-array-count-search-occurances');
// approach 1
/* function countSearchOccurances(arrayToSearch, elementsToSearch) {
// console.log('arrayToSearch: ', arrayToSearch);
// console.log('elementsToSearch: ', elementsToSearch);
let count = 0;
for(let curElement of arrayToSearch) {
if(curElement === elementsToSearch) {
count++;
}
}
// console.log('search count:', count);
return count;
} */
// approach 2
function countSearchOccurances(arrayToSearch, elementsToSearch) {
return arrayToSearch.reduce((countAccumulator, curentSearchElement) => {
let countOccurances = (curentSearchElement === elementsToSearch) ? 1 : 0;
// console.log('countAccumulator', countAccumulator, 'arrayToSearch', arrayToSearch, 'elementsToSearch', elementsToSearch,);
return countAccumulator + countOccurances;
},0)
}
const versionArray = [1, 2, 5, 7, 2];
const versionCount = (countSearchOccurances(versionArray, 2));
console.log('versionCount: ', versionCount);
console.log('---------');
const ageArray = [21, 25, 22, 25, 30, 25, 30];
const ageCount = (countSearchOccurances(ageArray, -25));
console.log('ageCount: ', ageCount);
```
Image 20-02 - Array Count Search Occurances
Example 21 - Array Get Max Largest Number
=====================
Image 21 - Array Get Max Largest Number
> **Syntax & Example**: `21-array-get-max-largest-number.html`
```html
array-get-max-largest-number
21-array-get-max-largest-number!
Create a function which returns the maximum ie. largest number from an array
```
> **Syntax & Example**: `script.js`
```js
console.log('21-array-get-max-largest-number');
// approach 1
/*
function getLargestNumber(arrayToSearch) {
if (arrayToSearch.length <= 0) return 'Array is Empty! Nothing to search!!';
let largetNumber = arrayToSearch[0];
for (let i = 1; i < arrayToSearch.length; i++) {
if (arrayToSearch[i] > largetNumber) {
largetNumber = arrayToSearch[i];
}
}
return largetNumber;
}
const versionArray = [5, 2, 3, 4, 7];
const largestVersion = (getLargestNumber(versionArray));
console.log('largestVersion: ', largestVersion);
console.log('---------');
const ageArray = [21, 25, 22, 25, 30, 25, 30];
const maxAge = (getLargestNumber(ageArray));
console.log('maxAge: ', maxAge); */
// approach 2
function getLargestNumber(arrayToSearch) {
if (arrayToSearch.length <= 0) return 'Array is Empty! Nothing to search!!';
return arrayToSearch.reduce((largetNumber, curentSearchElement) => {
return (curentSearchElement > largetNumber) ? curentSearchElement : largetNumber;
})
}
const versionArray = [5, 2, 3, 4, 7];
const largestVersion = (getLargestNumber(versionArray));
console.log('largestVersion: ', largestVersion);
console.log('---------');
const ageArray = [21, 25, 22, 25, 30, 25, 30];
const maxAge = (getLargestNumber(ageArray));
console.log('maxAge: ', maxAge);
```
Example 22 Array Filter Sort Map
=====================
Image 22 - Array Filter Sort Map
> **Syntax & Example**: `22-array-filter-sort-map.html`
```html
array-filter-sort-map
22-array-filter-sort-map!
Array: Filter the array of students with Higest Ranking, Sort on Ranking, finally Show the Names
```
> **Syntax & Example**: `script.js`
```js
console.log('22-array-filter-sort-map');
const studentsArray = [
{ name: 'Suraj', year: 2019, ranking: 4 },
{ name: 'Amit', year: 2019, ranking: 5 },
{ name: 'Akash', year: 2018, ranking: 4 },
{ name: 'Dinanath', year: 2019, ranking: 7 },
{ name: 'Sagar', year: 2017, ranking: 3 },
]
console.log('Higest Rank Holders:',
studentsArray
.filter(student => student.year === 2019 && student.ranking >= 5)
.sort((n1, n2) => n1.ranking - n2.ranking)
.reverse()
.map(student => student.name)
);
```
Example 23 Object Create Students and Address Object
=====================
Image 23 - Object Create Students and Address Object
> **Syntax & Example**: `23-object-create-students-and-address-object.html`
```html
object-create-students-and-address-object
23-object-create-students-and-address-object!
Create an Object for Students and Address with various Properties and Methods
```
> **Syntax & Example**: `script.js`
```js
console.log('23-object-create-students-and-address-object');
const Students = {
name: 'Dinanath',
age: 35,
rank: 5,
country: 'India',
}
const Address = {
street: 'Sir DJ Road',
city: 'Mumbai',
pinCode: 401209,
state: 'MH',
country: 'India',
}
function showObjectDetails(obj) {
for(let key in obj) {
console.log(key,' : ',obj[key]);
}
}
showObjectDetails(Students);
console.log('----------');
showObjectDetails(Address);
```
Example 24 Object Create Object Factory Constructor Function
=====================
Image 24 - Object Create Object Factory Constructor Function
> **Syntax & Example**: `24-object-create-object-factory-constructor-function.html`
```html
object-create-object-factory-constructor-function
24-object-create-object-factory-constructor-function!
Create an Object of Students by using Factory and Constructor methods
```
> **Syntax & Example**: `script.js`
```js
console.log('24-object-create-object-factory-constructor-function');
// Factory function/method - camelCasing - camel notation - use return keyword
function createObjFactoryMethod(name, age, rank, country) {
return {
name, age, rank, country
}
}
let Students1 = createObjFactoryMethod('Dinanath', 35, 5, 'India');
console.log('Students1', Students1);
// Constructor function/method - pascalCasing - pascal notation - use this keyword
function Student(name, age, rank, country) {
this.name = name;
this.age = age;
this.rank = rank;
this.country = country;
}
let Students2 = new Student('Amit', 30, 4, 'Hindustan');
console.log('Students2', Students2);
```
Example 25 Object Equality
=====================
Image 25 - Object Equality
> **Syntax & Example**: `25-object-equality.html`
```html
object-equality
25-object-equality!
Write function to check object equality
```
> **Syntax & Example**: `script.js`
```js
console.log('25-object-equality');
// Constructor function/method - pascalCasing - pascal notation - use this keyword
function Student(name, age, rank, country) {
this.name = name;
this.age = age;
this.rank = rank;
this.country = country;
}
let Students1 = new Student('Dinanath', 35, 5, 'India');
console.log('Students1', Students1);
let Students2 = new Student('Dinanath', 35, 5, 'India');
console.log('Students2', Students2);
console.log('----------');
// Objects are reference type, objects can have same properties but they are from different memeory location, they can be equal if both objects have same properties
function isObjectEqual(obj1, obj2){
return obj1.name === obj2.name &&
obj1.age === obj2.age &&
obj1.rank === obj2.rank &&
obj1.country === obj2.country
}
console.log('isEqual', isObjectEqual(Students1, Students2));
console.log('----------');
// Objects are same if both are pointed to same object
function isObjectPointSame(obj1, obj2){
return obj1 === obj2;
}
let isSame1 = isObjectPointSame(Students1, Students2);
console.log('isSame1', isSame1);
let Students3 = Students2;
let isSame2 = isObjectPointSame(Students2, Students3);
console.log('isSame2', isSame2);
```