JavaScript

流程控制

选择结构

1.if语句(单分支)

      if (条件表达式) {代码块}  



      let age =prompt("请输入你的年龄")

      if (age>=18){

       document.write("你可以进入本网站")

      }


   

   2.if...else(双分支)

      if (条件表达式) {代码段1} else{代码段2}

       let age =prompt("请输入你的年龄")

      if (age>=18){

       document.write("你可以进入本网站")

      }else{

        document.write("非法访问")

     }


   

  3.if...else if..else(多分枝)

     let num=prompt("输入你的分数")

     if(num=100){

       document.write("拿奖学金")



     }else if(num>=80 && num<90){

       document.write("成绩优秀")



     }else if(num>=60 && nun<80){

       document.write("成绩合格")



     }else if(num>=40 &&num<60){

        document.write("有补考机会")

     } else if(num>=20 && num<40){

       document.write("挂科")

     }else {

       document.write("留级")

    }


   

 4.switch语句

   case-情况;break-跳出循环

    switch(表达式){

      case 值1:

      代码段;

      break;



      case 值2:

      代码段;

      break;



      case 值3:

      代码段;

      break;



      ...



      default

      代码段n

    }

        

let subject =prompt ('请输入你想要选择的专业:1-区块链专业;2-UI专业;3-土木专业;4-农林专业')

    console.log(subject);

    switch(subject){

      case 1:

         document.write('恭喜你选择了本世纪最伟大的专业')

         break;

         case 2:



         document.write('恭喜你要和人工智能抢饭碗')

         break;



         case 3:

         document.write('恭喜你要工地打灰四十年')

         break;



         case 4:

         document.write('恭喜你要回家养猪了')

         break;

         default:

            document.write('请输入你的专业')

            break;

    }

循环结构


 

1.for语句

        for(初始化变量;条件表达式;操作表达式){

            循环体

       }



       

       for(var i =1;i<=100;i++){

       console.log(i);



      }

      let sum=0;

      for(i=1;i<=100;i++){

        if(i%2==0){

       sum+=i;

        }

    }

        console.log(sum);


   

 2:while语句

    while (条件表达式) {循环体}



    var i=1;



    while (i<=100) {

        console.log(i);

        i++;

       

    }



    弹出一个确认框:"我喜欢你,我们在一起好吗?"

    如果对方点击确定,弹出"那我们什么时候结婚"

    如果点击否定,弹出"那我明天再问一遍"

        let res =confirm('我喜欢你,我们在一起好吗?')

        console.log(res);

        while (!res) {

            document.write("那我明天再问一遍")

        }

        document.write("那我们什么时候结婚")




        let sum=0;

        var i =0;

        while (i<=100) {

        if(i%2==0){

       sum+=i;

         }

         i++

     }

        console.log(sum);




         var name =prompt("请输入用户名")

         var password = prompt("请输入密码")

         while (name !='admin' && password !='123456') {

         name =prompt("请输入用户名")

         password = prompt("请输入密码")

           

         }

         alert("登录成功")



       

 3.do...while语句

        while 语句先判断条件表达式的值,再根据条件表达式的值决定是否执行循环体

        do...while语句会无条件执行1次循环体,然后再判断条件表达式的值

        再根据判断的值决定是继续否进行循环体



        do{循环体}while(表达式)



        var i=0;

        do{

            i++

            console.log(i);

        }while(i<100)



        var i=0;

        var sum =0;

        do{

            i++;

            if(i%2==0){

                sum+=i

            }

        }while(i<100)

        console.log(sum);

       

       跳转语句

       

    break语句会立即跳出本次循环,也就是循环结束

    continue语句用来跳出本次循环,跳过continue语句后面代码,进行下一次循环

    

 1.break语句

        for(var i=1; i<=5; i++){

            if(i==3){

                console.log("吃到了毒苹果");

                break;//跳出整个循环

            }

            console.log("我吃完了"+i+"个苹果");

        }

        我吃完了1个苹果

        我吃完了2个苹果

        吃到了毒苹果



     

  2.continue语句

        for(var i=1; i<=5; i++){

            if(i==3){

                console.log("吃到了虫苹果");

                continue;//

            }

            console.log("我吃完了"+i+"个苹果");

        }

         我吃完了1个苹果

         我吃完了2个苹果

         吃到了虫苹果

         我吃完了4个苹果

         我吃完了5个苹

