Thursday, July 20, 2023

ARRAY FILTER

 ARRAY FILTER

It extract the element of an array that satisfying the provided condition. It doesn't change the original array.

filter() Syntax

arr.filter(callback(element), thisArg)

 

 

<!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>Document</title>

 

    <h2 style="background-color: rgb(9, 238, 9);color:rgb(255, 0, 0);font-weight: bolder;font-family: Georgia, 'Times New Roman', Times, serif;">Array Filter</h2>

    <h5 style="color: rgb(231, 15, 166);">Output</h5>

    <script>

        var i = 0;  

 

        function fun() {  

        var res = "Width = " + window.outerWidth + "<br>" + "Height = " + window.outerHeight;  

        document.getElementById("para").innerHTML = res;  

         

        var res1 = i += 1;  

        document.getElementById("s1").innerHTML = res1;  

        }  

        </script>          

</head>

<body>

    <p><input type="number" id="ageToCheck" value="30"></p>

 

<button onclick="myFunction()">Try it</button>

 

<p id="demo"></p>

 

<script>

const ages = [32, 33, 12, 41,5,55,63,71];

 

function checkAge(age) {

  return age > document.getElementById("ageToCheck").value;

}

 

function myFunction() {

  document.getElementById("demo").innerHTML = ages.filter(checkAge);

}

</script>  

    </body>  

</html>

 

Output










<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>Document</title>

    <script>

        function callfor()

        {

            var myarray=[{course:'DCA',admission:103},

                        {course:'HDCA',admission:39},

                        {course:'DMO',admission:23},

                        {course:'ADJP',admission:52},

                        {course:'ADPP',admission:62},

                        {course:'TPRIME',admission:52}];

            var x2=myarray.map((item)=>item.admission).filter((value)=>value>50);

            console.log(x2);

        }

    </script>

</head>

<body>

    <button onclick="callfor()">Check</button>

</body>

</html>

 

Output






<!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>Document</title>

 

    <h2 style="background-color: rgb(9, 238, 9);color:rgb(255, 0, 0);font-weight: bolder;font-family: Georgia, 'Times New Roman', Times, serif;">Array Filter</h2>

    <h5 style="color: rgb(231, 15, 166);">Output</h5>

         

</head>

<body>

    <script>

       var a = [

  {name: "Dolphin", habitat: "Ocean"},

  {name: "Whale", habitat: "Ocean"},

  {name: "Cat", habitat: "Home"},

  {name: "Tiger", habitat: "Jungle"}

];

var aqua =  a.filter(function(creature) {

  return creature.habitat == "Ocean";

});

 

console.log(aqua);

document.write(aqua);

        </script>  

    </body>  

</html>

 

Output




Even Number Program

<!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>Document</title>

 

    <h2 style="background-color: rgb(9, 238, 9);color:rgb(255, 0, 0);font-weight: bolder;font-family: Georgia, 'Times New Roman', Times, serif;">Array Filter</h2>

    <h5 style="color: rgb(231, 15, 166);">Output</h5>

         

</head>

<body>

    <script>

       let numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];

 

function checkEven(number) {

  if (number % 2 == 0)

    return true;

  else

    return false;

}

 

let evenNumbers = numbers.filter(checkEven);

document.write(evenNumbers);

        </script>  

    </body>  

</html>

 

Output



0 comments:

Post a Comment