JavaScript初识2

目录

JS语言是解释型语言

一、运算符

1.赋值运算符

2.一元运算符

3.比较运算符

4.逻辑运算符

5.运算符优先级

二、语句

1.表达式和语句

2.分支语句

(1)If 语句

(2)三元表达式

(3)switch 语句

3.循环语句

(1)断点调试

(2)while循环

(3)for循环

(4)for循环嵌套

四、数组

遍历数组(重点)

操作数组(重要)

1 改

2 增(重点)

3 删

4 例-数组筛选

五、案例-数据生成柱状图(难)

六、冒泡排序

七、数组排序


JS语言是解释型语言

一、编译型语言(Java等语言)

优点:运行速度快,代码效率高,编译后的程序不可修改,保密性较好。

缺点:代码需要经过编译方可运行,可移植性差,只能在兼容的操作系统上运行 。

二、解释型语言(JavaScript、Python等)

优点:可移植性较好,只要有解释环境,可在不同的操作系统上运行。

缺点:运行需要解释环境,运行起来比编译的要慢,占用资源也要多一些,代码效率低,代码修改后就可运行,不需要编译过程


一、运算符

1.赋值运算符

对变量进行赋值的运算符, 左边必须是一个容器
赋值运算符:=  +=  -=  *=  /=  %=
let num = 1num += 1

2.一元运算符

使用一元运算符做自增运算
可以根据所需表达式的个数分为:一元运算符、二元运算符、三元运算符
自增:++
自减:--
使用场景: 经常用于 计数 来使用。 比如进行10次操作,用它来计算进行了多少次了
前置自增:++num
后置自增:num++
前置自增和后置自增单独使用没有区别
但是,如果参与运算就有了区别   后面 i++ 后置自增会使用相对较多,并且都是单独使用
    //前置自增和后置自增 在运算时有区别let i = 1// console.log(i++ + 2);  //4  i=1 i++ i+1=2  2+2=4console.log(++i + 2);   //3  i=1 i+2=1+2=3 i++  i=i+1=2

后置++  : 不用管++,直接用i初始值带入计算 ,计算完再进行i+=1

let a = 1console.log(a++ + ++a + a);//1+3+3=7   a++后置自增成a=2但是运算时a=1  ++a前置自增变成a=2+1=3 剩下的a现在已经是3了

3.比较运算符

1. = 和 == 和 === 怎么区别?
= 是赋值
== 是判断 只要求值相等,不要求数据类型一样即可返回true
=== 是全等 要求值和数据类型都一样返回的才是true
开发中,请使用 ===
2. 比较运算符返回的结果是什么?
结果只有2个, true 或者 false
注意:
NaN不等于任何值,包括它本身 (NaN  不等于 NaN) 涉及到"NaN“ 都是false
尽量不要比较小数,因为小数有精度问题
不同类型之间比较会发生隐式转换(所以开发中,如果进行准确的比较我们 更喜欢 === 或者 !==)
字符串比较,是比较的字符对应的ASCII码
Ø 从左往右依次比较
Ø 如果第一位一样再比较第二位,以此类推
Ø 比较的少,了解即可

4.逻辑运算符

使用场景: 逻辑运算符用来解决多重条件判断
正确写法:num>5 && num<10
错误写法:5<num<10

5.运算符优先级

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

二、语句

1.表达式和语句

表达式举例: num = 3 + 4

语句举例: alert() 弹出对话框 console.log() 控制台打印输出

表达式: 因为表达式可被求值,所以它可以写在赋值语句的右侧
语句: 而语句不一定有值,所以比如 alert() for和break 等语句就不能被用于赋值。
某些情况,也可以把表达式理解为表达式语句,因为它是在计算结果,但不是必须的成分 (例如continue语句 )

2.分支语句

程序三大流程控制语句:顺序结构、分支结构、循环结构
分支语句可以让我们有 选择性 的执行想要的代码,包括:IF分支语句、三元运算符、Switch语句

(1)If 语句

分为:单分支、双分支、多分支
 // 单分支语句if (true) {console.log('执行语句')}//有输出‘执行语句’if (false) {console.log('执行语句')}//没有输出‘执行语句’

注意:除了空字符串,所有字符串为真;除了0,所有数字为真