循环嵌套


       

  需求:在控制台输出4列4行的*

        var str='';

        成列

        for(var i=1;i <=4; i++){

            成行

            for(var j=1; j<=4; j++){

                str+="*"

            }



            "\n"是换行的转义符

            str +="\n"

        }

        console.log(str);



        var str='';

       

            for(var i=1;i <=5; i++){

             

                for(var j=0; j<i; j++){

                   str+="*"

                }

                  str +="<br/>"

            }

             <br>换行标签

       document.write(str)


     

      需求:输出"金字塔"

           var n = prompt('输入金字塔层数')

        如果输入不是数字,就转化为nan

            n=Number(n) &&  parseInt(n)

         console.log(Number(null));//0

            console.log(parseInt(null));//NaN



            console.log(parseInt("123.a"));//123

            console.log(Number("123.a"));//NaN

    逻辑与符号必须均满足Number和parseInt的效果

    如果有一方不满足,n的结果就是NaN

    那么isNaN(n)的值就为true。

var str =""

    循环行数

    for(var i =1;i<=n;i++){

        循环空格

        var black =n-i

        for(var k=0;k<black;k++){

            str +=" "

        }



        循环"*"

     var star =i*2-1

        for(var j =0;j<star;j++){

            str +="*"

        }

        str +="\n"

    }

    console.log(str);

数组

初识数组

      

        数组是一种复杂数据类型。

        用于讲一组集合在一起。

        通过一个变量就可以访问一组数据。



        数组之间通过逗号分隔



        数组中的"搜索/下标",是从0开始计算的。



        声明数组

        let class02 =["tom",'lily','tony']

          打印数组

        console.log(class02);

          打印数组长度

        console.log(class02.length);//3

           打印数组中下标为x的元素

        console.log(class02[0]);//'tom'

        console.log(class02[1]);//'lily'



         数组可以是任意类型的元素,例如字符串、数字、数组

        let arr1 = [1,2,3,4,5,6]

        let arr2 =['string',NaN,null,undefined,arr1]

        console.log(arr2);        

创建数组

      1.以new Array()方式创建数组

        var arr =new Array ();

        console.log(arr);//Array(0)

        var arr =new Array (5);

        console.log(arr);//(empty*5)

        arr =new Array ("tom",'lily','bob');

        console.log(arr);



      2. 使用数组字面量创建数组

        var mood =['sad',,,,,,,'happy']

        console.log(mood.length);//8

        console.log(mood[7]);//happy

        console.log(mood[6]);//undefined

        console.log(mood[0]);//sad

数组的基本操作

     

  1.获取元素长度

        数组名.length



        2.修改数组长度

        数组名.length =number

         var arr = [0,1,2,3]

        console.log(arr.length);//4

        arr.length =5

        console.log(arr); //[0,1,2,3,empty]



         3.添加数组元素

        arr[4] =3

        console.log(arr);//[0,1,2,empty,3]



        4.修改数组元素

        arr[0] = 1

        console.log(arr);//[1,1,2,empty,3]



         5.删除数组元素

        delete 数组名[index] 删除数组中的某个元素值

        delete arr[1];

        console.log(arr);//[1,empty,2,empty,3]



        6.遍历数组

        let arr1 =[10,20,30,40,50,60]

        var sum =0;

        for (var i =0; i<arr1.length;i++) {

           sum += arr1[i]

           arr[0] 10   sum+10 = 0+10=10

           arr[1] 20   sum+20 = 10+20=30

           arr[2] 30   sum+30 = 30+30=60

           arr[3] 40   sum+40 = 40+60=100

           arr[4] 50   sum+50 = 50+100=150

           arr[5] 60   sum+60 = 60+150=210

}

        console.log(sum);//210


       

 需求:

        let score =[97,65,43,90,60,58,36,72,85,77]

        找到班上的最高分和最低分

        var max = min = score[0];

        for(var i= 1;i< score.length; i++){

            if(score[i] > max){

                max = score[i]

            }

            if(score[i] < min){

                min = score[i]

            }

        }

        console.log(max);//99

        console.log(min); //36

    

     7.新增数组元素

        push在数组后添加元素

        let arr3 = [1,2,3,4]

        arr3.push(5,6)

        console.log(arr3); //[1,2,3,4,5,6]

        unshift在数组前添加元素

        arr3.unshift(-2,-1,0)

        console.log(arr3);//[-2,-1,0,1,2,3,4,5,6]

        

        需求:将数组中大于10的元素筛选出来

         var arr4 =[0,-5,19,50,2,0,7,10,11,-6,8,2]

        var arr5 =[]  

    for(let i =0;i< arr4.length; i++){

        console.log(arr4[i]);

        if(arr4[i]>10){

            arr5.push(arr4[i])

    }

}

        console.log(arr5);



        需求:数组去0,形成一个新数组

        var arr6=[]  

    for(let i =0;i< arr4.length; i++){

        console.log(arr4[i]);

        if(arr4[i]!=0){

            arr6.push(arr4[i])

    }

}

        console.log(arr6);




        需求:将数组['一','二','三','四','五']反转,

       反转后的数组为['五','四','三','二','一']

 var arr7 =['一','二','三','四','五'];

       var arr8 =[];

       for(var i =0; i<arr7.length;i++){

        arr8[arr7.length-1-i] =arr7[i]

       }

       console.log(arr8);


 

   

