当前位置: 首页 > news >正文

Web前端学习:章三 -- JavaScript预热(二)

六五:作用域与function

function:函数,不是数学上的函数,与写代码有关
JS中的函数:运用它,起个名字,然后对函数进行调用,即可将函数中的内容执行一遍

1、function

最基本的作用域
可以理解为一个打包方法

(1)标准写法:

function必须得有个名字

function 名字(){这里可以写要调的东西或函数的内容
};
名字();

在这里插入图片描述

(2)分析

function看做函数
function AI的{}中,写函数的内容,即要被调用的东西
运行AI(),对函数function进行调用,函数即会执行{}中本身的内容

2、作用域

作用在一定的区域,在该区域之外就不起作用。
函数就是一个最基本的作用域。

因为 - function在JS中为函数
而且 - 函数就是一个最基本的作用域
所以 - 任何function都是一个作用域

JS存在于大的script标签中,function就是个私人区域,function之外的变量都是公用的。
因为a是公用的,所以函数Ai可以取用a:
在这里插入图片描述
因为函数Ai是私人的,公共范围的alert不能拿到b的值,所以报错且提示b没有被定义(没找到b)
在这里插入图片描述
两个函数不相通,一样报错
在这里插入图片描述
函数定义之后可以任意调用:
在这里插入图片描述

六五:预解析和变量提升

1、预解析

预先解析,JS第一次解析代码叫预解析

(1)JS代码运行原理

JS本身会解析两次代码:
第一次 —— 预解析:粗略过一遍,检查代码是否为JS的代码格式,不管运行错误
第二次 —— 正常解析:正常运行代码,更仔细

1、预解析出现错误:
就是语法出去,代码完全不执行,所有写的JS均失效
2、正常解析出现错误:
即运行错误,从错误代码开始,后面的均不执行

2、变量提升

在预解析过程中会触发两个现象:报错 - 和 - 变量提升

变量提升:即把变量提到该作用域的最上面,赋的值不会提升
在这里插入图片描述
在这里插入图片描述
解析:
如上两图,结果都是undefined。
但是图一,是正常顺序,因为a没有赋值,所以提示undefined
查看图二,a赋值10,但是在alert的下面,在这里触发了变量提升,把变量a提到了上面,但是赋值10不会提上去,所以与图一结果一致,有变量a但是没有值

1、变量提升规则:

1、只有有作用域的位置会发生变量提升
在这里插入图片描述

2、只有有申明的东西才会提升(即赋值)

3、JS输出方式

1、alert:弹窗

在这里插入图片描述

2、console.log:打印

网页右键-检查-console,查看结果
在这里插入图片描述

4、唯一性验证

1、外面的a被里面的a覆盖
在这里插入图片描述
2、每个作用域都会触发变量提升
每个作用域都会触发变量提升
每个作用域都会触发变量提升
解析:触发了变量提升,所以20行的a被提升到18,不会提升值,所以在18行出现一个看不到、未赋值的a,这个a会覆盖16行的a,所以这里打印的是未赋值的a,即undefined。
在这里插入图片描述

4、流程

函数 = 作用域 => 进行预解析 => 触发变量提升
在这里插入图片描述

相关文章:

Web前端学习:章三 -- JavaScript预热(二)

六五:作用域与function function:函数,不是数学上的函数,与写代码有关 JS中的函数:运用它,起个名字,然后对函数进行调用,即可将函数中的内容执行一遍 1、function 最基本的作用域…...

Excel绘制数据对比表格-表格可视化

Word中生成的表格一般比较单调,若一组数据存在对比的情况时,读者/审稿人难以直接通过详细对比数据来分析,此时若可以将该组数据可视化来对比则为好,Excel则可实现该功能。 关于有些期刊需要提供表格中的数据便于复制等情况时&…...

究竟是谁负了谁,来自底层测试的2022年终总结

前言 说实话坐在椅子前,都想好了,该怎么去写,甚至感觉有好多要写的,但是当我坐在椅子上时,却不知道该怎么开头了,不知道是不是紧张?还是不舍?难道还没有跟过去挥手告别的勇气吗&…...

C++——IO流

目录 C语言的输入与输出 流是什么 CIO流 C标准IO流 C文件IO流 二进制读写 文本读写 stringstream的简单介绍 C语言的输入与输出 C语言中我们用到的最频繁的输入输出方式就是scanf ()与printf()。 scanf(): 从标准输入设备(键 盘)读取数据,并将值存放在变量中。…...

网络 | UDP与TCP协议讲解 | TCP可靠性是怎样实现的?

文章目录前置知识查看网络状态的工具查看进程idUDP协议协议格式UDP只有接收缓冲区基于UDP的应用层协议TCP协议流的理解协议格式确认应答机制缓冲区序号的作用流量控制超时重传机制6位标志位紧急数据的处理三次握手listen的第二个参数全连接和半连接队列都维护了什么信息&#x…...

