JavaScript第四讲:函数,作用域,运算符

前言

在JavaScript的广阔天地中,函数、作用域、算术运算符和逻辑运算符是构成代码世界的基石。它们各自扮演着不同的角色,却又紧密相连,共同编织出丰富多彩的程序逻辑。无论是编写一个简单的网页交互,还是构建一个复杂的应用程序,这些基础知识都是不可或缺的。今天星途给大家带来函数,作用域,运算符的详解,学过的大佬们可以当作笔记收藏起来。

JavaScript 语言基础详解:函数

在 JavaScript 中,函数(Function)是一段可以重复使用的代码块,它用于执行特定的任务。函数可以接收输入(参数)并返回输出(返回值)。下面我们将从函数的定义、带参数的函数以及带返回值的函数等方面来详细讲解。

1. 函数的定义

在 JavaScript 中,我们可以使用 function 关键字来定义函数。函数的定义包括函数名、参数列表和函数体。

// 定义一个名为 sayHello 的函数  
function sayHello() {  console.log("Hello, world!");  
}  // 调用函数  
sayHello(); // 输出:Hello, world!

2. 带参数的函数

函数可以接收参数,这些参数在函数体内部可以作为变量来使用。参数在定义函数时列出,并在调用函数时提供具体的值。

// 定义一个带参数的函数 greet  
function greet(name) {  console.log("Hello, " + name + "!");  
}  // 调用函数并传递参数  
greet("Alice"); // 输出:Hello, Alice!  
greet("Bob"); // 输出:Hello, Bob!

在上面的例子中,我们定义了一个名为 greet 的函数,它接收一个参数 name。在函数体内部,我们使用这个参数来构造一条问候语,并通过 console.log 输出。当我们调用 greet 函数并传递不同的参数时,函数会输出不同的问候语。

3. 带返回值的函数

函数还可以返回一个值。这个值可以是任何 JavaScript 数据类型,包括基本数据类型(如字符串、数字等)和复杂数据类型(如对象、数组等)。要返回一个值,我们可以使用 return 语句。

// 定义一个带返回值的函数 calculateSum  
function calculateSum(a, b) {  return a + b;  
}  // 调用函数并获取返回值  
let result = calculateSum(3, 5); // result 的值为 8  
console.log(result); // 输出:8

在上面的例子中,我们定义了一个名为 calculateSum 的函数,它接收两个参数 ab,并返回它们的和。当我们调用 calculateSum 函数并传递参数 35 时,函数会返回它们的和 8,并将这个值存储在变量 result 中。最后,我们通过 console.log 输出 result 的值。

函数小结

通过上面的介绍和示例代码,我们详细讲解了 JavaScript 中函数的定义、带参数的函数以及带返回值的函数。函数是 JavaScript 中非常重要的概念,它可以帮助我们组织代码、提高代码的可复用性和可维护性。

JavaScript 语言基础详解:作用域

在 JavaScript 中,作用域(Scope)是一个非常重要的概念,它决定了变量、函数和对象的可访问性。简单来说,作用域就是变量和函数可以被访问的代码区域。下面我们将从参数的作用域和全局变量的作用域两个方面来详细讲解。

1. 参数的作用域

在 JavaScript 中,函数的参数在函数体内具有局部作用域。这意味着参数只能在函数体内部被访问,函数体外部无法直接访问函数的参数。

function greet(name) {  // 参数 name 在函数体内部具有局部作用域  console.log("Hello, " + name + "!");  
}  // 调用函数,传递参数 "Alice"  
greet("Alice"); // 输出:Hello, Alice!  // 在函数体外部无法直接访问参数 name  
// 下面的代码会报错,因为 name 未定义  
console.log(name); // ReferenceError: name is not defined

在上面的例子中,greet 函数接收一个参数 name,该参数在函数体内部具有局部作用域。当我们在函数体外部尝试访问 name 时,会抛出一个 ReferenceError,因为 name 在这个上下文中是未定义的。

2. 全局变量的作用域

在 JavaScript 中,如果你在函数体外部声明一个变量(没有使用 varletconst 关键字声明,或者使用了 var 关键字但在任何函数体外部),那么这个变量就会成为一个全局变量,具有全局作用域。全局变量可以在代码的任何地方被访问和修改。