二维数组

二维数组指的是数组元素的值是一个一维数组

        var arr =[80,100,75]

        var arr1 =[

            [80,100,75],

            [90,67,66],

            [99,87,85],

        ]



        访问二维数组

        console.log(arr1[0]);//[80,100,75]

        console.log(arr1[0][0]);//[80]



        遍历二维数组arr1

        for (var i =0; i<arr1.length;i++) {

            for(var j =0; j<arr[i].length;j++){

                console.log(arr[i][j]);

            }

        }

         二维数组倒置

        var arr =[

            ['a','b','c'],

            ['d','e','f'],

            ['g','h','i'],

            ['j','k','l']

        ];



        var res =[

            [],

            [],

            []

        ];

       遍历行

        for(var i =0; i<arr.length; i++){

           遍历列

            for(var j =0; j<arr[i].length;j++){

                res[j][i] =arr[i][j]



            }



        }

        console.log(res);


       

需求:计算出每一位同学的总成绩

        var stu =[

            [88,70,60,60],

            [66,46,60,80],

            [90,70,88,93],

           

        ];

        var sum =0;

        for(var i =0; i<stu.length; i++){

            var sum =0;

            for(var j =0; j<stu[i].length;j++){

                sum +=  stu[i][j]



            }

            console.log('第'+(i+1)+'位的学生的总成绩是'+sum);



        }

函数

初识函数

        [函数定义]

        函数用于封装完成一段特定功能的代码。

        相当于将一条或多条语句组成的代码块包裹起来。

        用户在使用时只需要关心参数和返回值,就能完成特定的功能,而不用了解具体的现实。

      [内置函数]
        console.log(isNaN("number"));//true
        console.log(parseInt('15.99'));//15

        [自定义函数]

        提高代码的复用性,降低程序维护的难度。

        [函数格式]

        function name(params) {    

        }

        function指这是一个函数语句

        name是函数名

        params是函数参数

        {}内放函数的具体功能

        [无参函数]
        封装函数
        function demo() {
            console.log('我是一个函数');
            
        }
        使用函数
        demo()
        demo()
        [有参函数]
        function sum (a,b){
            console.log(a+b);
        }
        sum(1,2)
        sum(88888,99999)
 需求:定义一个函数total,调用函数时传入price价格、num数量 ,
      就可以计算并在页面上打印函数的总价all。

        function total (price,num){
            var all =price *num;
            document.write("商品的总价为"+all+"元")
        }
        total(9999,12)
        total(6666,3)

        [函数的返回值]

        函数的返回值是指函数在调用后获得的数据

        在定义函数时,可以为函数指定一个返回值,函数的返回值可以是任意类型的数据

        在JS中使用return语句得到返回值并退出函数

        {return 表达式}

 function total01 (price,num){
             all =price *num;
             return all
        }
        console.log(total01(9999,12));
