JavaScript学习第二天

最新推荐文章于 2023-11-17 08:54:47 发布
最新推荐文章于 2023-11-17 08:54:47 发布
阅读量327 收藏 1
点赞数
文章标签： 学习 javascript 前端 typescript 开发语言
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_58791266/article/details/130786693
版权

1、运算符

1.1 赋值运算符

对变量进行赋值的运算符

  • +=
  • -=
  • *=
  • /=
  • %=
 <script>
        let num = 1
        // num = num + 1
        // 采取赋值运算符
        // num += 1
        num += 3
        console.log(num)   //4
    </script>

1.2 一元运算符

 <script>
        let num = 10
        // num = num + 1
        // num += 1
        // console.log(num);

        // 1. 前置自增
        // let i = 1
        // ++i
        // console.log(i);
        // let i = 1
        // console.log(++i + 1)  //3
        // 2. 后置自增
        // let i = 1
        // i++
        // console.log(i);

        // let i = 1
        // console.log(i++ + 1)  //2

        // 了解 
        let i = 1
        console.log(i++ + ++i + i) //7
    </script>

1.3 比较运算符

  • Ø > ： 左边是否大于右边
  • =： 左边是否大于或等于右边
  • <=： 左边是否小于或等于右边
  • ==： 左右两边值是否相等
  • ===： 左右两边是否类型和值都相等 （开发中推荐使用）
  • !==： 左右两边是否不全等
  • 比较结果为boolean类型，即只会得到 true 或 fals
 <script>
        console.log(3 > 5)  // false 
        console.log(3 >= 3) // true
        console.log(2 == 2) // true
        // 比较运算符有隐式转换 把'2' 转换为 2  双等号 只判断值
        console.log(2 == '2')  // true
        // console.log(undefined === null)
        // === 全等 判断 值 和 数据类型都一样才行
        // 以后判断是否相等 请用 ===  
        console.log(2 === '2')  // false 
        console.log(NaN === NaN) // false  不等于任何人，包括他自己
        console.log(2 !== '2')  // true  
        console.log(2 != '2') // false 
        console.log('-------------------------')
        console.log('a' < 'b') // true
        console.log('aa' < 'ab') // true
        console.log('aa' < 'aac') // true
        console.log('-------------------------')
    </script>

1.4 逻辑运算符

<script>
        // 逻辑与 一假则假
        console.log(true && true)   //true
        console.log(false && true)  //false
        console.log(3 < 5 && 3 > 2) //true
        console.log(3 < 5 && 3 < 2) //false
        console.log('-----------------')
        // 逻辑或 一真则真
        console.log(true || true)   //true
        console.log(false || true)  //true
        console.log(false || false) //false
        console.log('-----------------')
        // 逻辑非  取反
        console.log(!true)  //false
        console.log(!false) //true

        console.log('-----------------')

        let num = 6
        console.log(num > 5 && num < 10)    //true
        console.log('-----------------')
    </script>

1.4.1 判断一个数是4的倍数，且不是100的倍数

<script>
        // 1. 用户输入
        let num = +prompt('请输入一个数字：')
        // 2. 弹出结果
        alert(num % 4 === 0 && num % 100 !== 0)
    </script>

1.5 运算符优先级

  • 一元运算符里面的逻辑非优先级很高
  • 逻辑与比逻辑或优先级高

2、语句

2.1 表达式和语句

2.1.1区别

表达式：因为表达式可被求值，所以它可以写在赋值语句的右侧。

语句：而语句不一定有值，所以比如 alert() for和break 等语句就不能被用于赋值。

2.2 分支语句