不过,在现代 JavaScript 开发中,通常推荐使用 letconst 来声明变量,因为它们具有块级作用域(block scope),这有助于减少命名冲突和意外的变量修改。

下面是一个全局变量的例子:

// 在函数体外部声明一个全局变量  
var globalVar = "I am global!";  function showGlobalVar() {  // 在函数体内部可以访问全局变量  console.log(globalVar); // 输出:I am global!  
}  // 在函数体外部也可以访问全局变量  
console.log(globalVar); // 输出:I am global!  // 修改全局变量的值  
globalVar = "I changed!";  // 再次访问全局变量,值已经改变  
console.log(globalVar); // 输出:I changed!

在上面的例子中,我们声明了一个全局变量 globalVar,并在函数体内部和外部都可以访问和修改它。

然而,使用全局变量通常被认为是一种不好的编程实践,因为它可能会导致命名冲突和意外的副作用。因此,在编写代码时,应尽量避免使用全局变量,而是使用局部变量或模块化的方式来组织代码。

JavaScript 语言基础详解:算术运算符

在 JavaScript 中,算术运算符用于执行数学计算,比如加、减、乘、除等。下面我们将从基本算术运算符、自增和自减运算符、赋值运算符以及 + 运算符的多态性等方面来详细讲解。

1. 基本算术运算符

基本算术运算符包括:

  • 加法运算符 +
  • 减法运算符 -
  • 乘法运算符 *
  • 除法运算符 /
  • 取模运算符 %

示例

let a = 5;  
let b = 3;  console.log(a + b);  // 加法: 输出 8  
console.log(a - b);  // 减法: 输出 2  
console.log(a * b);  // 乘法: 输出 15  
console.log(a / b);  // 除法: 输出 1.6666666666666667  
console.log(a % b);  // 取模: 输出 2

2. 自增和自减运算符

  • 自增运算符 ++:将变量的值加 1。
  • 自减运算符 --:将变量的值减 1。

自增和自减运算符有两种形式:前置(先加/减后使用)和后置(先使用后加/减)。

示例

let c = 5;  console.log(++c);  // 前置自增: 输出 6,此时 c 的值也是 6  
c = 5;  
console.log(c++);  // 后置自增: 输出 5,但此时 c 的值已经变为 6  let d = 5;  console.log(--d);  // 前置自减: 输出 4,此时 d 的值也是 4  
d = 5;  
console.log(d--);  // 后置自减: 输出 5,但此时 d 的值已经变为 4

3. 赋值运算符

赋值运算符 = 用于给变量赋值。但 JavaScript 还提供了复合赋值运算符,它们结合了算术运算符和赋值运算符的功能。

  • +=:加等于
  • -=:减等于
  • *=:乘等于
  • /=:除等于
  • %=:取模等于

示例

let e = 10;  e += 5;  // 相当于 e = e + 5; 输出 e 的值: 15  
e -= 3;  // 相当于 e = e - 3; 输出 e 的值: 12  
e *= 2;  // 相当于 e = e * 2; 输出 e 的值: 24  
e /= 4;  // 相当于 e = e / 4; 输出 e 的值: 6  
e %= 2;  // 相当于 e = e % 2; 输出 e 的值: 0

4. + 运算符的多态性

在 JavaScript 中,+ 运算符具有多态性,它既可以作为加法运算符,也可以作为字符串连接符(当其中一个操作数是字符串时)。

示例

let f = 10;  
let g = "5";  console.log(f + g);  // 输出 "105",因为 g 是字符串,所以执行了字符串连接  
console.log(f + parseInt(g));  // 输出 15,通过 parseInt 将 g 转换为整数,然后执行加法

在这个例子中,当 f(一个数字)和 g(一个字符串)相加时,JavaScript 将 f 转换为字符串,并执行字符串连接。但是,如果我们使用 parseInt(g)g 转换为整数,然后再相加,就会得到数字的和。

JavaScript语言基础详解:逻辑运算符

在JavaScript中,逻辑运算符用于根据一个或多个条件来执行不同的操作。这些运算符通常用于条件语句(如ifelsewhile等)中。下面我们将从基本逻辑运算符、绝对等于和绝对不等于、以及三目运算符等方面进行详细解释,并附上代码示例。

1. 基本逻辑运算符

  • 逻辑与(AND):&&
  • 逻辑或(OR):||
  • 逻辑非(NOT):!