需求:定义一个函数maxNum,求任意两数的最大值。
        function maxNum(a,b){
            if (a>b) {
                console.log("最大值"+a);
                
            }else{
                console.log("最大值"+b); 
            }
        }
        maxNum(5,9)
    需求:定义一个函数getSum,可求出任意数组中每个项的和
        function getSum(arr){
            let sum = 0;
            for(let i = 0;i<arr.length;i++){
                sum += arr[i]
            }
            //返回值 
            return sum
        }
        console.log(getSum([1,2,3,4,5]));
        console.log(getSum([5,6,7,8,9,10,11,12,13]));
    需求:判断数组是不是所有元素都是正数,是则返回true,不是则返回false
        function number (arr1){
          for(let i = 0;i<arr1.length;i++){
          if(arr1[i]<0){
            res = false;
            break
          }
        }
        return res;
        }
      console.log(number([1,2,3,4,-1,-2]));
    需求:找出数组中元素为10的下标,有则返回该下标,没有则返回-1
      function find(arr) {
         for (let i = 0; i < arr.length; i++) {
             if (arr[i] == 10) {
                 return i;
                }
            }
             return -1;
             }
            var arr = [1,2,3,4,5];
            var arr1=[6,7,8,9,10];
            console.log(find(arr));
            console.log(find(arr1));


            let arr=[1,2,3,4,5]//-1
            let arr1 =[6,7,8,9,10]
            function getIndex(arr){
     声明变量存储下标
        let index=-1
            for(var i=0;i <arr.length; i++){ console.log(arr[i]);
        if(arr[i]=== 10){index = i;
        break
        }
    }
}
        return index
        console.log(getIndex(arr));//-1
         var index= getIndex(arr1)
        console.log(index);//4
    [获取函数调用时传递所有参数]
        function num (a,b){
            console.log(a,b);
        }
        num(1,2) //1,2
        num(1,2,3,4,5) //1,2
        num(1)  //1  undefined





         ...扩展运算符
          function num1(...nums) {
             console.log(nums);
         }
         num1(1,2,3,4,5)  //[1, 2, 3, 4, 5]
         num1(1,undefined,3) //[1, undefined, 3]
         arguments对象
         在开发时,如果不确定形参的个数,可以不设置形参
         在函数体中直接通过arguments对象获取函数调用时传递的实参
         function num2() {
             console.log(arguments);
             console.log(arguments.length);
         }
             num2(1,2,3,4,5)
             num2(1,2,3)


             需求:定义一个sum函数
             1.通过arguments对象来获取所有实参数
             2.并获取具体的实参值
             3.对所有实参进行求和
             function sun(){
                console.log(arguments);
                var sum =0
                for(var i =0; i<arguments.length;i++){
                    console.log(arguments[i]);
                    sum  +=arguments[i]
                }
                console.log(sum);
             }
                sum(1,2,3)
                sum(1,2,3,4,5)

函数内外变量的作用域

        [变量]

        全局变量:在函数体外声明的变量或者在函数体内省略var关键字声明的变量
        var a =10
        function demo (){
            console.log(a);//a为全局变量,在函数体内可以被访问
        }
        demo()

        console.log(a);//a为全局变量,在函数体外也可以被访问

        局部变量:在函数体内利用var关键字声明的变量

        function demo1 (){
            var b =10
            console.log(b); 函数内部定义的局部变量b,可以在函数体内访问

            c =20; c是省略var关键字声明的变量,为全局变量
            console.log(c);全局变量c,可以在函数内部被访问

            
        }
        demo1() 10
        console.log(b); b is notdefined 不可以在函数外访问局部变量b
        console.log(c); 可以在函数外访问到全局变量c

        
        块级变量:在ES6标准中,新增的let关键字声明的变量为块级变量
        一个花括号{}为一个块级
        
        if(true){
             let sex = '男' let声明变量sex为块级变量
             console.log(sex); 块级变量sex可以在{}内部被访问
        }
          // console.log(sex); 块级变量sex不可在{}外被访问
         
          for(let i =0 ; i<5; i++){
            console.log("循环内部"+i);
          }
          console.log("循环外部+i");i is not defined
 
        【js三种作用域】
        全局作用域:被全局变量所拥有:在{}外声明的变量
        局部作用域:被局部变量所拥有:在函数内定义的变量
        块级作用域:被块级变量所拥有:在分支语句或者循环大括号中定义的变量


        可以访问到var声明的全局变量demo,
        但是demo目前没有赋值,为undefined
        console.log(demo);//undefined 


       let声明的全局变量//不允许在变量初始化前被访问console.log(test);
       Cannot access 'test' before initializatio


       var demo = 7
      let test = 10  全局变量
      function fun(){
        console.log(demo);7
        console.log(test);10
}
    fun()
      console.log(demo);7
      console.log(test);10
      

      [变量提升]
      console.log(a);undefined
      let  a =20;


      通过var声明的变量,在声明并赋值语句之前就可以访问

      console.log(d);//undefined
      var d  =20;

      因为变量提升,所以80-81的代码执行效果与85-87一样

      var d;
      console.log(d);
      var d =20;