2.2.1 If 分支语句

  • 单分支

  •         // 1. 用户输入
        let score = +prompt('请输入成绩')
        // 2. 进行判断输出
        if (score >= 700) {
            alert('恭喜考入黑马程序员')
        }
        console.log('-----------------')

  • 双分支

  • 判断用户登录案例：

     <script>
        // 1. 用户输入
        let uname = prompt('请输入用户名:')
        let pwd = prompt('请输入密码:')
        // 2. 判断输出
        if (uname === 'zt' && pwd === '123456') {
            alert('恭喜登录成功')
        } else {
            alert('用户名或者密码错误')
        }
    </script>

  • 判断闰年案例：

    <script>
        // 1. 用户输入
        let year = prompt('请输入年份:')
        // 2. 判断输出
        if (year % 4 === 0 && year % 100 !== 0 || year % 400 === 0) {
            alert(`${year}是闰年`)
        }
        else {
            alert(`${year}是平年`)
        }
    </script>

  • 多分支

  • 输入成绩案例：

     <script>
        // 1. 用户输入
        let score = +prompt('请输入成绩:')
        // 2. 判断输出
        if (score >= 90) {
            alert('成绩优秀')
        }
        else if (score >= 70) {
            alert('成绩良好')
        }
        else if (score >= 60) {
            alert('成绩及格')
        }
        else {
            alert('成绩不及格')
        }

2.2.2 三元运算符

其实是比 if 双分支 更简单的写法，可以使用 三元表达

 案例：判断2个数的最大值

<script>
        // 1. 用户输入
        let num1 = +prompt('请您输入第一个数:')
        let num2 = +prompt('请您输入第二个数:')
        // 2. 判断输出-三元运算符
        // if (num1 > num2) {
        //     alert(num1)
        // }
        // else {
        //     alert(num2)
        // }
        num1 > num2 ? alert(`最大值是${num1}`) : alert(`最大值是${num2}`)
    </script>

案例：数字补0

<script>
        // 1. 用户输入
        let num = prompt('请您输入一个数字：')
        // 2. 判断输出-小于10的才补0
        // num = num < 10 ? 0 + num : num
        num = num >= 10 ? num : 0 + num
        alert(num)
    </script>

2.2.3 switch 语句

 案例：简单计算器

 <script>
        // 1. 用户输入  2个数字 + 操作符号 + - * /
        let num1 = +prompt('请您输入第一个数字：')
        let num2 = +prompt('请您输入第二个数字：')
        let sp = prompt('请您输入 + - * / 其中一个：')
        // 2. 判断输出
        switch (sp) {
            case '+':
                alert(`两个数的加法操作是：${num1 + num2}`)
                break
            case '-':
                alert(`两个数的加法操作是：${num1 - num2}`)
                break
            case '*':
                alert(`两个数的加法操作是：${num1 * num2}`)
                break
            case '/':
                alert(`两个数的加法操作是：${num1 / num2}`)
                break
            default:
                alert(`你干啥嘞，请输入 + - * /`)
        }
    </script>

2.3 循环语句

2.3.1断点调试

1. 按F12打开开发者工具

2. 点到sources一栏

3. 选择代码文件

2.3.2 while循环

1. while循环基本语法：

2. while循环三要素：

（1）变量起始值

（2）终止条件

（3）变量变化量

// 1. 变量的起始值
        let end = +prompt('请输入次数:')
        let i = 1
        // 2. 终止条件
        while (i <= end) {
            document.write(`我要循环${end}次 <br>`)
            // 3. 变量的变化量
            i++
        }

 

案例：在页面打印输出10句“月薪过万”

let i = 1
        while (i <= 10) {
            document.write('月薪过万 <br>')
            i++
        }

while循环的练习： 

<script>
        // 1. 页面输出 1 ~ 100
        // let i = 1
        // while (i <= 100) {
        //     document.write(`这是第${i}个数 <br>`)
        //     i++
        // }

        // 2. 页面输出 1 ~ 100累加和
        // let i = 1
        // let sum = 0
        // while (i <= 100) {
        //     // sum = sum + i
        //     sum += i
        //     i++
        // }
        // console.log(sum);

        // 3. 页面输出 1 ~ 100 的偶数和
        let i = 1
        let sum = 0
        while (i <= 100) {
            // 筛选偶数
            if (i % 2 === 0) {
                sum = sum + i
            }
            // 每次循环都要自加
            i++
        }
        console.log(sum);
    </script>

3. 循环退出

continue和break的区别：

  • break：退出循环
  • continue：结束本次循环，继续下次循环
<script>
        // let i = 1
        // while (i <= 5) {
        //   console.log(i)
        //   if (i === 3) {
        //     break  // 退出循环
        //   }
        //   i++

        // }


        let i = 1
        while (i <= 5) {
            if (i === 3) {
                i++
                continue    //结束本次循环  继续下一个循环
            }
            console.log(i)
            i++

        }
    </script>

 案例：你爱我吗

 <script>
        while (true) {
            let str = prompt('你爱我吗')
            // 退出条件 爱
            if (str === '爱') {
                break
            }
        }
    </script>