示例

let x = 5;  
let y = 10;  // 逻辑与(AND)  
let andResult = (x === 5) && (y === 10); // true,因为两个条件都为真  
console.log(andResult);  // 逻辑或(OR)  
let orResult = (x === 2) || (y === 10); // true,因为第二个条件为真  
console.log(orResult);  // 逻辑非(NOT)  
let notResult = !(x === 5); // false,因为x确实等于5  
console.log(notResult);

2. 绝对等于和绝对不等于

在JavaScript中,我们使用===(绝对等于)和!==(绝对不等于)来比较两个值是否相等,包括它们的值和类型。这与==(等于)和!=(不等于)不同,后者在比较时会进行类型转换。

示例

let a = 5;  
let b = "5";  // 绝对等于(值和类型都相等)  
let equalResult = a === b; // false,因为a是数字,b是字符串  
console.log(equalResult);  // 绝对不等于(值或类型不相等)  
let notEqualResult = a !== b; // true,因为a和b的类型不同  
console.log(notEqualResult);

3. 三目运算符(条件运算符)

三目运算符(也称为条件运算符)允许你在一行代码中执行简单的条件语句。其语法为:条件 ? 值1 : 值2。如果条件为真,则返回值1;否则返回值2

示例

let z = 10;  
let max = (z > 5) ? z : 5; // 如果z大于5,则max为z的值,否则为5  
console.log(max); // 输出10  z = 3;  
max = (z > 5) ? z : 5; // 如果z不大于5,则max为5  
console.log(max); // 输出5

结语:

经过对函数、作用域、算术运算符和逻辑运算符的深入探讨,相信大家对JavaScript的基础知识有了更加深入的理解。这些基础知识是编写高质量JavaScript代码的基础,也是成为一名优秀JavaScript开发者的必备技能。

在编程的道路上,不断学习和实践是成长的关键。希望大家能够将这些基础知识融入到实际的项目中,通过不断的实践和总结,不断提升自己的编程能力。愿大家在JavaScript的海洋中畅游,创造出精彩的作品!

respect!

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

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

相关文章

React-表单受控绑定

概念:使用React组件的状态(useState)控制表单的状态 1.准备一个React状态值 2.通过value属性绑定状态,通过onChange属性绑定状态同步的函数

js或者es6 已知id为222的对象数据,如何查询并返回该数据中parentId: 7对应的对象父节点数据的对象

