【零基础】学JS

喝下这碗鸡汤

“知识就是力量。” - 弗朗西斯·培根

1.三元运算符

目标:能利用三元运算符执行满足条件的语句

使用场景:其实是比if双分支更简单的写法,可以使用三元表达式

语法:条件 ? 满足条件的执行代码 : 不满足条件执行的代码

接下来用一个小案例来展示三元运算符

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

2.断点调试

2.1为什么要进行断点调试?

学习可以使用帮助更好的理解代码运行,工作时可以更快找到BUG

2.2如何使用断点调试?

1.按F12打开开发者工具

2.点sources一栏

3.选择代码文件

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

在console.log(num)打一个断点,刷新页面  num就会变成18啦 如果num加1,所以程序正确。

3.简易ATM取款机案例

需求:用户可以实现存钱,取钱,查看余额和退出功能

分析:

1.循环的时候,需要反复提示输入框,所以提示框写到循环里面

2.退出的条件是用户输入了4,如果是4,循环结束,不再弹窗

3.提前准备一个金额先存储一个金额

4.取钱则是减法操作,存钱则是加法操作,查看余额则是直接显示金额

5.输入不同的值,可以使用switch来执行不同的操作

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

4.为什么需要函数?

函数:
function,是被设计为执行特定任务的代码块
函数可以把具有相同或相似逻辑的代码“包裹”起来,通过函数调用执行这些被“包裹”的代码逻辑,这么做的优势是有利于精简代码方便复用
比如我们前面使用的 alert()、prompt()和 console.log() 都是一些is 函数,只不过已经封装好了,我们直接使用的。

5.函数的使用

函数的语法声明:

function 函数名() {函数体
}

函数名命名规范


1.和变量命名基本一致尽量小驼峰式命名法
2.前缀应该为动词
3.命名建议:常用动词约定

接下来我们来写两个小案例吧~

需求:
1.封装一个函数,计算两个数的和

 function getSum() {let num1 = +prompt('请输入第一个数字:')let num2 = +prompt('请输入第二个数字:')console.log(num1 + num2)}getSum()

2.封装一个函数,计算1-100之间所有数的和

 <script>function getSum() {let sum = 0for (let i = 1; i <= 100; i++) {sum += i}console.log(sum)}getSum()</script>

6.函数传参

形参:声明函数时写在函数名右边小括号里的叫形参(形式上的参数)
实参:调用函数时写在函数名右边小括号里的叫实参(实际上的参数)
形参可以理解为是在这个函数内声明的变量(比如 num1=10)实参可以理解为是给这个变量赋值

7.函数的返回值

为什么需要返回值的?其实我们可以理解为当我用洗衣机洗衣服的时候,洗完衣服(函数执行完毕),我们需要拿衣服(也就是返回值),也可以理解为当我们买东西的时候,我们不希望买一件就显示多少钱,我们希望到了结算的时候才告诉我们多少钱,也就是说我们希望做到随时可以使用返回值。

细节: 

在函数体中使用 return 关键字能将内部的执行结果交给函数外部使用
return 后面代码不会再被执行,会立即结束当前函数,所以return 后面的数据不要换行写return函数可以没有 return,这种情况函数默认返回值为 undefined

  <script>function fun() {return 20}//相当于执行 fun() 调用者 fun() = 20//console.log(fn())let re = fun()console.log(re)</script>

8.作用域

通常来说,一段程序代码中所用到的名字并不总是有效和可用的,而限定这个名字的可用性的代码范围就是这个名字的作用域。

作用域的使用提高了程序逻辑的局部性,增强了程序的可靠性,减少了名字冲突

全局作用域

全局有效
作用于所有代码执行的环境(整个 script 标签内部)或者一个独立的 js 文件


局部作用域
局部有效
作用于函数内的代码环境,就是局部作用域。因为跟函数有关系,所以也称为函数作用域。

9.匿名函数

9.1函数表达式

函数表达式和具名函数的区别是,函数表达式的调用需要先声明,再调用,具名函数可以任意位置调用。

9.2立即执行函数

10.逻辑中断

总结

学完这部分的知识点之后,大家对js的基础知识已经有一定的了解了,JS的基础知识还剩下最后一篇,学完接下来就可以学习JS的API相关知识啦!开头的鸡汤你喝了吗?喝完继续肝!

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