函数进阶

       [函数表达式]

        封装一个sum函数,在函数内可以求得变量num1和变量num2的和
        
        var fn = function sum (num1,num2){
            在函数内部封装了一个打印语句
            调用函数,就会执行打印语句
            console.log(num1+num2);
        }
        sum(10,20) 30
        fn(10,20)

        var fn1 = function sum1(num1,num2){
            在函数内部求了一个和
            并将求得的和返回去
            让函数外部可以拿到
            return num1+num2;
            
        }
        console.log(sum1(10,20)); 30
        console.log(fn1(10,20)); 30

        匿名函数
        var fn3 = function(num1,num2){
            console.log(num1+num2);
        }
        fn3(10,20)

        var fn4 = function sum1(num1,num2){
            return num1+num2;
            
        }
        console.log(fn4(10,20)); 30

        

        
        [箭头函数]
        删除function关键字
        在参数和函数体中间放上"=>"
        
         var fn5 = (num1,num2) => {
            console.log(num1+num2);
        }
        fn5(10,20)

        当函数体只有一句话时,可以省略大括号

        var fn6 = (num1,num2) => console.log(num1+num2);
        fn6(10,20)

        当函数体只有一个代码时,并且函数的执行结果就是函数的返回值
        可以省略函数的大括号和return关键字
        var fn7 = (num1,num2) => num1+num2;
        console.log(fn1(10,20)); 30

        当函数只有1个时,可以省略函数外部的小括号
        var fn8 = num1 =>num1+num1
        console.log(fn8(10)); 20

回调函数

        函数fn作为参数传递给参数cal
        然后在函数cal中调用函数fn
        此时,fn就是回调函数
        function cal (num1,num2,fn) {
             return fn(num1,num2)
        }
        console.log(cal(10,20,function(a,b){
            return a+b
        })); 30

        console.log(cal(10,20,function(a,b){
            return a*b
        })); 200

        //练习:调用cal函数,完成num1和num2的取模运算
        console.log(cal(20,10,function(a,b){
            return a%b
        })); 0

定时器函数

      setInterval()
        Interval:间隔,间隙
        "时间间隔"一到,代码就会执行一次。

        setInterval(function(){
            console.log("该上课了");
        },5000)

        setTimeout()
        用来指某个函数或某段代码在多少毫秒以后执行
    
        setTimeout(function,time)
        setTimeout(function(){
            console.log("要抢票了");
        },3000)

        定时器函数属于异步代码
        setTimeout指定的代码,必须等同步代码执行完成后执行

        console.log(1);
        setTimeout(function(){
            console.log(2);
        },0)
        console.log(3);  132

        console.log("A");
        setTimeout(function(){
            console.log("B");
        },20)
        console.log("C");
        setTimeout(function(){
            console.log("D");
        },0) ACDB

函数嵌套与作用域链

      [函数嵌套]

       var i =10;

       function fn1 (){

        var i =20;

        function fn2 (){

            function fn3 (){

                console.log(i);
            }
            fn3()
        }
          fn2()       
       }
         fn1()

闭包函数

         闭包 (close) :闭包是一种代码形式,内部函数访问外部函数的局部变量。
         举例: js函数A中有一个函数B,函数B访问了函数A里面定义的局部变量,此时就产生了闭包。
         变量所在的函数就是闭包函数,在这里,A就是闭包函数。

        外部函数

        function outer (){

        外部函数定义的局部变量
        let n =10

        内部函数
        function inner(){
            内部函数要访问外部函数定义的局部变量
            console.log(n);
        }
          inner()
        }
          outer()
          闭包函数的作用:解决变量污染问题,让变量被函数保护起来。

          let count = 0;
          setInterval(function(){
            console.log(count++);
          },1000)
           在这段代码中,count是一个很常用的变量名。
           为了避免和其他位置的代码冲突,可以使用一个函数将上面的代码包裹起来

          function fn () {
            let count = 0;
            setInterval(function(){
                console.log(count++);
            },1000);
          }
          内部函数setIntrval访问外部函数fn定义的局部变量count
          function fn () {
            let count = 0;
            function add(){
                console.log(count++);
            }
            setInterval(add,count)
          }

