2022-07-12 第八组 张明敏 学习笔记

提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档


一、JavaScript Switch 语句

示例:switch 语句用于基于不同的条件来执行不同的动作。

1.语法

代码如下(示例):

​
 switch (year % 400) {
                case 0:
                    return true;
                default:
                    if (year % 4 == 0 && year % 100 !== 0) {
                        return true;
                    }
                   return false;
            }

​

2.工作原理

首先设置表达式 n(通常是一个变量)。随后表达式的值会与结构中的每个 case 的值做比较。如果存在匹配,则与该 case 关联的代码块会被执行。请使用 break 来阻止代码自动地向下一个 case 运行。

3.注意事项

 1.switch..case的效率问题case后面是字面量(常量)

 2.不要强用Switch

3.函数名的命名规则:小驼峰式

4.Switch...case 里的break是可选的


 二循环

1.For循环

for 循环是您在希望创建循环时常会用到的工具。

(1)语法

for (语句 1; 语句 2; 语句 3)
  {
  被执行的代码块
  }

语句 1 在循环(代码块)开始前执行

语句 2 定义运行循环(代码块)的条件

语句 3 在循环(代码块)已被执行之后执行

​
for (let i = 0; i < arr.length; i++) {
                if (num == arr[i]) {
                    return i;
                }
            }
            return -1;
        }

​

(2)注意事项

  1.let i=0;初始循环条件,当i=0,循环开始,只走一次,在第一次循环的初始化只走一次

  2.i<10 判断循环体,会和初始化等条件配合循环的执行

  3.i++ 循环条件 每次循环体执行完毕让i产生变化

  4.面试题:for循环步骤

           a.i可以看做一个局部变量

           b.循环条件是可以根据实际情况更改的

           c.当循环条件修改时,要确保循环可以向着终点前进

           d.开发中,避免死循环 

三、For/In循环

JavaScript for/in 语句循环遍历对象的属性。

1.语法

​
let arr=[1,2,3,4,5];
        // for in 语句,能做的较少,只能做遍历操作
        // 可以理解为a式arr数组的下标通过映射给a
        for(let a in arr){
            console.log(arr[a]);
        }

​

四、While循环

1.语法

While 循环会在指定条件为真时循环执行代码块。

​
let a = 10;
        function isexist() {
            let year = 2022;
            while (a <= 100) {
                year++;
                a = a * 1.1;
                Math.trunc(a);
            }
            return year+"年人数超过100人,人数是:"+a;
        }
        console.log(isexist());

​

 2.注意事项

         let a=10;初始条件

          a<100 循环判断条件

          a++ 循环条件

          while循环执行流程

          1. 初始化条件

          2. 判断条件

          3. 执行循环体

          4.自增

           while 循环      pk       for循环

          初始化条件不好控制        每个for循环的初始化条件都是隔离的

          循环条件不好控制          每个for循环的a++都是隔离的

          写函数时,返回值便于管理  

提示:如果忘记增加条件中所用变量的值,该循环永远不会结束。该可能导致浏览器崩溃。

五、Do/While循环

do/while 循环是 while 循环的变体。该循环会执行一次代码块,在检查条件是否为真之前,然后如果条件为真的话,就会重复这个循环。

1.语法

​
let a=10;
        do{
            a++;
            console.log(a);
        }
        while(a<20);

​

2.注意事项

 do...while循环

  let a  初始化

  do做什么事  log 循环体  a>100 判断条件

  do...while while区别:

   do...while  先执行一次,无论条件是否成立,都至少走一次

   while 如果条件不成立,一次都不走

   死循环

   for(;;){}

   while(true){}

   do{}while(true);

别忘记增加条件中所用变量的值,否则循环永远不会结束!

六、内置函数

1、Array

1.concat()连接

2.jion()设置分隔符连接数组为一个字符串

3,pop()删除最后一个函数

 4.sort()从小到大排序

2.Global

1.isNaN():判断一个值是不是数字

 2.parseFloat():把一个整数转成一个小数

 3.parseInt():把一个小数转成整数

 4.number():把一个只转成number类型

 5.string():把其他类型转成字符串110+120+119

3.string:

  1.charAt():取出指定位置的字符

  2.indexOf():判断指定字符是否存在,如果存在返回下标

  3.lastIndexOf("a"):从后往前找

  4.resplace("a","b"):替换字符串

  5.split("-"):根据-去拆分字符串,得到一个数组

  6.substring(1,6):字符串的截取

4. Math:

  1.ceil()向上取整

  2.floor()向下取整

  3.round()四舍五入

  4.random()随机,生成0-1的随机数

  5.tan() sin cos cot

  6.E PI