(2)三元表达式

比 if 双分支 更简单的写法,可以使用 三元表达式
符号:? 与 : 配合使用       
let num = 3 < 5 ? 3 : 5console.log(num);

  一般用来取值

(3)switch 语句

释义:
Ø 找到跟小括号里数据 全等 的case值,并执行里面对应的代码
Ø 若没有全等 === 的则执行default里的代码
Ø 例:数据若跟值2全等,则执行代码2
注意:
1. switch case语句一般用于等值判断,不适合于区间判断
2. switch case一般需要配合break关键字使用 没有break会造成case穿透

3.循环语句

(1)断点调试

作用 学习时可以帮助更好的理解代码运行,工作时可以更快找到bug
浏览器打开调试界面
1. 按F12打开开发者工具
2. 点到sources一栏
3. 选择代码文件
断点:在某句代码上加的标记就叫断点,当程序执行到这句有标记的代码时会暂停下来

(2)while循环

while : 在…. 期间, 所以 while循环 就是在满足条件期间,重复执行某些代码

while大括号里代码执行完毕后不会跳出,而是继续回到小括号里判断条件是否满足,若满足又执行大括号里的代码,然后再回到小括号判断条件,直到括号内条件不满足,即跳出

(是以某个变量为起始值,然后不断产生变化量,慢慢靠近终止条件的过程。)

while循环需要具备三要素 :()
1. 变量起始值
2. 终止条件(没有终止条件,循环会一直执行,造成死循环)
3. 变量变化量(用自增或者自减)
循环结束:
Ø break:退出循环
Ø continue:结束本次循环,继续下次循环
区别:
Ø continue 退出本次循环 一般用于排除或者跳过某一个选项的时候, 可以使用continue
Ø break 退出整个循环 一般用于结果已经得到, 后续的循环不需要的时候可以使用

(3)for循环

  let sum = 0for (let i = 1; i <= 100; i++) {if (i % 2 === 0) {sum += i}}document.write(`1-100之间偶数和为${sum}`)

(4)for循环嵌套

案例:九九乘法表


四、数组

数组:(Array)是一种可以按顺序保存数据的 数据类型

遍历数组(重点)

 let arr = ['刘德华', '青湖原', '莫山', '周处', '风风']// 遍历for (let i = 0; i < arr.length; i++) {console.log(arr[i]);}

操作数组(重要)

数组本质是数据集合, 操作数据无非就是 增 删 改 查 语法:

1 改

 // 修改let arr1 = ['add', 'dff', 'fff']arr1[0] = 'uuu'console.log(arr1);//['uuu', 'dff', 'fff']

2 增(重点)

push() 方法将指定的元素添加到数组的末尾,并返回新的数组长度。

    // push 末尾let arr = ['pink', 'hotpink']arr.push('deeppink')console.log(arr);//['pink', 'hotpink', 'deeppink']// unshift  前面let arr = ['pink', 'hotpink']arr.unshift('red')console.log(arr);//[['red', 'pink', 'hotpink']

3 删

数组. pop() 方法从数组中删除最后一个元素,并返回该元素的值   
数组. shift() 方法从数组中删除第一个元素,并返回该元素的值
数组. splice() 方法 删除指定元素

4 例-数组筛选

  let arr = [2, 4, 5, 833, 67, 90]// 1.声明新的空的数组let newArr = []// 2.遍历旧数组for (let i = 0; i < arr.length; i++) {// 3.满足条件 追加给新的数组if (arr[i] >= 10) {newArr.push(arr[i])}}// 4.输出新的数组console.log(newArr);

五、案例-数据生成柱状图(难)


六、冒泡排序

冒泡排序是一种简单的排序算法
它重复地走访过要排序的数列,一次比较两个元素,如果他们的顺序错误就把他们交换过来。走访数列的工作是重 复地进行直到没有再需要交换,也就是说该数列已经排序完成。
这个算法的名字由来是因为越小的元素会经由交换慢慢“浮”到数列的顶端。
比如数组 [2,3,1,4,5] 经过排序成为了 [1,2,3,4,5] 或者 [5,4,3,2,1]

七、数组排序

