自学内容网 自学内容网
自学内容网 > 正文

黑马程序员-JavaScript-day02

🕗 发布于 2024-09-21 13:10 javascript  前端  开发语言  

01-赋值运算符

<!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>
  <script>
    let num = 1
    num += 2
    num += 3
    document.write(num)
  </script>
</body>

</html>

02-自增运算符

<!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>
  <script>
    let num = 1
    num++
    ++num
    document.write(num)
  </script>
</body>

</html>

03-比较运算符

<!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>
  <script>
    console.log(3 > 5)
    console.log(3 >= 3)
    console.log(2 == 2)
    console.log(2 == '2')
    console.log(2 === '2')
    console.log(NaN === NaN)
    console.log(2 !== '2')
    console.log(2 != '2')

    console.log('a' < 'b')
    console.log('aa' < 'ab')
    console.log('abc' < 'ab');

  </script>
</body>

</html>

04-逻辑运算符

<!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>
  <script>
    let num = +prompt('请输入一个数')
    document.write((num % 4 === 0) && (num % 100 !== 0))
    console.log('---------------------')
    console.log('逻辑与')
    console.log(false && true)
    console.log(3 < 5 && 3 > 2)
    console.log(3 < 5 && 3 < 2)
    console.log('逻辑或')
    console.log(true || true)
    console.log(false || true)
    console.log(false || false)
    console.log('逻辑非')
    console.log(!true)
    console.log(!false)
    console.log('---------------------')
    let num1 = 6
    console.log(num1 > 5 && num1 < 10)
  </script>
</body>

</html>

05-if单分支语句

<!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>
  <script>
    if (2 === '2') {
      console.log('执行语句1')
    }
    if (0) {
      console.log('执行语句2')
    }
    if ('111') {
      console.log('执行语句3')
    }
    if ('') {
      console.log('执行语句4')
    }

  </script>
</body>

</html>

06-双分支语句

<!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>
  <script>
    let name = prompt('请输入用户名')
    let pad = prompt('请输入密码')
    if (name === '123' && pad === '123') {
      alert('用户名和密码均正确')
    } else {
      alert('密码或用户名不正确')
    }
  </script>
</body>

</html>

07-闰年案例

<!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>
  <script>
    let num = +prompt('请输入年份：')
    if (num % 4 === 0 && num % 100 !== 0 || num % 400 == 0) {
      alert('今年是闰年')
    } else {
      alert('不是闰年')
    }
  </script>
</body>

</html>

08-if多分支语句

<!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>
  <script>
    let score = +prompt('请输入成绩')
    if (score >= 90) {
      alert('真优秀')
    } else if (score >= 70) {
      alert('良好')
    } else if (score >= 60) {
      alert('及格')
    } else {
      alert('不及格')
    }
  </script>
</body>

</html>

09-三元运算符

<!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>
  <script>
    let num1 = prompt('请输入第一个数')
    let num2 = prompt('请输入第二个数')
    alert(num1 > num2 ? num1 : num2)
  </script>
</body>

</html>

10-数字补0案例

<!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>
  <script>
    let num = prompt('请输入一个数字')
    alert(num < 10 ? 0 + num : num)
  </script>
</body>

</html>

11-switch分支语句

<!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>
  <script>
    let num = +prompt('请输入一个数字')
    switch (num) {
      case 1:
        alert('你选择的是语句1')
        break
      case 2:
        alert('你选择的是语句2')
        break
      case 3:
        alert('你选择的是语句3')
        break
      default:
        alert('没有匹配的选项')
    }
  </script>
</body>

</html>

12-简单计算器

<!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>
  <script>
    let num1 = +prompt('请输入第一个数字')
    let num2 = +prompt('请输入第二个数字')
    let temp = prompt('请输入运算符：')
    switch (temp) {
      case '+':
        alert(num1 + num2)
        break
      case '-':
        alert(num1 - num2)
        break
      case '*':
        alert(num1 * num2)
        break
      case '/':
        alert(num1 / num2)
        break
      default:
        alert('请输入合法运算！')
    }
  </script>
</body>

</html>

13-断点调试

<!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>
  <script>
    let num = 1
    num = num + 1
    alert(num)
  </script>
</body>

</html>

14-while循环

<!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>
  <script>
    let end = +prompt('要打印几次？')
    let i = 1
    let sum = 0
    let sum1 = 0
    while (i <= end) {
      document.write(i)
      document.write('我很好')
      sum += i
      if (i % 2 === 0) {
        sum1 += i
      }
      i++
    }
    document.write(`1-100的和是${sum}`)
    document.write(`1-100的偶数和是${sum1}`)

  </script>
</body>

</html>

15-退出循环-1

<!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>
  <script>
    let i = 0
    while (i < 5) {
      if (i === 3) {
        break
      }
      alert(`第${i}次打印`)
      i++
    }
    alert('循环结束')
  </script>
</body>

</html>