5.Date:

  1.new Date():获取当前时间

  2.getDate():返回日期的日 1~31

  3.getHours():返回时间中的时0~23

  4.getMinutes():返回时间中的分

  5.getSeconds():返回时间中的秒

  6.getTime():获取系统当前时间

6.新写法

新写法 .aaa/#div

        let div=document.querySelector("#div");

        div.innerText =“<b>我是加粗的</b>”;

        console.log(div.innerText);

        div.innerHTML =“<b>我是加粗的</b>”;

         console.log(div.innerHTML);

7.抓元素

1.根据id抓元素

 let div1=document.getElementById("div1");

 console.log(div1);

2.根据class抓元素,并得到元素

 let div=document.getElementsByClassName("div");

   console.log(div[0]);

 3.根据tag抓取HTML元素,得到的是一堆元素

 let div = document.getElementsByTagName("div")

  console.log(div[0]);

  4.新方法

    .根据选择器去抓取一个元素   

 let div =document.querySelector(".div2");

      console.log(div2);

 实例:

​
​
 <p>
        账号: <input type="text" id="username">
    </p>
    <p>
        密码: <input type="text" id="password">
    </p>
    <p>
        <input type="button" value="登录" onclick="login()">
    </p>
    <script>
        function login() {
            let username = document.querySelector("#username").value;
            let password = document.querySelector("#password").value;
            if (username == "admin" && password == "123456") {
                alert("登陆成功");
            } else {
                alert("用户名或密码错误!");
            }
        }
      </script>

​

​

8.二级联动

 <select id="sheng" onchange="setshi">
        <option value="ji">吉林省</option>
        <option value="liao">辽宁省</option>
    </select>
    <select id="shi">
        <option>---请选择城市---</option>
        <!-- <option value="cc">长春市</option>
        <option value="sy">沈阳市</option>
        <option value="sp">四平市</option>
        <option value="dl">大连市</option> -->
    </select>
    <script>
         function setshi(){
            let sheng=document.querySelector('#sheng').value;
            let shi=document.querySelector('#shi');
            shi.innerHTML=null;
            shi.innerHTML='<option value="">---请选择市----</option>'

            let htm=shi.innerHTML;
            if(sheng == 'jl'){
                //追加
                htm += '<option value="cc">长春市</option><option value="sp">四平市</option>';
                shi.innerHTML=htm;
            }
            htm=shi.innerHTML
            if(sheng=='ln'){
                htm += '<option value="sy">沈阳市</option><option value="dl">大连市</option>';
                shi.innerHTML=htm;
            }
            htm=shi.innerHTML

 

 9.三级联动

 <select  id="sheng" onchange="setshi()">
        <option value="">---请选择省----</option>
        <option value="jl"  >吉林省</option>
        <option value="ln" >辽宁省</option>
    </select>
    <select name="" id="shi" onchange="setshi1()">
        <option value="">--请选择市----</option>
    </select>
    <select id="qu">
        <option value="">--请选择区----</option>

    </select>
    <script>
        function setshi1(){
            let sheng=document.querySelector('#sheng').value;
            let shi=document.querySelector('#shi');
            let qu=document.querySelector('#qu')
            qu.innerHTML=null;
            shi.innerHTML=null;
            shi.innerHTML='<option value="">---请选择市----</option>'
            qu.innerHTML='<option value="">--请选择区----</option>'

            let htm=shi.innerHTML;
            if(sheng == 'jl'){
                //追加
                htm += '<option value="cc">长春市</option><option value="jls">吉林市</option>';
                shi.innerHTML=htm;
            }
            htm=shi.innerHTML
            if(sheng=='ln'){
                htm += '<option value="sy">沈阳市</option><option value="dl">大连市</option>';
                shi.innerHTML=htm;
            }
            htm=shi.innerHTML
        }
        function setshi1(){
            let shi=document.querySelector('#shi').value;
            let qu=document.querySelector('#qu');
            qu.innerHTML=null;
            qu.innerHTML='<option value="">--请选择区----</option>'
            let htm=qu.innerHTML;
            if(shi=='cc'){
                htm+='<option value="cyq">朝阳区</option><option value="gxkfq">高新开发区</option>'
                qu.innerHTML=htm;
            }if(shi=='jls'){
                htm+='<option value="cy">昌邑区</option><option value="lt">龙潭区</option>'
                qu.innerHTML=htm;
            }if(shi=='sy'){
                htm+='<option value="aq">A区</option><option value="bq">B区</option>'
                qu.innerHTML=htm;
            }if(shi=="dl"){
                htm+='<option value="cq">C区</option><option value="dq">D区</option>'
                qu.innerHTML=htm;
            }
        }
    </script>

 

 七、学习心得

二级联动,三级联动没咋听懂,懵懵的,自己写总是错,心态崩了!!!

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

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值