3、综合案例——简易ATM取款机

<!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>
</head>

<body>
    <script>
        // 1. 开始循环  输入框写到 循环里面
        // 3. 准备一个总的金额
        let money = 1000
        while (true) {
            let re = +prompt(`
                请你选择操作：
                1.存钱
                2.取钱
                3.查看余额
                4.退出
                `)
            // 2. 如果用户输入 4 则退出循环， break
            if (re === 4) {
                break
            }
            // 4. 根据输入做操作
            switch (re) {
                case 1:
                    //存钱
                    let cun = +prompt('请输入存款金额：')
                    money = money + cun
                    break
                case 2:
                    //存钱
                    let qu = +prompt('请输入取款金额：')
                    money = money - qu
                    break
                case 3:
                    alert(`您的银行卡余额是${money}`)
                    break
            }
        }
    </script>
</body>

</html>
励志做一名码农_
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
判断一个数是否为4的倍数
ShenDW818的博客
05-31 4547
2的幂 如果一个数nnn是4的倍数（幂），那么，nnn一定也会是2的幂。所以，我们可以先判断nnn是否是2的幂，在此基础上再判断nnn是否为4的幂。 判断nnn是2的幂的方法见判断一个数是否为2的幂。常见的有两种： n&(n−1)==0 n\&(n-1) == 0n&(n−1)==0 和 n&(−n)==n n \& (-n) == nn&(−n)==n 二进制 如果nnn是4的倍数那么nnn的二进制表示有且只有一个1，并且这个1出现在从低位开始的第奇数个二进
javascript学习第二天（运算符的使用）.md
06-16
本内容主要讲述javascript中运算符的一些基本使用，以及在使用过程中遇到的一些问题，自己在学习过程的一些记录和心得体会。
JavaScript第二天
一位自学前端开发学者
02-23 318
while大括号里代码执行完毕后不会跳出，而是继续回到小括号里判断条件是否满足，若满足又执行大括号里的代码，然后再回到小括号判断条件, 直到括号内条件不满足,即跳出。其他赋值运算符: +=, -=, *=, /=, %=, let num = 10 ，循环的本质就是以某个变量为起始值, 然后不断产生变化量, 慢慢靠近终止条件的过程。同时使用多个运算符写程序时, 会按某种顺序先后执行, 称为优先级。分支语句包含: if分支语句, 三元运算符, switch语句。乘、除、取余优先级相同, 加、减优先级相同。
javaScript复习（day02）课后练习
weixin_62922379的博客
05-12 1263
1.判断一个数能被4整除，且不是100的整数。7.利用switch制作简单的计算器。8.使用while循环练习。9.综合案例-ATM取款机。6.利用三元运算补零案例。
在JavaScript中检查一个数字是否是另一个数字的倍数
最新发布
Min_nna的博客
11-17 1080
modulo% 操作符返回第一个数字在第二个数字上的余数，例如：10 % 2 = 0 ，所以如果我们得到一个余数0 ，那么给定的数字就是另一个数字的倍数，否则就不是倍数。因此，如果10除以2并返回余数0，那么它将打印出 "10是2的倍数 "的输出。为了检查一个数字是否是另一个数字的倍数，我们可以使用模运算符% ，但是第一个数字除以第二个数字的剩余部分不等于0。为了检查一个数字是否是另一个数字的倍数，我们可以使用JavaScript中的% modulo运算符。在上面的代码中，35被2除以，返回余数5。
判断一个数是不是4的倍数
weixin_30663471的博客
12-26 2698
var i=25;if(i!=0&&((i%6)==0)){out.print("是4的倍数");}else{out.print("不是4的倍数");} 转载于:https://www.cnblogs.com/zyl-8183/archive/2006/12/26/604263.html...
学习YUI.Ext 第二天
10-31
在JavaScript的世界里，YUI.Ext是一个强大的库，它基于Yahoo! User Interface Library (YUI)构建，提供了丰富的组件和布局管理功能，使得开发者能够轻松创建交互式的Web应用程序。今天我们将深入探讨JavaScript的...
jQuery学习笔记第二天的电梯导航案例代码
03-01
本篇将详细探讨jQuery学习笔记中第二天涉及的电梯导航案例，该案例旨在实现一个网页上的楼层跳转功能，通过点击楼层链接，页面会平滑滚动到相应的位置，提升用户体验。 首先，我们要理解电梯导航的基本原理。在网页...
JavaScript基础第01天笔记1
08-03
在学习JavaScript的基础时，我们首先需要理解它的基本概念。 1. **基本概念** JavaScript是一种解释型的、弱类型的、基于原型的编程语言。它不区分大小写，主要用来为HTML网页增加动态功能。1.1部分可能涉及变量的...
JavaScript基础第04天笔记1
08-03
例如，`arrStus[1]`将返回数组中的第二个元素（在JavaScript中是第三个位置）。 3. **遍历数组** - 常用的遍历方法是使用`for`循环。例如： ```javascript var arr = ['red', 'green', 'blue']; for (var i = 0...
javascript-:学习 JavaScript 30
08-05
**第二天：音乐节拍器** 这个项目涉及使用音频API，通过JavaScript创建一个可自定义节奏的音乐节拍器。你会学到如何处理音频缓冲区，以及如何利用JavaScript的定时功能来控制音频播放。 **第三天至第五天：拖放和...
十天JavaScript
02-19
第二天：函数和闭包 深入理解函数的高级特性，如函数参数、默认参数、剩余参数和箭头函数。还将学习闭包，它是JavaScript中的一个重要概念，它能保留函数内部的状态，并且可以用来创建私有变量。 第三天：对象和...
JavaScript基础第02天笔记1
08-03
短路运算体现在&&和||中，当第一个表达式可以决定结果时，就不会再计算第二个表达式。 5. **赋值运算符**：例如=、+=、-=、*=、/=等，它们用于将右边的值赋给左边的变量。例如，age += 5相当于age = age + 5。 6. ...
2_react_learning:第二天React学习
05-14
有关如何创建React投资组合的分步说明。该数字反映了提交所附带的数字。... 对于Npm $ npm i react-media $ npm i prop-types$ npm i classnames$ npm i react-router$ npm i react-router-dom纱线用$ yarn add react-...
JS-Day-2:Javascript 第 2 天
06-24
在第二天的学习中，我们将继续巩固基础，探索更高级的概念和技术。 首先，JavaScript的基础包括变量、数据类型、操作符和控制结构。变量是存储数据的容器，可以用来保存各种类型的数据，如字符串、数字、布尔值等。...
jquery点击倍数次数不同调用方法不同
tongyanyun521的专栏
10-30 605
$(document).ready(function(){   $(".btn1").toggle(function(){  alert("0000");   },function(){ alert("111") } ); });
JavaScript 02
weixin_62443949的博客
03-15 383
JS
js校验输入2000的整数倍
sugar_cookie的博客
05-27 869
维护了一个老项目，需要做一个金钱的校验，输入2000的整数倍金额，正则太恶心了，直接取整计算了，记录一下： //onblur事件 checkMoney = function (){ console.log('onblur'); //number const zdyMoney = $("#zdyMoney").val(); if( zdyMoney == "" || zdyMoney == undefined){ return false }
JS基础 day2 | 流程控制 运算符、语句（分支+循环）
csyldjy的博客
05-24 870
1 运算符 1.1 赋值运算符 目标： 能够使用赋值运算符简化代码 ◇赋值运算符：对变量进行赋值的运算符 已经学过的赋值运算符：= 将等号右边的值赋予给左边, 要求左边必须是一个容器 其他赋值运算符： += 【+= 出现是为了简化代码, 比如让 let num = 10 ，num 加5 → num += 5】 -= *= /= %= ◇使用这些运算符可以在对变量赋值时进行快速操作 1.2 一元运算符 目标： 能够使用一元运算符做自增运算 众多的 JavaS..
jQuery15天学习指南：简化JavaScript编程
**第二章：比window.onload更快的载入** 在JavaScript中，`window.onload`事件常用于确保所有页面资源加载完毕后执行某些代码。然而，jQuery提供了更高效的替代方案，比如`$(document).ready()`函数，它允许代码在...

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值