javaScript学习笔记4

最新推荐文章于 2024-07-21 22:27:18 发布
最新推荐文章于 2024-07-21 22:27:18 发布
阅读量57 收藏
点赞数 1
分类专栏： JS 文章标签： java 开发语言
原文链接：https://www.bilibili.com/video/BV1Sy4y1C7ha?p=96&spm_id_from=333.851.header_right.history_list.click&vd_source=720efe45336d5eabd781d1ed31bafef8
版权

  • 断点调试

    • 断点调试可以观察运行过程

  • 双重for循环

    • 语法结构：for（外层的初始化变量；外层的条件表达式；外层的操作表达式）{for（内层的初始化变量；内层的条件表达式；内层的操作表达式）{执行语句}}

    • 外层循环执行一次，内层循环执行全部

    • 外层循环决定行，内层循环决定列。

    • 代码

      <!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>
    <script>
        for (var i = 1; i <= 3; i++) {
            console.log('这是外层循环的第' + i + '次');
            for (var j = 1; j <= 3; j++)
                console.log('这是内层循环的第' + j + '次');
        }
    </script>
</head>

<body>

</body>

</html>

    • 结果

    • 案例

      <!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>
    <script>
        var str = '';
        for (var i = 1; i <= 5; i++) {
            for (var j = 1; j <= 5; j++) {
                str = str + '★';
            }
            str = str + '\n';
        }
        console.log(str);
    </script>
</head>

<body>

</body>

</html>

       

    • 结果

    • 案例

      <!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>
    <script>
        var str = '';
        for (var i = 1; i <= 10; i++) {//外层控制行数
            for (j = i; j <= 10; j++) {//使j=i实现倒三角
                str = str + '★';
            }
            str = str + '\n';
        }
        console.log(str);
    </script>
</head>

<body>

</body>

</html>

       

    • 结果

       

    • 案例

      <!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>
    <script>
        var str = '';
        for (var i = 1; i <= 9; i++) {//九行
            for (var j = 1; j <= i; j++) {//决定第几行就有几列
                str = str + j + 'x' + i + '=' + i * j + ' ';//1 x 2 =2   九九乘法表先列后行先j后i  
            }
            str += '\n';
        }
        console.log(str);
    </script>
</head>

<body>

</body>

</html>

    • 结果

       

  • while循环

    • 语法结构：while（条件表达式）{循环体}

    • 代码

      <!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>
    <script>
        var num = 1;
        while (num <= 100) {
            console.log('你好！');
            num++;
        }
    </script>
</head>

<body>

</body>

</html>

    • 结果

       

    • 案例

      <!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>
    <script>
        //1.打印人的一生，从1岁到100岁
        var i = 1;
        while (i <= 100) {
            console.log('这个人今年' + i + '岁啦');
            i++;
        }
        //2.计算1~100之间所有整数的和
        var j = 1;
        var sum = 0;
        while (j <= 100) {
            sum += j;
            j++;
        } console.log(sum);
        //3.弹出一个提示框，
        var massage = prompt('你爱我吗？');
        while (massage !== '我爱你') {
            massage = prompt('你爱我吗？');
        }
        alert('我也爱你！');
    </script>
</head>

<body>

</body>

</html>

    • 结果

       

  • do while循环

    • 语法结构：do{ 循环体 }while（条件表达式）

    • 执行过程：跟while不同的不同的地方在于，do while先执行一次循环体，再判断条件。如果条件表达式为真则继续执行循环体，否则退出循环。

    • do while至少执行一次循环代码

    • 代码

      <!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>
    <script>
        var i = 1;
        do {
            console.log('您好');
            i++;
        } while (i <= 100)
    </script>
</head>

<body>

</body>

</html>

    • 结果

       

    • 案例

      <!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>
    <script>
        //1.打印人的一生，从1岁到100岁
        var i = 1;
        do {
            console.log('这个人今年' + i + '岁了');
            i++;
        } while (i <= 100)

        //2.计算1~100之间的所有整数的和
        var sum = 0;
        var j = 1;
        do {
            sum += j;
            j++;
        } while (j <= 100);
        console.log(sum);
        //3.弹出一个提示框输入密码
        do {
            var massage = prompt('请输入密码');

        } while (massage !== '123456')
        alert('密码正确');
    </script>