如若内容造成侵权/违法违规/事实不符,请联系一条长河网进行投诉反馈,一经查实,立即删除!

相关文章

【瑞数补环境实战】某网站Cookie补环境与后缀分析还原

文章目录 1. 写在前面2. 特征分析3. 接口分析3. 补JS环境4. 补后缀参数 【&#x1f3e0;作者主页】&#xff1a;吴秋霖 【&#x1f4bc;作者介绍】&#xff1a;擅长爬虫与JS加密逆向分析&#xff01;Python领域优质创作者、CSDN博客专家、阿里云博客专家、华为云享专家。一路走…

ubuntu22.04+pytorch2.3安装PyG图神经网络库

ubuntu下安装torch-geometric库&#xff0c;图神经网络 开发环境 ubuntu22.04 conda 24.5.0 python 3.9 pytorch 2.0.1 cuda 11.8 pyg的安装网上教程流传着许多安装方式&#xff0c;这些安装方式主要是&#xff1a;预先安装好pyg的依赖库&#xff0c;这些依赖库需要对应上pyth…

代码随想录 数组部分+代码可在本地编译器运行

代码随想录 数组部分&#xff0c;代码可在本地编译器运行 文章目录 数组理论基础704.二分查找题目&#xff1a;思路二分法第一种写法二分法第二种写法 代码 27.移除元素题目&#xff1a;思路-双指针法代码 977.有序数组的平方题目思路-双指针代码 209.长度最小的子数组题目&am…

Lua语言入门

目录 Lua语言1 搭建Lua开发环境1.1 安装Lua解释器WindowsLinux 1.2 IntelliJ安装Lua插件在线安装本地安装 2 Lua语法2.1 数据类型2.2 变量全局变量局部变量命名规范局部变量作用域 2.3 注释单行注释多行注释 2.4 赋值2.5 操作符数学操作符比较操作符逻辑操作符连接操作符取长度…

安卓虚拟位置修改1.25beta支持路线模拟、直接定位修改

导语:更新支持安卓14/15&#xff0c;支持路线模拟、直接定位修改&#xff0c;仅支持单一版本 无root需根据教程搭配下方链接所提供的虚拟机便可进行使用 有root且具备XP环境可直接真机运行 如你有特殊需求 重启问题设置打开XP兼容 针对具有虚拟机检测的软件 建议如下 度娘搜索…

Python结合MobileNetV2:图像识别分类系统实战

一、目录 算法模型介绍模型使用训练模型评估项目扩展 二、算法模型介绍 图像识别是计算机视觉领域的重要研究方向&#xff0c;它在人脸识别、物体检测、图像分类等领域有着广泛的应用。随着移动设备的普及和计算资源的限制&#xff0c;设计高效的图像识别算法变得尤为重要。…

机器学习原理之 -- 神经网络:由来及原理详解

神经网络&#xff08;Neural Networks&#xff09;是受生物神经系统启发而设计的一类计算模型&#xff0c;广泛应用于图像识别、语音识别、自然语言处理等领域。其基本思想是通过模拟人脑神经元的工作方式&#xff0c;实现对复杂数据的自动处理和分类。本文将详细介绍神经网络的…

Http Json参数到x-www-form-urlencoded参数的在线转换工具

Json参数到x-www-form-urlencoded参数的在线转换工具

本周23个Github有趣项目llama-agents等

23个Github有趣的项目、工具和库 1、Positron 下一代数据科学 IDE。 您使用 VS Code 进行数据科学&#xff08;Python 或 R&#xff09;&#xff0c;但希望它包含专用控制台、变量窗格、数据浏览器和其他用于特定数据工作的功能。您使用 Jupyterlab 进行数据科学&#xff08;…

求职成功率的算法,与葫芦娃救爷爷的算法,有哪些相同与不同

1 本节概述 通过在B站百刷葫芦娃这部儿时剧&#xff0c;我觉得可以从中梳理出一些算法&#xff0c;甚至可以用于求职这个场景。所以&#xff0c;大家可以随便问我葫芦娃的一些剧情和感悟&#xff0c;我都可以做一些回答。 2 葫芦娃救爷爷有哪些算法可言&#xff1f; 我们知道…