要查询并返回id为222的对象数据中parentId为7对应的对象的父节点数据,我们需要遍历整个data数组,找到id为222的对象,并从其父节点中提取信息。由于您提供的data数组中的对象格式存在问题(例如,对象的键值对应该用花括号…

2024年5月总结及随笔之快乐五一

1. 回头看 日更坚持了517天。 读《天才与算法:人脑与AI的数学思维》更新完成 2023年至2024年5月底累计码字1177253字,累计日均码字2277字。 2024年5月码字95875字,同比增长66.7%,环比增长9.3%,日均码字数3092字&am…

jenkins快速入门

Jenkins 是啥? Jenkins 是一个超级能干的自动化助手,它的主要任务是帮你自动构建项目、测试代码、部署应用等等,就像你告诉它:“嘿,Jenkins,我改了代码,你帮我看看能不能正常运行,没…

STM32 定时器与PWM的LED控制

学习目标: 1. 使用定时器的某一个通道控制LED周期性亮灭; 2. 采用定时器PWM模式,让 LED 以呼吸灯方式渐亮渐灭。 一、定时器 1、STM32定时器介绍 STMicroelectronics是STM32微控制器中的重要块,具有丰富的外设和功能&#xff0…

Dijkstra求最短路篇一(全网最详细讲解两种方法,适合小白)(python,其他语言也适用)

前言: Dijkstra算法博客讲解分为两篇讲解,这两篇博客对所有有难点的问题都会讲解,小白也能很好理解。看完这两篇博客后保证收获满满。 本篇博客讲解朴素Dijkstra算法,第二篇博客讲解堆优化Dijkstra算法Dijkstra求最短路篇二(全网…

从C++示例理解开闭原则

开闭原则要求我们在编写代码时,尽量不去修改原先的代码,当出现新的业务需求时,应该通过增加新代码的形式扩展业务而不是对原代码进行修改。 假如我们现在有一批产品,每个产品都具有颜色和大小,产品其定义如下&#xf…

父子进程概述

父子进程概述 总结了两篇博客,对父子进程涉及的问题进行了简要总结(参考博客在文章末尾) 创建进程的目的一般有两个: 一是父进程希望生成一份自己的副本,执行同一个程序中不同的代码片段。二是让子进程执行不同的程序…

python with 和 上下文管理器

with with操作写法简单又安全 文件操作使用with会自动调用关闭文件操作,即使出现异常也会自动调用文件关闭操作 上下文管理器 with语句强大的根本是由上下文管理器支持的 通过open打开的的文件,赋值给的一个变量file,file就是文件对象&am…

linux docker常用命令记录

一、防火墙 1. 开启防火墙 systemctl start firewalld 2.查看防火墙状态 systemctl status firewalld 二、docker 1.启动docker systemctl start docker 2.关闭docker systemctl stop docker 3.重启docker systemctl restart docker4.查看docker 运行状态 systemc…

Kotlin 函数

文章目录 函数的定义函数的返回值参数默认值 & 调用时参数指定函数作用域Lambda 表达式匿名函数内联函数扩展函数中缀函数递归函数 & 尾递归函数 函数的定义 函数可以理解成一个小小的加工厂,给入特定的原材料,它就会给出特定的产品。 fun [接…

知识运维概述

文章目录 知识运维研究现状技术发展趋势 知识运维 由于构建全量的行业知识图谱成本很高,在真实的场景落地过程中,一般遵循小步快走、快速迭代的原则进行知识图谱的构建和逐步演化。知识运维是指在知识图谱初次构建完成之后,根据用户的使用反馈…

小白跟做江科大32单片机之对射式红外传感器计次

原理部分 1中断示意图,中断会打断主函数的执行,终端执行完成之后再返回主函数继续执行 2.STM32中断 这些灰色的是内核中断 这些白色的是普通中断 3.NVIC统一管理中断,每个中断通道都拥有16个可编程的优先等级,可对优先级进行分组…

独孤思维:10个T的赚钱资料,要不要

01 今天有一个通过网站引流过来的粉丝。 问我,为啥网站不设置付费,这样直接转化成网站vip。 我说,我想把用户沉淀到私域。 其实这个问题,独孤在早年做网站的时候也思考过。 前端给资料,是为了后端引流加个人号&am…

java-this关键字

Java 中的 this 关键字是一个特殊的引用,它代表当前对象。在 Java 中,this 关键字可以在类的构造函数、方法、块和初始化语句中使用。this 关键字的主要作用是: 1. 引用当前对象的属性(Field):使用 this 关…

OCP题库

Q2.分析下面的语句和输出: mysql> SHOW GRANTS FOR jsmith; ------------------------------------------------------------------------------------------------------------------- IGrants for jsmith% | -----------------------------------------------------------…

Redis缓存(笔记一:缓存介绍和数据库启动)

目录 1、NoSQL数据库简介 2、Redis介绍 3、Redis(win系统、linux系统中操作) 3.1 win版本Redis启动 3.2 linux版本Redis启动 1、NoSQL数据库简介 技术的分类:(发展史) 1、解决功能性的问题:Java、Jsp、RDBMS、Tomcat、HTML、…

Filter和ServletContext和Listener

目录 Filter案例 解决全站乱码问题 登录权限校验 ServletContext对象 Listener(监听器) Filter案例 解决全站乱码问题 我们每次访问每个servlet都要书写处理请求和响应乱码的代码,这样代码十分冗余,所以我们可以在过滤中 We…

Java——变量

一、变量介绍 变量就是申请内存来存储值。也就是说,当创建变量的时候,需要在内存中申请空间。内存管理系统根据变量的类型为变量分配存储空间,分配的空间只能用来储存该类型数据。 1、变量声明和初始化 变量的声明: int a; i…

44-1 waf绕过 - WAF的分类

一、云 WAF 通常包含在 CDN 中的 WAF。在配置云 WAF 时,DNS 需要解析到 CDN 的 IP 上。请求 URL 时,数据包会先经过云 WAF 进行检测,如果通过检测,再将数据包流向主机。 二、硬件IPS/IDS防护、硬件WAF 硬件IPS/IDS防护&#xff…