JavaScript Array

 <!DOCTYPE html>

<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <input type="text" id="element"><button id="add">Add</button>

    <div id="list">

    </div>

   
    <button onclick="Map1();">Map</button>
    <button onclick="Filter2();">Filter</button>
    <button onclick="reduce();">Reduce</button>
    <button onclick="ForEACH();">ForEach</button>
    <button onclick="Find();">Find</button>
    <button onclick="Include();">Include</button>
    <script>
        let task=[];
        let element=document.getElementById("element");
        let add=document.getElementById("add");
        let list=document.getElementById('list');

       // task.push(5,34,45,5,34);
        //================
        for(let i=0;i<=10;i++){
            task.push(i);
        }
        task.push('A');
       // task.push(5,34,4,5,354,800);
        display();
       

        add.onclick=()=>{
           task.push(element.value);
           display();
           element.value="";
        }


        function display(){
            list.innerHTML="";
            task.forEach(element => {
           list.innerHTML=list.innerHTML+`<h3>${element}</h3>`;
            });
        }
       

        //===============Map==
        function Map1(){
          let newArray= task.map(item=>item*10);
          console.log(newArray);
        }

        function Filter2(){
           // let newArray= task.filter(item=>item===5);
           let newArray= task.filter(item=>item%2===0);
            console.log(newArray);  
        }

        function reduce(){
           // let newArray= task.filter(item=>item===5);
           let newValue= task.reduce((total,item)=>total+item,0);
            console.log(newValue);  
        }

        //===================forEach==a[6]=====value=start_address*(6+1);  100+(6*1)=106
        function ForEACH(){
            task.forEach((item,index)=>{
                console.log(`Index=${index}  Value=${item}`);
            });
        }
        function Find(){
            let n=parseInt(prompt("Enter Number"));
          let r=   task.find((item)=>item==n);
          console.log(r);
        }

        function Include(){
            let n=parseInt(prompt("Enter Number"));
          let r=   task.includes(n);
          alert(r);
        }

    </script>
</body>
</html>

Comments

Post a Comment

Popular posts from this blog

App 1st User Define Component

  import logo from './logo.svg' ; import './App.css' ; import React from "react" ; function App () { let products=[ 1 , 2 , 3 , 4 , 5 , 6 ] ; return <> <h1> Sabirs </h1> { products. map ((item)=>( <ProdoctCard src = {item} /> )) } </> ; } export default App ; function ProdoctCard ({src}) { return <img src = { `./img/ ${src} .webp` } /> ; }
Read more

Example 1

 //====================Component A================== import React , { useState } from "react" ; import B from "./B" ; export default function () { const [name , setName]= useState ( null ) ; return ( <div> <h1> A component </h1> <input value = {name} onChange = {(event)=>setName(event. target . value )} placeholder = { 'Please input name' } /> <h1> {name} </h1> <hr/> <B a = {name} setA = {setName} /> </div> ) }  //====================Component B================== export default function (obj) { //{a,setA} return ( <div> <h1> B component </h1> <input value = {obj. a } onChange = {(event)=>obj. setA (event. target . value )} placeholder = { 'Please input name' } /> <h1> {obj. a } </h1> <hr/> </div> ) }
Read more

Rabiit

Image
   ///==========================Css============== . box-pos { position : relative ; height : 200 px ; backgroundColor : "#e9ecef" ; } . rabit { position : absolute ; bottom : 19 px ; } . start-game-panel { background : #000000bf ; position : absolute ; top : 0 px ; bottom : - 13 px ; right : 0 px ; left : 0 px ; display : flex ; justify-content : center ; align-items : center ; } . img-d { width : 400 px ; } ====================React JS Componant================= import React , { useState , useRef } from "react" ; import "bootstrap/dist/css/bootstrap.min.css" ; import "./rabit.css" ; import "./test.css" ; //============Main Componant export function TestGame () { const [isGameOver , setIsGameOver]= useState ( false ) ; const [isGameStart , setIsGameStart]= useState ( false ) ; const [rabitPos , setRabitPos]= useState ( 0 ) ; const [score , setScore]= useState (...
Read more