【零基础】学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.mzph.cn/diannao/42972.shtml

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

相关文章

C#实现求解函数导数和值

using MathNet.Symbolics; using System; using System.IO; using System.Text;private string ConvertToLatex(string mathExpression) {return mathExpression.Replace(" * ", "").Replace("*", ""); }// 将函数定义为字符串 string…

AI语言处理的双刃剑:Tokens令牌化技术解析

生成式人工智能模型&#xff0c;如GPT-4o&#xff0c;采用基于Transformer架构的复杂处理方式&#xff0c;这与人类处理文本的方式存在明显差异。这些模型依赖于一种称为“令牌化”的过程&#xff0c;将文本分解为更小的片段&#xff0c;称为“令牌”&#xff0c;以便更有效地处…

Kafka抛弃Zookeeper后如何启动?

Kafaka如何下载 官网地址 目前Kafka最新的版本就是3.7.1 我们可以看到下面这两个版本信息&#xff1f;什么意思呢&#xff1f; Scala 2.12 - kafka_2.12-3.7.1.tgz (asc, sha512)Scala 2.13 - kafka_2.13-3.7.1.tgz (asc, sha512) 我们应该知道&#xff0c;一个完整的Kafka实…

平安消保在行动 | 守护每一个舒心笑容 不负每一场双向奔赴

“要时刻记得以消费者为中心&#xff0c;把他们当做自己的朋友&#xff0c;站在他们的角度去思考才能更好地解决问题。” 谈及如何成为一名合格的消费者权益维护工作人员&#xff0c;平安养老险深圳分公司负责咨诉工作的庞宏霄认为&#xff0c;除了要具备扎实的专业技能和沟通…

MySQL篇四:表的约束

文章目录 前言1. 空属性2. 默认值3. 列描述4. zerofill5. 主键6. 自增长7. 唯一键8. 外键 前言 真正约束字段的是数据类型&#xff0c;但是数据类型约束很单一&#xff0c;需要有一些额外的约束&#xff0c;更好的保证数据的合法性&#xff0c;从业务逻辑角度保证数据的正确性。…

JAVA学习笔记-JAVA基础语法-DAY24-Stream流、方法引用

第一章 Stream流 说到Stream便容易想到I/O Stream&#xff0c;而实际上&#xff0c;谁规定“流”就一定是“IO流”呢&#xff1f;在Java 8中&#xff0c;得益于Lambda所带来的函数式编程&#xff0c;引入了一个全新的Stream概念&#xff0c;用于解决已有集合类库既有的弊端。 …

python 高级技巧 0708