</head>

<body>

</body>

</html>

    • 结果

       

  • for、while、do while之间的区别

    • 用来计数使用for

    • while和do while循环可以使用更加复杂的判断语句。

  • continue 、break用法

    • continue关键字用于跳出本次循环，继续下一次循环（执行代码少一次）

    • break用于跳出整个循环（循环立马结束）

    • 代码

      <!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>
    <script>
        for (var i = 1; i <= 5; i++) {
            if (i == 3) {
                continue;//退出i==3的循环，其他循环继续执行
            }
            console.log('我是第' + i + '个数');
        }
        //求1~100之间，除了能被7整除之外的整数和
        var sum = 0;
        for (var i = 1; i <= 100; i++) {
            if (i % 7 == 0) {
                continue;//跳出1~100中可以被7整除的数
            }
            sum += i;
        }
        console.log(sum);
    </script>
</head>

<body>

</body>

</html>

    • 结果

    • 案例

      <!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>
    <script>
        for (var i = 1; i <= 5; i++) {
            if (i == 3) {
                break;//在第三个数的时候退出整个循环
            }
            console.log('我是第' + i + '个数');
        }
    </script>
</head>

<body>

</body>

</html>

       

    • 结果

       

JavaScript基础语法-dom-bom-js-es6新语法-jQuery-数据可视化echarts