AE的首选项设置

打开AE,点击 编辑->首选项->常规 显示 点击“所有关键帧”&#xff0c;这样显示路径就会显示所有关键帧 导入 将序列素材改为25帧每秒&#xff0c;作为以后制作的默认 媒体和磁盘缓存 根据个人需求选择磁盘缓存的文件夹&#xff0c;如果d盘空间充足&#xff0c;就改成…

Linux——进程间通信一(共享内存、管道、systrem V)

一、进程间通信介绍 1.1、进程间通信的概念和意义 进程间通信(IPC interprocess communication)是一组编程接口&#xff0c;让不同进程之间相互传递、交换信息(让不同的进程看到同一份资源) 数据传输:一个进程需要将它的数据发送给另外一个进程 资源共享:多个进程之间共享同样…

WY-35A4T三相电压继电器 导轨安装 约瑟JOSEF

功能简述 WY系列电压继电器是带延时功能的数字式交流电压继电器。 可用于发电机&#xff0c;变压器和输电线的继电保护装置中&#xff0c;作为过电压或欠电压闭锁的动作元件 LCD实时显示当前输入电压值 额定输入电压Un:100VAC、200VAC、400VAC产品满足电磁兼容四级标准 产品…

开放式耳机哪个牌子好?悠律、漫步者、韶音全面对比与推荐

对于现在的无线耳机市场而言&#xff0c;开放式耳机迎来的真正的大爆发&#xff0c;关键的是它采用了定向传声方式&#xff0c;我们在运动时除了可以感受到音乐带来的快乐外&#xff0c;还能时刻保持对外界环境音的警觉。 今天&#xff0c;我们将为大家详细对比推荐三款备受瞩…

Docker 容器网络及其配置说明

Docker 容器网络及其配置说明 docker容器网络docker的4种网络模式bridge 模式container模式host 模式none 模式应用场景 docker 容器网络配置Linux 内核实现名称空间的创建创建 Network Namespace操作 Network Namespace 转移设备veth pair创建 veth pair实现 Network Namespac…

力扣双指针算法题目:二叉树的层序遍历(BFS)

目录 1.题目 2.思路解析 3.代码 1.题目 . - 力扣&#xff08;LeetCode&#xff09; 2.思路解析 对二叉树进行层序遍历&#xff0c;顾名思义&#xff0c;就是按每一层的顺序对二叉树一层一层地进行遍历 思路如下 从第一层开始&#xff0c;先将二叉树地头放入队列q&#xff0…

永磁同步电机参数辨识算法--模型参考自适应辨识电感

本文采用 MRAS 在线辨识电感参数&#xff08;Ld、Lq&#xff09; 一、原理介绍 从组成部分来看&#xff0c;MRAS由三个重要部分构成分别为参考、可调以及自适应律。参考模型相当于IPMSM 参数实时变化的准确值&#xff0c;即作为可调模型的参考值&#xff0c;可调模型依据参数…

如何将Grammarly内嵌到word中(超简单!)

1、下载 安装包下载链接见文章结尾 官网的grammarly好像只能作为单独软件使用&#xff0c;无法内嵌到word中&#x1f9d0;&#x1f9d0;&#x1f9d0; 2、双击安装包&#xff08;安装之前把Office文件都关掉&#xff09; 3、安装完成&#xff0c;在桌面新建个word文件并打开 注…

IT高手修炼手册(3)程序员命令

一、前言 程序员在日常工作中&#xff0c;掌握一些高效的快捷键可以大大提高编码和开发效率。 二、通用快捷键 文本操作Ctrl A&#xff1a;全选当前页面内容 Ctrl C&#xff1a;复制当前选中内容 Ctrl V&#xff1a;粘贴当前剪贴板内的内容 Ctrl X&#xff1a;剪切当前选中…

[Godot3.3.3] – 玩家死亡动画 part-1

设计模式和介绍 由于玩家脚本中代码冗余较大&#xff08;接近 150 行即将成为屎山代码&#xff09;&#xff0c;所以将玩家死亡设计成一个新的场景&#xff0c;并在玩家死亡后将这个死亡场景添加到玩家身上并删除玩家&#xff0c;从而简化项目的逻辑&#xff0c;减少代码的耦合…