15-退出循环-2

<!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>
  <script>
    let i = 0
    while (i < 5) {
      if (i === 3) {
        i++
        continue
      }
      alert(`这是第${i}个`)
      i++
    }
  </script>
</body>

</html>

16-你爱我吗

<!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>
  <script>
    while (true) {
      let src = prompt('你爱我吗')
      if (src === '爱') {
        break
      }
    }
  </script>
</body>

</html>

17-综合案例-加减乘除

<!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>
  <script>
    while (true) {
      let src = prompt('请输入运算符')
      if (src === 'q') {
        break
      }
      let num1 = +prompt('第一个数字')
      let num2 = +prompt('第二个数字')
      switch (src) {
        case '+':
          alert(num1 + num2)
          break
        case '-':
          alert(num1 - num2)
          break
        case '*':
          alert(num1 * num2)
          break
        case '/':
          alert(num1 / num2)
          break
        default:
          alert('请重新输入')
          break
      }
    }
  </script>
</body>

</html>

17-综合案例-简易ATM

<!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>
  <script>
    let sum = 0
    let temp = 1
    while (temp) {
      let num = +prompt(`请输入您的选择：
        1.存钱
        2.取钱
        3.查看余额
        4.退出
      `)
      // 可以直接在switch外面判断num=4的情况
      switch (num) {
        case 1:
          let money1 = +prompt('您要存多少钱')
          sum += money1
          break
        case 2:
          let money2 = +prompt('您要取多少钱')
          if (money2 > sum) {
            alert('您没有这么多钱，请重新选择')
            break
          }
          sum -= money2
          break
        case 3:
          alert(`您的余额是${sum}元`)
          break
        case 4:
          temp = 0
          break
        default:
          alert('请重新选择')
          break
      }
    }
  </script>
</body>

</html>

原文地址：https://blog.csdn.net/qyk666/article/details/142414234

免责声明：本站文章内容转载自网络资源，如本站内容侵犯了原著者的合法权益，可联系本站删除。更多内容请关注自学内容网（zxcms.com）！

相关文章

  • 数据结构之存储位置

    内存泄漏：如果没有适时释放被动态分配的内存，会导致内存泄露问题。未释放的内存一直占用系统资源，使得系统变慢并最终导致崩溃。内存释放，合理设计算法，避免算法问题导致的内存无线增长，合理设置作用域。这个数

    阅读更多2024-09-22
  • gdb调试使用记录

    使用 GDB（GNU Debugger）进行问题排查是非常有效的。且可以通过core文件进行排查bug，core文件是程序异常崩溃的时候(段错误，非法指令等)，系统自动生成的core文件。用户可以通过

    阅读更多2024-09-22
  • Docker笔记-Docker Dockerfile

    Docker笔记-Docker Dockerfile

    阅读更多2024-09-22
  • Linux学习day02

    动态库恰好相反，在编译链接的时候并没有把库文件的代码加入到可执行文件中，而是程序执行的狮虎由运行时链接文件加载库，这样可以节省系统的开支。动态库的后缀一般都是.so，像前边所提到的libc.so.6就

    阅读更多2024-09-22
  • Docker镜像和容器

    通过以上步骤，你就成功在 Docker 中搭建了一个 Ubuntu 20.04 的环境，并在其中安装了gcc以及运行了uptime命令。这种方法对于快速测试和开发非常有效。当你在 Docker 容器中

    阅读更多2024-09-22
  • 基于java&ssm课程实验教学系统设计

    经过用户登录后，页面跳转至后台首页，main.php，首页是由2个页面组成的，包括top、left和center等页面，通过@ Register引入，这里也是浏览者操作系统功能的入口，系统首页主要介绍

    阅读更多2024-09-22
  • AI健身之俯卧撑计数和姿态矫正-角度估计

    AI健身之俯卧撑计数和姿态矫正-角度估计

    阅读更多2024-09-22
  • 漏洞复现_永恒之蓝

    永恒之蓝（EternalBlue）是一个影响Windows操作系统的远程代码执行漏洞，编号为CVE-2017-0144，最初由美国国家安全局（NSA）开发并利用，后来被黑客组织Shadow Broke

    阅读更多2024-09-22
  • #define定义

    我们直接上例子理解这个地方的宏类似于函数，但是又不同于函数（后面会解释）cal(a)就是 4*4=16没问题但是为啥cal(b)就等于23呢？#define无论是定义常量还是宏，都是预处理的时候直接替

    阅读更多2024-09-22
  • ArcGIS核密度分析（栅格处理范围与掩膜分析）

    ​很多时候我们在进行栅格分析的时候，处理的结果不能完全覆盖我们需要的范围。比如，我们对点数据进行密度分析、栅格插值等。比如下图​为什么会如此呢？那是因为在做这个密度分析或者栅格插值的时候，默认是以点的

    阅读更多2024-09-22
自学内容网
Copyright © 2015-2024