网页计算器

       <!-- 以下是HTML部分 -->
    <p>整数1: <input type="text" id="num1"></p>
    <p>整数2: <input type="text" id="num2"></p>
    <p>
        >
        <!-- onclick按钮点击事件 -->
        <input type="button" value="相加" onclick="cal(add)">
        <input type="button" value="相减" onclick="cal(sub)">
        <input type="button" value="相乘" onclick="cal(mul)">
        <input type="button" value="相除" onclick="cal(div)">
    </p>
    <p>结果: <input type="text" id="result"></p>

        以下是JS部分

        function add(num1,num2){
            return num1+num2
        }
        function sub(num1,num2){
            return num1-num2
        }
        function mul(num1,num2){
            return num1*num2
        }
        function div(num1,num2){
            if(num2===0){
                alert("除数不能为0")
            return ""
        }
        return num1/num2
    }

    function cal(){
        通过ID"num1"得到HTML中名字叫"num1"的输入框的值

        var num1 =document.getElementById("num1").value
        var num2 =document.getElementById("num2").value
        var result = document.getElementById("result")
        result.value = func(num1,num2)
    }

    

递归函数

        递归函数是一个函数间接或直接的调用自身

        function func (){
            console.log(1);
            func()
        }

        需求:设置一函数getSum()
        如果传入进去的是n
        return sum =n + (n-1) + (n-2) + .. + 1


        例如:
        n = 5
        sum =5+4+3+2+1=15
        
        循环写法1
        function getSum1(n){
            var sum =0
            for(var i=0 ; i<=n;i++){
                sum +=i

            }
            return sum
        }
        console.log(getSum2(5)); 15

          循环写法2
          function getSum(n){
            var sum =0
            for(var n ; n>=0;n--){
                sum += n

            }
            return sum
        }
        console.log(getSum(5)); 15
         递归写法
        function getSum3(n){
        当n=1时;
        if(n==1){
            return 1;
        }
        当前数组+比自己小1的数字
        return n +getSum3(n-1)
    }
    console.log(getSum3(5));//15
    需求:设置一个函数,求阶乘(循环写法)//传入一个n,返回n*(n-1)*(n-2)*...*1
    需求:设置一个函数,求阶乘(递归写法)//传入一个n,返回n*(n-1)*(n-2)*...*1

    求斐波那契数列(循环写法)
    求斐波那契数列(递归写法)

    循环写法一:
    function fn(n){
             var mulSum =1
             for(var i=1 ; i<=n;i++){
                 mulSum *=i

           }
            return mulSum
         }
         console.log(fn(4));//24

    循环写法二:
    function fn2(n){
             var mulSum =1
             for(var n ; n>0;n--){
                 mulSum *= n

           }
            return mulSum
         }
         console.log(fn2(4));//24
    递归写法:
    function fn3(n){
        设置终点
        if(n===1){
            return 1;
        }
        return n *fn3(n-1)
    }
    console.log(fn3(4));//24
        斐波那契数列(每一项等于前两项之和)
        1,1,2,3,5,8,13,21,34,55,89

        斐波那契数列(循环写法):
        function getValue(n){
            var arr =[1,1]
            for(var i=2;i<n;i++){
              某一个等于前两个数之和
              比如下标i=6(下标为6)的数是8+5(下标为5)
              i是下标,arr[i]对应的是数组值
            arr[i]=arr[i-1]+arr[i-2]
        }
        console.log(arr);
            return arr[arr.length-1]
        
    }
    console.log(getValue(10));
   斐波那契数列(递归写法):
    function getValue2(n){
        设置终点
        if(n===1 || n===2){
            return 1
        }
        return getValue2(n-1)+getValue2(n-2)

    }
    console.log(getValue2(10)); 55

对象