python 33个高级用法技巧 使用装饰器计时函数 装饰器是一种允许在一个函数或方法调用前后运行额外代码的结构。 import timedef timer(func):"""装饰器函数&#xff0c;用于计算函数执行时间并打印。参数:func (function): 被装饰的函数返回:function: 包装后…

软件架构之开发方法

软件架构之开发方法 第6章&#xff1a;开发方法6.1 软件生命周期6.2 软件开发模型6.2.1 瀑布模型6.2.2 演化模型6.2.3 螺旋模型6.2.4 增量模型6.2.5 构件组装模型 6.3 统一过程6.4 敏捷方法6.4.1 极限编程6.4.2 特征驱动开发6.4.3 Scrum6.4.4 水晶方法6.4.5 其他敏捷方法 6.5 软…

vmware lun回收引起的IO问题

起初并没人关注的小问题,正常不过的虚机存储迁移操作,引起的延迟却引发一连串的变化。 环境 vsphere 6.7 + 华为集中式存储 开始 下午5:17 业务反馈,存在数据超时,频繁在1秒钟以内,正常在200ms。需运维排查虚机的状态与IO情况等硬件使用情况。下午5:30 随手翻开zabbix 打开…

vue在线预览excel、pdf、word文件

安装 //docx文档预览组件 npm install vue-office/docx vue-demi//excel文档预览组件 npm install vue-office/excel vue-demi//pdf文档预览组件 npm install vue-office/pdf vue-demi使用示例 docx文档的预览 <template><vue-office-docx :src"src" ren…

【嵌入式Linux】<知识点> 虚拟地址空间

前言 在Linux中&#xff0c;新创建的进程都拥有独立的虚拟地址空间。为深入多进程多线程的理解&#xff0c;了解虚拟地址空间分区十分有必要。 一、概念 虚拟地址空间分为4G空间&#xff0c;其中1G为内核区&#xff0c;3G为用户区。虚拟地址空间的地址从0开始&#xff0c;且该…

20240708 视觉大模型

参考网站&#xff1a; 万字长文带你全面解读视觉大模型 - 知乎 一.DINO 1."YOLO"&#xff08;You Only Look Once&#xff09;和"DINO"&#xff08;DIstillation of knowledge&#xff09;是两种不同的模型&#xff0c;针对不同的任务和学习目标。以下是…

oracle数据库表统计信息

oracle数据库表统计信息未及时更新会导致oracle基于成本的执行计划可能不是最优&#xff0c;查看执行计划是没问题的&#xff0c;但sql实际执行起来确很慢。 查询oracle数据库表统计信息最后更新时间&#xff1a; SELECT TABLE_NAME, LAST_ANALYZED,a.* FROM ALL_TAB_STATISTI…

66.Python-web框架-Django-免费模板django-datta-able的分页的一种方式

目录 1.方案介绍 1.1实现效果 1.2django.core.paginator Paginator 类: Page 类: EmptyPage 和 PageNotAnInteger 异常: 1.3 templatetags 2.方案步骤 2.1创建一个common app 2.2创建plugins/_pagination.html 2.3 其他app的views.py查询方法 2.4在AIRecords.html里…

入门 Vue Router

Vue Router Vue Router插件做了什么&#xff1f; 全局注册 RouterView 和 RouterLink 组件。添加全局 $router 和 $route 属性。启用 useRouter() 和 useRoute() 组合式函数。触发路由器解析初始路由。 标签介绍 RouterView 加载指定页面 <RouterLink to"/home"…

必剪APP视频剪辑的字幕制作方法教程!

你是否还在用pr听一句打一句的制作字幕&#xff1f;你是否还在用ps做字幕然后拉到pr里一句一句的对时间轴&#xff1f;快别用那些老方法啦&#xff0c;繁琐又浪费时间&#xff01;今天给大家推荐一个方便速度的制作字幕的方法&#xff0c;赶快来看看吧&#xff01; 第一步&…

【Altium】AD-网络版一个用户非人为异常占用多个License的解决方法

【更多软件使用问题请点击亿道电子官方网站】 1、 文档目标 当出现一个用户同时占用多个授权&#xff0c;又无法单独释放一个授权的情况下&#xff0c;该如何解决。 2、 问题场景 一个用户获取网络版授权后&#xff0c;AD会自动重复获取授权&#xff0c;直到该license下所有授…

电视盒子变身NAS之安装termux

此方法适合安卓4.4到安卓9.0都可以用&#xff0c;我目前测试的设备是安卓9.0的电视盒子 第一步&#xff1a;下载安装termux https://termux.dev/en/ 或者 https://github.com/termux/termux-app/releases 第二步&#xff1a;把apk安装到你的机顶盒&#xff0c;使用优盘&…

读书记录《SQL从小白到大牛》01

读书记录《SQL从小白到大牛》01 接地气的书名&#xff0c;内容应当值得一读。 第一篇 SQL基础 01 一些基础概念 SQL是结构化查询语言&#xff08;Structured Query Language&#xff09;&#xff0c;是一套用来输入、更改和查看关系数据库内容的命令。数据库发展经历三个阶…

Python自动化与系统安全

信息安全是运维的根本&#xff0c;直接关系到企业的安危&#xff0c;稍有不慎会造成灾难性的后果。比如经年发生的多个知名网站会员数据库外泄事件&#xff0c;信息安全体系建设已经被提到了前所未有的高度。如何提升企业的安全防范水准是目前普遍面临的问题&#xff0c;主要有…