正在加载jjj
关注
  • 1
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
javascript学习笔记
11-24
学习JavaScript时，了解这些基础知识是至关重要的。随着深入学习，你将接触到更高级的概念，如闭包、异步编程（回调函数、Promise、async/await）、模块系统以及现代框架如React、Vue和Angular的使用。JavaScript的...
Javascript学习笔记4 Eval函数
12-11
eval的作用其实很简单，就是把一段字符串传递给JS解释器，由Javascript解释器将这段字符串解释成Javascript代码，并且执行他。 举个最简单的例子： 代码如下: [removed] eval(“alert(1+1)”); [removed] 很...
尚硅谷JavaScript高级学习笔记
javaThinker的专栏
03-08 982
JavaScript中函数是对象。我们后续描述构造函数的内存模型时，会将构造函数称为构造函数对象。typeof 运算符来查看值的类型，它返回的是类型的字符串值 会做数据转换 输出： 每个函数都有一个prototype属性，它默认指向一个0bject空对象(即称为:原型对象) 给原型对象添加属性、方法，函数的所有实例对象自动拥有原型中的属性(方法) 16、显式原型和隐式原型 和 中保存的都是原型对象的地址值。Fun的prototype、f的__proto__属性什么时
Javascript入门学习笔记
weixin_61370021的博客
04-27 4602
JS入门学习笔记，JavaScript是目前web开发中不可缺少的脚本语言，js不需要编译即可运行，运行在客户端，需要通过浏览器来解析执行JavaScript代码。
JavaScript学习笔记
qq_53388077的博客
03-30 1531
JavaScript是一门跨平台、面向对象的脚本语言，是用来控制网页行为的。脚本语言通常直接解释执行，不需要编译，缩短了传统编程语言的运行过程/*定义格式：var 对象名={属性名1：属性值1，属性名2：属性值2，属性名3：属性值3，函数名称：function(形参列表){}*/var user={age:20,alert("用膳");//简化方法：eat(){alert("用膳");
javaScript学习笔记（一）js基础
热门推荐
一叶知秋
09-21 13万+
================================= 公众号 关注一波 （一叶知秋博客） 不定期分享视频资料 一、简介 1、概述： JavaScript是目前web开发中不可缺少的脚本语言，js不需要编译即可运行，运行在客户端，需要通过浏览器来解析执行JavaScript代码。 诞生于1995年，当时的主要目的是验证表单的数据是否合法。 Java...
学习笔记2 JavaScript
qwe121381122的博客
01-08 392
JavaScript学习笔记4-变量类型
Anthony_tester的博客
04-26 1314
从前一篇文章我们了解了变量的声明和在打印语句中使用，这里我们看看变量有哪些类型。 <! DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> // 整形变量 var ag
JavaScript 学习笔记 超详细（b站pink老师）
weixin_59531237的博客
05-10 5883
1. JavaScript （是什么？是一种运行在客户端（浏览器）的编程语言，实现人机交互效果。2. 作用（做什么？– 网页特效 (监听用户的一些行为让网页作出对应的反馈)– 表单验证 (针对表单数据的合法性进行判断)– 数据交互 (获取后台的数据, 渲染到前端)– 服务端编程 (node.js)3. JavaScript的组成（有什么？
JavaScript新手入门学习笔记
qq_43389754的博客
12-04 4万+
JavaScript介绍 1.1 前端三要素 HTML 超文本标记语言 决定了网页中的视图内容 CSS 层叠样式表 决定了网页中的视图效果 JavaScript 赋予网页动态功能 1.2 JavaScript简介 JavaScript是一种基于对象的事件驱动型、弱类型的脚本语言 基于对象：区别于Java中的面向对象，遵循对象.方法的规则，但是没有类的概念 事件驱动：脚本语言代码需要由网页中的事件来触发执行 脚本语言：JS作为寄生语言，写在HTML网页中 JavaScript在1995年
JavaScript学习笔记（持续更新）
m0_46527956的博客
04-17 739
JavaScript学习笔记（持续更新）JavaScript1. 什么是JavaScript1.1 概述2. 快速入门2.1 引入JavaScript2.2 基本语法2.2.1 定义变量2.2.2 条件控制2.3 数据类型2.3.1 number2.3.2 字符串2.3.3 布尔值2.3.4 null和undefiend2.3.5 数组2.3.6 对象2.3.7 严格检查格式的使用2.3.8 字符串 JavaScript 1. 什么是JavaScript 1.1 概述 ECMAScript可以理解为是Jav
javascript 学习笔记
Katios
05-25 7231
注释“//”表示单行注释 “/* */”可以用来多行注释变量1.变量必须使用字母、下划线(_)或者美元符($)开始。2.然后可以使用任意多个英文字母、数字、下划线(_)或者美元符($)组成。3.不能使用JavaScript关键词与JavaScript保留字4.变量区分大小写 javascript作为一种脚本语言可以放在html页面中任何位置，但是浏览器解释html时是按先后顺序的，所以前
Ruffy javascript 学习笔记
10-29
Ruffy javascript 学习笔记
JavaScript 学习笔记（十一）
10-29
继续学习的是document对象。
Java-Lambda
最新发布
lizhiwei21的博客
07-21 174
lambda表达式可以理解为对匿名内部类的一种简化 , 但是本质是有区别的面向对象思想 :强调的是用对象去完成某些功能函数式编程思想 :强调的是结果 , 而不是怎么去做。
Promise 详解（原理篇）
山重水复疑无路，柳暗花明又一村。
07-20 496
Promise 是一种异步编程的解决方案。在异步操作中，callback 会导致回调地狱的问题，Promise 解决了这个问题。一个 Promise对象有以下三种状态:pending：初始状态，既不是成功，也不是失败状态。：意味着操作成功完成。rejected：意味着操作失败。当 new Promise() 被实例化后，即表示 Promise 进入 pending 初始化状态，准备就绪，等待运行。
接口防刷！利用redisson快速实现自定义限流注解
架构师小吴的博客
07-18 1174
如登录接口，当用户使用手机号+验证码登录时，一般我们会生成6位数的随机验证码，并将验证码有效期设置为1-3分钟，如果对登录接口不加以限制，理论上，通过技术手段，快速重试100000次，即可将验证码穷举出来。解决思路：对登录接口加上限流操作，如限制一分钟内最多登录5次，登录次数过多，就返回失败提示，或者将账号锁定一段时间。在日常开发中，一些重要的对外接口，需要加上访问频率限制，以免造成资��损失。ok，通过以上两步，即可完成我们的限流注解了，下面通过一个接口验证下效果。
JVM-垃圾回收与内存分配
m0_50846237的博客
07-19 1151
JVM-垃圾回收与内存分配
JavaScript学习笔记：元素交互与基本语法详解
本篇笔记记录了作者在学习JavaScript过程中的关键知识点，主要包括以下几个方面： 1. HTML中使用JavaScript: - 使用`<script>`元素插入脚本，这是在HTML文档中嵌入JavaScript的基本方式。 - 子页面与父页面之间的...

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值