介绍对象

        1.对象是什么:对象是一种复杂数据类型
        (复杂数据类型的内容储存在堆内存中,地址存储在栈内存中)
        2.对象作用: 以键值对的形式存储多个数据

        需求: 存储一个人的信息 (姓名 年龄 性别)


        1.使用简单数据类型

        let name ="张三"
        let age =30;
        let sex ="男"
        (好处: 阅读性高  弊端:冗余)

        2.使用数组
             var people=["张三",39,"男"]
        好处:(一个变量存储多个数据  弊端:阅读性不高)
         3.对象
         let obj={
            键: 值
            name:"张三",
            age:30,
            sex:'男',
            gfs:["小花","小美","小爱"],
            sayHi:function(){

            }
            
     }

      3.1 对象查询

      console.log(obj);//(name:"张三",age:30,sex:'男')
      console.log(obj.name);//"张三"
      console.log(obj.age);//30
      console.log(obj.sex);//'男'
      console.log(obj.gfs);//["小花","小美","小爱"]
      console.log(obj.sayHi);
      console.log(obj.sayHi());

      3.2 对象新增

      obj.bf="李四"
      console.log(obj);

      3.3 对象修改

      obj.bf="王五"
      console.log(obj);

       对于对象的属性,如果有这个属性,是修改属性值;如果没有这个属性,是新增。

        3.4 对象删除

        delete obj.age
        console.log(obj);
      3.5 对象遍历
      遍历数组: for (let i=0; i<arr.lenght; i++){}
      遍历对象: for-in循环: for (let key in 对象名){对象名[key]}
      let score ={
        math:99,
        history:80,
        geology:70,
        english:60
     }

     for(let key in  score){
        console.log(key); 打印属性名
        console.log(score[key]); 打印属性值
     }

Math对象

        1.内置对象:由JS作者提前编写好的对象,里面储存了一些属性方法,直接使用即可。
        2. Math数学对象,Date日期对象

        const pi =3.14
        const r =5
        const C =2*pi*r
        console.log(C);

        a.圆周率:Math.PI
        console.log(Math.PI);
        const c= 2*Math.PI*r
        console.log(c);


        b.绝对值:Math.abs()
        console.log(Math.abs(-3.5));

        c.找最大/最小值:Math.max()/Math.min()
        console.log(Math.max(1,9,5,6,3,4,6,2));//9
        console.log(Math.min(1,9,5,6,3,4,6,2));//1

        d.幂运算:Math.pow(x,y)求x的y次方
        console.log(Math.pow(2,10));//1024
        e.四舍五入:Math.round()
        console.log(Math.round(3.5));//4
        console.log(Math.round(3.2));//3
        console.log(Math.round(-3.5));//-3
        console.log(Math.round(-3.6));//-4

        f.向上取整:Math.ceil()
        console.log(Math.ceil(3.1));//4
        console.log(Math.ceil(-3.1));//-3

        g.向下取整:Math.floor()
        console.log(Math.floor(-1.8));//-2

        h.生成一个0-1之间的随机小数:Math.random()
        console.log(Math.random());

        生成一个0-100之间的随机整数:Math.
        console.log(Math.round(100*Math.random()));

Math对象案例

            当点击btn按钮时,会触发function函数
            btn.onclick = function(){
            生成0-1之间的随机数
            var rand=Math.random()
            设置抽奖范围/人数
            var total =100;
            设置抽奖等级
            var level =0;
            设置抽奖结果
            var number =0;

            抽奖过程
            将number转化为一个0-100之间的整数
            number = Math.round(Math.random()*100)

            抽奖结果
            if(number==1)
            level =1;
            else if(number==2 || number==3)
            level =2;
            else if(number>3 && number<8)
            level =3
            if(level){
                alert("恭喜声 你获得了"+level+"等奖")
            } alert("谢谢参与!")
        
    }