数组. sort() 方法可以排序
let arr = [4, 2, 5, 1, 3]
// 1.升序排列写法
arr.sort(function (a, b) {
return a - b
})
console.log(arr) // [1, 2, 3, 4, 5]
// 降序排列写法
arr.sort(function (a, b) {
return b - a
})
console.log(arr) // [5, 4, 3, 2, 1]

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/330563.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

项目十二:简单的python基础爬虫训练

许久未见&#xff0c;甚是想念&#xff0c;今日好运&#xff0c;为你带好运。ok&#xff0c;废话不多说&#xff0c;希望这门案例能带你直接快速了解并运用。&#x1f381;&#x1f496; 基础流程 第一步&#xff1a;安装需要用到的requests库&#xff0c;命令如下 pip inst…

c++ vector实现出现的一些问题

目录 前言&#xff1a; 浅拷贝问题: typename指定类型&#xff1a; 前言&#xff1a; 最近学习了c vector的使用&#xff0c;然后也自己实现了一下vector的部分重要的功能。然后在其中出现了一些问题&#xff0c;在这就主要记录一下我解决哪些bug。 浅拷贝问题: 在实现res…

IDEA中一些常见操作【持续更新】

文章目录 前言善用debugidea中debug按钮不显示自动定位文件【始终选择打开的文件】idea注释不顶格【不在行首】快速定位类的位置【找文件非常快】创建文件添加作者及时间信息快速跳转到文件顶端 底端 前言 因为这些操作偶尔操作一次&#xff0c;不用刻意记忆&#xff0c;有个印…

C++:关联容器及综合运用:

关联容器和顺序容器有着根本的不同:关联容器中的元素是按关键字来保存和访问的,而顺序容器中的元素是按它们在容器中的位置来顺序保存和访问的。关联容器因此相比与顺序容器支持高效的关键字查找和访问。 其底层数据结构&#xff1a;顺序关联容器 ->红黑树&#xff0c;插入…

炫酷gdb

在VS里面调试很方便对吧&#xff1f;&#xff08;F5直接调试&#xff0c;F10逐过程调试--不进函数&#xff0c;F11逐语句调试--进函数&#xff0c;F9创建断点&#xff09;&#xff0c;那在Linux中怎么调试呢&#xff1f; 我们需要用到一个工具&#xff1a;gdb 我们知道VS中程…

可转债日内自动T+0交易,行情推送+策略触发+交易接口

说明 目前这个项目已编译打包,下载即可测试,直接生成多平台可执行文件&#xff0c;详见运行方法。行情部分与策略弱相关&#xff0c;拆分解耦单独作为一个项目。行情项目请移步GitHub - freevolunteer/hangqing: A股行情订阅工具&#xff0c;支持股票/可转债level2/level2数据&…

【系统架构师】-案例篇(十五)SOA、微服务与数据库

1、可复用构件应具备哪些属性 可用性&#xff1a;构件必须易于理解和使用。 质量&#xff1a;构件及其变形必须能正确工作。 适应性&#xff1a;构件应该易于通过参数化等方式在不同语境中进行配置。 可移植性&#xff1a;构件应能在不同的硬件运行平台和软件环境中工作。 可变…

设计模式14——组合模式

写文章的初心主要是用来帮助自己快速的回忆这个模式该怎么用&#xff0c;主要是下面的UML图可以起到大作用&#xff0c;在你学习过一遍以后可能会遗忘&#xff0c;忘记了不要紧&#xff0c;只要看一眼UML图就能想起来了。同时也请大家多多指教。 组合模式&#xff08;Composit…

废物回收机构|基于SprinBoot+vue的地方废物回收机构管理系统(源码+数据库+文档)

地方废物回收机构管理系统 目录 基于SprinBootvue的地方废物回收机构管理系统 一、前言 二、系统设计 三、系统功能设计 1管理员功能模块 2 员工功能模块 四、数据库设计 五、核心代码 六、论文参考 七、最新计算机毕设选题推荐 八、源码获取&#xff1a; 博主介绍…

【minio】minio文件访问不到问题记录

问题描述&#xff1a; 项目上上传了logo&#xff0c;但是无法回写logo&#xff0c;但是文件minio路径已经返回&#xff0c;并且到minio服务器上也能下载文件&#xff1b; 解决方案&#xff1a; 1.排查Nginx的代理的minio是否正确 2.登录minio服务查一下文件路径policy是否设置访…