JavaEE——简单介绍Thread类以及线程的基本操作

文章目录一、Thread 类中的常见构造方法二、Thread 的一些常见属性三、线程的启动——start()isAlive() 方法的解释四、线程中断五、线程等待-join()了解六、简单解释线程休眠一、Thread 类中的常见构造方法 我们已知,Thread 类是Java中多线程中的一个关键类&#…...

Java的数据库编程:JDBC

Content 🎉1什么是API 🎉2.什么是JDBC 🎉3.数据库驱动包的安装 🎉4.数据库安装包在idea的使用 🎉5.JDBC的增删改查的简单实现 今天为大家带来JAVA的数据库编程,也就是用Java实现数据库 数据库的最基本的操作就是…...

蓝桥冲刺31天之第六天

今天是摆子的一天,明天我要肝一整天的第四题!!! PS:一个普通的排序罢了 import java.io.*; import java.util.Arrays; import java.util.Scanner;/*** ClassName 考勤刷卡* Description TODO* Author 小怂很怂* Date 2…...

Streamlit 工具记录

Streamlit 是基于 Python 的 Web 应用程序框架,可视化数据,分析结果。 Streamlit 是一个开源库,可在短时间内开发机器学习可视化仪表板。只需几行代码就可以构部署强大的数据应用程序。Streamlit 可将仪表板的开发时间从几天缩短至几小时。 …...

GreenPlum小结

什么是GreenPlum?GreenPlum是业界最快最高性价比的关系型分布式数据库,它在开源的PostgreSQL的基础上采用MPP架构(Massive Parallel Processing,海量并行处理),具有强大的大规模数据分析任务处理能力。GreenPlum作为大数据融合存储…...

C语言中数组和指针

文章目录前言一、指针的概念二、指针的大小三、指针的用法1.指针指向变量2.指针指向数组3.指针指向函数总结前言 本文将给大家带来C语言中非常重要的两个知识点,指针和数组。 一、指针的概念 指针,是C语言中的一个重要概念及其特点,也是掌…...

Leetcode.剑指 Offer II 022 链表中环的入口节点

题目链接 Leetcode.剑指 Offer II 022 链表中环的入口节点 mid 题目描述 给定一个链表,返回链表开始入环的第一个节点。 从链表的头节点开始沿着 next指针进入环的第一个节点为环的入口节点。如果链表无环,则返回 null。 为了表示给定链表中的环&#…...

4种不同编程语言的打印方式

意义 打印方式是编程中不可或缺的一部分,它可以帮助开发人员有效地调试和测试代码,并提供有用的信息来监视程序的运行状态和性能。 编程语言中的打印方式是指将程序输出到终端或控制台上进行显示。这个功能在编程中非常重要,因为它可以帮助开…...

websocket介绍

我们聊聊轮询技术,什么是轮询?轮询就是在特定的时间间隔,由浏览器对服务器发出HTTP请求,然后由服务器返回最新的数据给客户端的浏览器。 轮询分为两种: 短轮询:通过不断的向服务端发送数据,客户端发送Request,服务端直接返回Response(不管服务端数据有没有改变)。长轮…...

Educational Codeforces Round 144 (Rated for Div. 2),C,D

C. Maximum Set 思路: 我们求最大数组,显然是L一直乘2,直到再乘2就越过区间位置。我们说过,再乘一个2就不行,那么我们除一个2,换句话说,就是再乘一个4就不行了。发现,我们可能有机会乘一个3&a…...

【redis学习篇】Redis三种持久化方式详解

官方文档 一、Redis持久性 Redis如何将数据写入磁盘 持久性是指将数据写入持久存储,如固态磁盘(SSD)。Redis提供了一系列持久性选项。其中包括: RDB(快照):RDB持久性以指定的时间间隔执行数据…...

垃圾回收中的分代年龄

为什么CMS里的分代年龄是6而不是15 CMS (Concurrent Mark Sweep) 是一种基于分代的垃圾收集器,其中分代年龄指的是一个对象在年轻代中经历了多少次垃圾收集。在 CMS 中,当一个对象的分代年龄达到阈值时,就会被晋升到老年代中。 在 CMS 中&a…...

蓝桥杯-左移右移(2022国赛)

蓝桥杯-左移右移1、问题描述2、解题思路与代码实现2.1 方法一:使用LinkedList双向链表实现(50%)2.2 方法二:使用HashMap左右临界值实现(100%)1、问题描述 小蓝有一个长度为 N 的数组, 初始时从左到右依次是 1,2,3,…N 。 之后小蓝对这个数组进行了 M 次操…...

你还在手撸SQL?ChatGPT笑晕在厕所

文章目录你还在手撸SQL?ChatGPT笑晕在厕所一、背景二、面向Chat编程1. 数据库设计2. 建表语句3. 加中文注释4. 数据模拟5. 查询成绩6. 修改课程任课老师7. 删除课程8. 删除一个有关联数据的课程总结你还在手撸SQL?ChatGPT笑晕在厕所 一、背景 经典3表设…...

【Redis】Redis慢查询

文章目录慢查询记录慢查询两个配置参数修改配置参数慢查询日志慢查询记录 我们都知道像mysql等持久化数据库会有慢查询日志,其实Redis中也有慢查询日志的功能。慢查询就是系统在执行命令的前后计算每条命令的执行时间,如果超过我们预设的时间&#xff0c…...

STM32F407实战:基于CubeMX与FreeRTOS的SDIO-FatFs文件系统高效读写方案

1. 环境准备与CubeMX基础配置 第一次接触STM32F407的SD卡存储时,我被各种专业术语搞得晕头转向。后来发现,只要用对工具和方法,实现文件系统读写其实没那么复杂。CubeMX这个图形化配置工具真是开发者的福音,它能帮我们自动生成80%…...

C++的std--ranges中的优化内联

C的std::ranges中的优化内联:提升性能的利器 在现代C编程中,std::ranges库的引入为算法和范围操作带来了更高的抽象性和灵活性。许多开发者可能忽略了其背后隐藏的性能优化潜力——尤其是通过内联机制实现的效率提升。本文将深入探讨std::ranges中的优化…...

别再只用scatter了!用Matlab绘制密度散点图,让你的数据分布一目了然(附TheColor配色方案)

突破数据可视化瓶颈:Matlab密度散点图实战指南 当你面对数十万个数据点时,传统的散点图往往会变成一团模糊的噪点,重要分布特征完全被掩盖。这种场景下,密度散点图就像给你的数据装上了X光机,让隐藏的模式和结构清晰可…...

线激光手眼标定里,欧拉角和四元数到底怎么选?一个案例讲清机器人姿态的‘坑’

线激光手眼标定中欧拉角与四元数的抉择:从理论误区到工程实践 在机器人视觉系统中,手眼标定是连接感知与执行的关键桥梁。当激光传感器安装在机械臂末端时,如何准确描述传感器坐标系与机器人坐标系之间的姿态关系,直接决定了后续视…...

慕尼黑工业大学全新突破:让2D图片生成器变身3D世界建造师

这项由慕尼黑工业大学领导的研究发表于2026年的计算机视觉与模式识别顶级会议,论文编号为arXiv:2603.19708v1。有兴趣深入了解的读者可以通过该编号查询完整论文。当你使用手机拍摄一张美丽风景照片时,你可能从未想过,这张平面照片其实包含了…...

从赛道到产线:智能车竞赛如何为《美国工厂》精神谱写青春代码

1. 智能车竞赛:制造业的青春实验室 当《美国工厂》纪录片中那些机械臂精准运作的画面还在脑海中挥之不去时,我站在全国大学生智能车竞赛的现场,突然意识到这两者之间存在着某种奇妙的联系。智能车竞赛就像是一个微缩版的制造业实验室&#xf…...

深入解析Host头攻击:原理、危害与防御策略

1. Host头攻击的基本原理 HTTP协议中的Host头字段就像快递单上的收件人地址。当你在浏览器输入www.example.com时,浏览器会在HTTP请求头部自动添加一行Host: www.example.com,告诉服务器你想访问哪个网站。这个设计本是为了让一台服务器能托管多个网站&a…...

QGIS进阶指南:动态标注与条件表达式高级应用

1. 动态标注的核心价值与应用场景 当你面对一个包含上千条建筑数据的地图图层时,传统静态标注会显得力不从心——商场和医院用相同字体显示,重要地标淹没在普通建筑中,数据更新后还得手动调整样式。这就是动态标注技术大显身手的时候了。 动态…...

Kubernetes与Istio服务网格最佳实践

Kubernetes与Istio服务网格最佳实践 1. Istio服务网格核心概念 1.1 什么是服务网格 服务网格是一种专门用于处理服务间通信的基础设施层,它负责在现代云原生应用的复杂服务拓扑中可靠地传递请求。 1.2 Istio架构组件 控制平面:包含Pilot、Galley、Citade…...

毕业设计实战:基于SSM的学生宿舍设备报修管理系统设计与实现全攻略

毕业设计实战:基于SSM的学生宿舍设备报修管理系统设计与实现全攻略 在开发“学生宿舍设备报修管理系统”这套毕设时,我曾因“故障上报与维修派单流程脱节”踩过一个关键坑。初期设计时,我将“学生报修”和“维修人员接单”视为两个独立的模块…...