Date对象

        时间戳:从1970年1月1日零时零分零秒到现在的毫秒数
        以下三种写法都会得到时间戳
        console.log(Date.now());
        console.log(+new Date);
        console.log(new Date().getTime());

        获取年份
        console.log(new Date().getUTCFullYear());
        获取月份
        console.log(new Date().getMonth());  //范围是0~11
        获取日期
        console.log(new Date().getDate());  //范围是1~31
        获取星期
        console.log(new Date().getDay());   //范围是0~6 星期天是0
        获取小时
        console.log(new Date().getHours());
        获取分钟
        console.log(new Date().getMinutes());
        获取内置Data对象
        var date =new Date();

        设置年份
        date.setFullYear(2005)
        date.setMonth(1)
        date.setDate(21)

        获取年份
        var year=date.getUTCFullYear()
        var month=date.getMonth()
        var date=date.getDate()
        打印年份
        console.log(year);
        console.log(month);
        console.log(date);
        document.write(year+"年"+month+"月"+date+"日"+"是我出生的日子")
             参数time是自己的出生时间
             function count(time){
             得到当前时间时间戳
            var nowTime = new Date()
            得到过生日时间时间戳
            var overTime = new Date(time)
            将即将过生日的时间剪去现在的时间,得到一个生日倒计时
            %1000 是将亳秒数转化为秒数
            var times = (overTime-nowTime)/1000
           
            console.log(times);
            一天=24小数=60分钟=60秒
            var day = parseInt(times / 60 / 60 / 24)//天数
            console.log(day);//243
            小时//%用于取余数,就是计算完之间70天之后,剩下的小时数
            var hours = parseInt(times / 60 / 60 % 24)//小时
            console.log(hours);//14
            分钟
            var mins = parseInt(times / 60 %60)//分钟
            console.log(mins);//17
            秒数
            var sec = parseInt(times % 60 )//秒数
            console.log(sec);//54
        
            alert("距离生日还有"+day+"天"+hours+"小时"+mins+"分钟"+sec+"秒")
        }

Array对象

         var course = ["web","java"]

         push()在数组末尾添加一个元素
         course.push("javaScript")
         console.log(course); //["web","java","JavaScript"]

         unshift() 在数组开头添加一个元素
         course.unshift("计算机基础")
         console.log(course); //['计算机基础', 'web', 'java', 'javaScript']
        
         pop()删除数组中最后一个元素
         course.pop()
         console.log(course); //['计算机基础', 'web', 'java']

         shift()删除数组第一个元素
         course.shift()
         console.log(course);//['web','java']

         splice (start,deleteCount)
         var arr =[1,2,3,4,5,6,7]
         arr.splice(3,2) //从下标为3的数(4)开始, 删掉后面2个数字
         console.log(arr); //[1,2,3,6,7]

         splice (start,deleteCount,item1,item2,item3)
         arr.splice(4,0,999,888,777) //从下标为4的数字(6)开始往后面添加元素
         console.log(arr); //[1, 2, 3, 6, 999, 888, 777, 7]

         reverse():颠倒数组中元素的索引
         var arr1 =[1,2,3,4,5,6,7]
         arr1.reverse()
         console.log(arr1); //[7, 6, 5, 4, 3, 2, 1]
         sort
         升序排序
         var arr2 =[19,45,20,0,18,73]
         arr2.sort(function(a,b){
            return a-b
         })
         console.log(arr2); //[0, 18, 19, 20, 45, 73]

          降序排序
          var arr3 =[19,45,20,0,18,73]
         arr3.sort(function(a,b){
            return b-a
         })
         console.log(arr3); // [73, 45, 20, 19, 18, 0]

String对象

         创建字符串对象
         var str=new String("apple")
         console.log(str); // ('apple')

         访问字符串长度
         console.log(str.length); //5
         数据类型检测
         console.log(typeof(str)); //object
         var str1="banana"
         console.log(typeof(str1)); //string

         根据字符串返回索引
         indexOf() 返回字符串中首次出现的索引,没有则返回-1
         lastIndexOf(element) 返回字符串中最后一次出现的索引,没有则返回-1
         var str="helloworld"
         console.log(str.indexOf("o")); //4
         console.log(str.lastIndexOf("o")); //6

         根据索引返回字符串
         chatAt
         console.log(str.charAt(7)); //'r'
        字符串截取
        slice (start)
        console.log(str.slice(5)); //"word"
        slice(start,end) 从start的下标截取到end的下标
       console.log(str.slice(1,4));  //"ell"
       console.log(str); //helloword  截取不会改变原数组

       字符串连接
       concat()
         var str1="hello"
         var str2=",world"
         console.log(str.concat(str2)); //helloword,word
          大小写转换
          toUpperCase 转化为大写
          tolowerCase 转化为小写
         console.log(str1.toLocaleUpperCase()); //HELLO
         console.log("HELLO".toLowerCase()); //hello

         替换
         replace(str1,str2)
         console.log(str); //helloworld
         console.log(str.replace("world","JS")); //helloJS

         字符串分隔(将字符串转化为数组)
         split(分隔符)
        console.log(str.split("")); //['h','e','l','l','o','w','o','r','l','d']
        console.log(str.split());//['helloworld']
        console.log(str.split("o"));//['hell','w','rld']

  • 4
    点赞
  • 7
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值