在某云服务器上搭建公网kali linux2.0

前提&#xff1a; 可用的 CVM 实例 挂载一个系统盘之外的盘&#xff0c;安装完成后可卸载&#xff01; 创建实例&#xff0c;安装centos7系统&#xff01; 然后执行fdisk -l看磁盘的情况 在这里我将把镜像写入vdb这块数据盘 非 root 的情况下记得sudo执行以下命令 注意&…

机器学习之常用算法与数据处理

一、机器学习概念&#xff1a; 机器学习是一门多领域交叉学科&#xff0c;涉及概率论、统计学、计算机科学等多门学科。它的核心概念是通过算法让计算机从数据中学习&#xff0c;改善自身性能。机器学习专门研究计算机怎样模拟或实现人类的学习行为&#xff0c;以获取新的知识…

jmeter保存测试计划报错——Couldn‘t save test plan to file:

jmeter保存测试计划报错——Couldnt save test plan to file:。。。。。拒绝访问 一、问题描述二、分析三、结果 一、问题描述 Couldn’t save test plan to file:D:\Program Files\apache-jmeter-5.6.2\bin\线程组.jmx D:\Program Files\apache-jmeter-5.6.2\bin\线程组.jmx(…

用WPS将多张图片生成一个pdf文档,注意参数设置

目录 1 新建一个docx格式的文档 2 向文档中插入图片 3 设置页边距 4 设置图片大小 5 导出为pdf格式 需要把十几张图片合并为一个pdf文件&#xff0c;本以为很简单&#xff0c;迅速从网上找到两个号称免费的在线工具&#xff0c;结果浪费了好几分钟时间&#xff0c;发现需要…

【汽车操作系统】Autosar和商用OS

目录 什么是AUTOSAR? CP AUTOSAR架构 CAN通信 AP AUTOSAR 背景 CP&AP 开发方面的不同&#xff1a; WRLinux介绍 QNX介绍 什么是AUTOSAR? 随着汽车功能越来越多&#xff0c;导致ECU的数量越来越多。1993年的时候&#xff0c;奥迪A8才只有5个ECU现在典型的现代汽车…

shell文本三剑客——awk命令【☆】

目录 一、akw原理 二、命令格式 三、常用变量 四、awk的用法 1.输出整行内容 2.按字段输出文本内容 3.按列输出文件内容 FS变量为列分隔符 4.awk的三个模式 5. awk ‘控制语句条件 {操作}’ 文件 6.awk的数组 7.awk的应用 一、akw原理 逐行读取文本&#xff0c;默认…

TypeScript-泛型

泛型(Generics) 指在定义接口&#xff0c;函数等类型的时候&#xff0c;不预先指定具体的类型&#xff0c;而在使用的时候再指定类型的一种特性&#xff0c;使用泛型可以复用类型并且让类型更加灵活 泛型接口-interface 语法&#xff1a;在 interface 接口类型的名称后面使用…

《基于Jmeter的性能测试框架搭建》改进一

《基于Jmeter的性能测试框架搭建》文末笔者提到了不少待改进之处&#xff0c;如下所示。 Grafana性能图表实时展现&#xff0c;测试过程中需实时截图形成测试报告&#xff0c;不够人性化。解决方案&#xff1a;自动生成测试报告并邮件通知。 Grafana性能图表需测试人员实时监控…

加入MongoDB AI创新者计划,携手MongoDB共同开创AI新纪元

加入MongoDB AI创新者计划&#xff01; MongoDB对AI创新和初创企业的支持既全面又广泛&#xff01;无论您是领先的AI初创企业还是刚刚起步&#xff0c;MongoDB Atlas都是支持您愿景的最佳平台。 AI 初创者计划The AI Startup Track AI初创者计划为早期初创企业提供专属福利&…

云端漫步:搭建个人博客的移动云之旅

&#x1f482;作者简介&#xff1a; Thunder Wang&#xff0c;阿里云社区专家博主&#xff0c;华为云云享专家&#xff0c;腾讯云社区认证作者&#xff0c;CSDN SAP应用技术领域优质创作者。在学习工作中&#xff0c;我通常使用偏后端的开发语言ABAP&#xff0c;SQL进行任务的完…