主页
  • 主页
  • 分类
  • 热文
  • 教程
  • 面试
  • 标签
JavaScript

JavaScript 基础

JavaScript 主页
JavaScript 概述
JavaScript 特性
JavaScript 启用
JavaScript 展示位置
JavaScript 语法
JavaScript hello_world
JavaScript console.log()
JavaScript 注释
JavaScript 变量
JavaScript let 语句
JavaScript 常量
JavaScript 数据类型
JavaScript 类型转换
JavaScript 严格模式
JavaScript 保留关键字

JavaScript 操作符

JavaScript 操作符
JavaScript 算术运算符
JavaScript 比较操作符
JavaScript 逻辑运算符
JavaScript 位运算符
JavaScript 赋值运算符
JavaScript 条件运算符
JavaScript typeof 运算符
JavaScript Nullish 合并运算符
JavaScript delete 运算符
JavaScript 逗号运算符
JavaScript 分组运算符
JavaScript Yield 运算符
JavaScript 扩展运算符
JavaScript 指数运算符
JavaScript 运算符优先级

JavaScript 控制流

JavaScript if...else 语句
JavaScript while 循环
JavaScript for 循环
JavaScript for...in 循环
JavaScript for...of 循环
JavaScript 循环控制
JavaScript break 语句
JavaScript continue 语句
JavaScript switch 语句
JavaScript 可迭代对象

JavaScript 函数

JavaScript 函数
JavaScript 函数表达式
JavaScript 函数参数和参数值
JavaScript 默认参数
JavaScript Function() 构造函数
JavaScript 函数提升
JavaScript 自执行函数
JavaScript 箭头函数
JavaScript 函数调用
JavaScript call() 方法
JavaScript apply() 方法
JavaScript bind() 方法
JavaScript 闭包
JavaScript 作用域
JavaScript 全局变量
JavaScript 智能函数参数

JavaScript 对象

JavaScript Number 对象
JavaScript Boolean 对象
JavaScript String 对象
JavaScript 数组对象
JavaScript 日期对象
JavaScript DataView 对象
JavaScript 处理程序
JavaScript Math 对象
JavaScript 正则表达式
JavaScript Symbol 类型
JavaScript Set 对象
JavaScript WeakSet 对象
JavaScript Map 对象
JavaScript WeakMap 对象
JavaScript 可迭代对象
JavaScript Reflect 对象
JavaScript TypedArray
JavaScript 模板字面量
JavaScript 标记模板

JavaScript 面向对象

JavaScript 对象
JavaScript 类
JavaScript 对象属性
JavaScript 对象方法
JavaScript 静态方法
JavaScript 显示对象
JavaScript 对象访问器属性
JavaScript 对象构造器
JavaScript 原型(Prototype)
JavaScript ES5 对象方法
JavaScript 封装
JavaScript 继承
JavaScript 抽象
JavaScript 多态
JavaScript 解构赋值
JavaScript 数组解构
JavaScript 嵌套解构
JavaScript 可选链
JavaScript 全局对象
JavaScript mixins
JavaScript 代理(Proxy)

JavaScript Cookies

JavaScript Cookies操作
JavaScript Cookie 属性
JavaScript 删除 Cookies

JavaScript 浏览器 BOM

JavaScript 浏览器对象模型(BOM)
JavaScript 窗口对象
JavaScript Document 对象
JavaScript 屏幕对象
JavaScript Window History 对象
JavaScript Navigator 对象
JavaScript Location 对象
JavaScript Console 对象

JavaScript Web APIs

JavaScript Web API
JavaScript History API
JavaScript 存储 API
JavaScript Forms API
JavaScript Worker API
JavaScript Fetch API
JavaScript 定位 API

JavaScript 事件

JavaScript 事件
JavaScript DOM 事件
JavaScript addEventListener()
JavaScript 鼠标事件
JavaScript 键盘事件
JavaScript 表单事件
JavaScript 窗口事件
JavaScript 事件委托
JavaScript 事件冒泡
JavaScript 事件捕获
JavaScript 自定义事件

JavaScript 错误处理

JavaScript 错误处理
JavaScript try-catch
JavaScript 调试
JavaScript 自定义错误
JavaScript 扩展错误

JavaScript 重要关键字

JavaScript this'关键字
JavaScript void 关键字
JavaScript new 关键字
JavaScript var 关键字

JavaScript HTML DOM

JavaScript HTML DOM
JavaScript DOM 方法
JavaScript 文档对象
JavaScript DOM 元素
JavaScript 文档表单
JavaScript 更改 HTML
JavaScript 更改 CSS
JavaScript DOM 动画
JavaScript DOM 导航
JavaScript DOM 集合
JavaScript 节点列表

JavaScript 杂项

JavaScript Ajax
JavaScript 异步迭代
JavaScript Atomics 对象
JavaScript 剩余参数
JavaScript 页面重定向
JavaScript 对话框
JavaScript 打印网页
JavaScript 表单验证
JavaScript 创建动画
JavaScript 多媒体
JavaScript 图像地图
JavaScript 浏览器兼容性
JavaScript JSON
JavaScript 多行字符串
JavaScript 浅拷贝
JavaScript 日期格式
JavaScript 获取日期方法
JavaScript 调用栈
JavaScript 引用类型
JavaScript 设置日期方法
JavaScript 模块
JavaScript IndexedDB
JavaScript clickjacking(点击劫持)
JavaScript 动态导入
JavaScript BigInt
JavaScript 柯里化(Currying)
JavaScript 图形库
JavaScript Blob
JavaScript Unicode
JavaScript 绘制图形
JavaScript 防抖
JavaScript 性能
JavaScript 编码规范

基础

JavaScript 主页
JavaScript 概述
JavaScript 特性
JavaScript 启用
JavaScript 展示位置
JavaScript 语法
JavaScript hello_world
JavaScript console.log()
JavaScript 注释
JavaScript 变量
JavaScript let 语句
JavaScript 常量
JavaScript 数据类型
JavaScript 类型转换
JavaScript 严格模式
JavaScript 保留关键字

操作符

JavaScript 操作符
JavaScript 算术运算符
JavaScript 比较操作符
JavaScript 逻辑运算符
JavaScript 位运算符
JavaScript 赋值运算符
JavaScript 条件运算符
JavaScript typeof 运算符
JavaScript Nullish 合并运算符
JavaScript delete 运算符
JavaScript 逗号运算符
JavaScript 分组运算符
JavaScript Yield 运算符
JavaScript 扩展运算符
JavaScript 指数运算符
JavaScript 运算符优先级

控制流

JavaScript if...else 语句
JavaScript while 循环
JavaScript for 循环
JavaScript for...in 循环
JavaScript for...of 循环
JavaScript 循环控制
JavaScript break 语句
JavaScript continue 语句
JavaScript switch 语句
JavaScript 可迭代对象

函数

JavaScript 函数
JavaScript 函数表达式
JavaScript 函数参数和参数值
JavaScript 默认参数
JavaScript Function() 构造函数
JavaScript 函数提升
JavaScript 自执行函数
JavaScript 箭头函数
JavaScript 函数调用
JavaScript call() 方法
JavaScript apply() 方法
JavaScript bind() 方法
JavaScript 闭包
JavaScript 作用域
JavaScript 全局变量
JavaScript 智能函数参数

对象

JavaScript Number 对象
JavaScript Boolean 对象
JavaScript String 对象
JavaScript 数组对象
JavaScript 日期对象
JavaScript DataView 对象
JavaScript 处理程序
JavaScript Math 对象
JavaScript 正则表达式
JavaScript Symbol 类型
JavaScript Set 对象
JavaScript WeakSet 对象
JavaScript Map 对象
JavaScript WeakMap 对象
JavaScript 可迭代对象
JavaScript Reflect 对象
JavaScript TypedArray
JavaScript 模板字面量
JavaScript 标记模板

面向对象

JavaScript 对象
JavaScript 类
JavaScript 对象属性
JavaScript 对象方法
JavaScript 静态方法
JavaScript 显示对象
JavaScript 对象访问器属性
JavaScript 对象构造器
JavaScript 原型(Prototype)
JavaScript ES5 对象方法
JavaScript 封装
JavaScript 继承
JavaScript 抽象
JavaScript 多态
JavaScript 解构赋值
JavaScript 数组解构
JavaScript 嵌套解构
JavaScript 可选链
JavaScript 全局对象
JavaScript mixins
JavaScript 代理(Proxy)

Cookies

JavaScript Cookies操作
JavaScript Cookie 属性
JavaScript 删除 Cookies

浏览器 BOM

JavaScript 浏览器对象模型(BOM)
JavaScript 窗口对象
JavaScript Document 对象
JavaScript 屏幕对象
JavaScript Window History 对象
JavaScript Navigator 对象
JavaScript Location 对象
JavaScript Console 对象

Web APIs

JavaScript Web API
JavaScript History API
JavaScript 存储 API
JavaScript Forms API
JavaScript Worker API
JavaScript Fetch API
JavaScript 定位 API

事件

JavaScript 事件
JavaScript DOM 事件
JavaScript addEventListener()
JavaScript 鼠标事件
JavaScript 键盘事件
JavaScript 表单事件
JavaScript 窗口事件
JavaScript 事件委托
JavaScript 事件冒泡
JavaScript 事件捕获
JavaScript 自定义事件

错误处理

JavaScript 错误处理
JavaScript try-catch
JavaScript 调试
JavaScript 自定义错误
JavaScript 扩展错误

重要关键字

JavaScript this'关键字
JavaScript void 关键字
JavaScript new 关键字
JavaScript var 关键字

HTML DOM

JavaScript HTML DOM
JavaScript DOM 方法
JavaScript 文档对象
JavaScript DOM 元素
JavaScript 文档表单
JavaScript 更改 HTML
JavaScript 更改 CSS
JavaScript DOM 动画
JavaScript DOM 导航
JavaScript DOM 集合
JavaScript 节点列表

杂项

JavaScript Ajax
JavaScript 异步迭代
JavaScript Atomics 对象
JavaScript 剩余参数
JavaScript 页面重定向
JavaScript 对话框
JavaScript 打印网页
JavaScript 表单验证
JavaScript 创建动画
JavaScript 多媒体
JavaScript 图像地图
JavaScript 浏览器兼容性
JavaScript JSON
JavaScript 多行字符串
JavaScript 浅拷贝
JavaScript 日期格式
JavaScript 获取日期方法
JavaScript 调用栈
JavaScript 引用类型
JavaScript 设置日期方法
JavaScript 模块
JavaScript IndexedDB
JavaScript clickjacking(点击劫持)
JavaScript 动态导入
JavaScript BigInt
JavaScript 柯里化(Currying)
JavaScript 图形库
JavaScript Blob
JavaScript Unicode
JavaScript 绘制图形
JavaScript 防抖
JavaScript 性能
JavaScript 编码规范

JavaScript 函数参数和参数值


上一章 下一章

JavaScript 中的函数参数是在函数定义中括号内列出的变量。一个函数可以有多个由逗号分隔的参数。当函数被调用时传递给函数的值被称为参数值。我们通过定义参数来定义函数,并通过传递参数值来调用函数。

传递给函数的参数值数量必须与函数定义中的参数数量匹配。如果不匹配,可能会得到意想不到的结果。

语法

在 JavaScript 中使用函数参数的语法如下:

function functionName (parameter1, parameter2, parameter3) {
  // 语句
}

在上述语法中,函数参数是 parameter1, parameter2, 和 parameter3。

参数规则

JavaScript 函数在调用时不会检查传递的参数值的数量。

不需要指定函数参数的数据类型。

JavaScript 编译器不会对传递给函数的参数值执行类型检查。

JavaScript 中的函数参数值是指在调用函数时传递给函数的变量或值。

functionName (10, b, 'Hello');

在上述语法中,第一个参数值是数字数据类型,第三个是字符串数据类型。第二个参数值是变量,该变量在代码中早些时候定义过。

示例:函数参数和参数值

在下面的代码中,mult() 函数有四个参数。你可以注意到参数的类型并未定义。我们在函数体中将参数值相乘,并返回结果值。

在调用函数时,我们传递了四个数字作为函数的参数值。用户可以观察函数对于不同参数值的输出。

<html>
<body>
   <p id="output"> </p>
   <script>
      function mult(a, b, c) {
         let res = a * b * c;
         return res;
      }
      let ans = mult(2, 3, 4);
      document.getElementById("output").innerHTML = 
   "2, 3, 和 4 的乘积是 " + ans;
   
</script>
</body>
</html>

输出:

2, 3, 和 4 的乘积是 24

参数对象

在 JavaScript 中,每个函数都可以有一个 arguments 对象。它包含了在调用函数时以数组形式传递的所有参数值。即使函数的参数未定义,我们也可以遍历这个数组来获取每一个参数值。

示例

在下面的示例中,函数定义中没有包含任何参数,但在调用函数时我们传递了四个参数值。因此,我们在函数体中使用循环遍历 arguments[] 数组来逐个访问所有的参数值。

在函数体中,我们将所有参数值合并并返回最终的字符串。

<html>
<body>
   <p id="output"> </p>
   <script>
      function merge() {
         let final = "";
         for (let p = 0; p < arguments.length; p++) {
            final += arguments[p] + " ";
         }
         return final;
      }
      let ans = merge("Hi", "I", "am", "John!");
      document.getElementById("output").innerHTML = 
   "合并后的字符串是: " + ans;
   
</script>
</body>
</html>

输出:

合并后的字符串是: Hi I am John!

按值传递参数

在函数中,当你按值传递参数到函数调用时,它将参数值发送给函数定义中的参数。因此,当你更新函数参数时,函数的参数值不会改变。

示例

在下面的代码中,我们在函数外部定义了 val1 和 val2 变量,并将它们作为函数的参数值传递。

在函数体中,我们更改了参数值。在输出中,你可以看到即使更新了参数值,val1 和 val2 的实际值也没有改变。

<html>
<head>
   <title> JavaScript - 参数值按值传递 </title>
</head>
<body>
   <p id="output"> </p>
   <script>
      const output = document.getElementById("output");
      function update(val1, val2) {
         val1 = 20;
         val2 = 30;
      }

      var val1 = "Hello";
      var val2 = "World";

      output.innerHTML += "调用函数之前!<br>";
      output.innerHTML += "val1 = " + val1 + ", val2 = " + val2 + "<br>";

      update(val1, val2);

      output.innerHTML += "调用函数之后!<br>";
      output.innerHTML += "val1 = " + val1 + ", val2 = " + val2 + "<br>";
    
</script>
</body>
</html>

输出:

调用函数之前!
val1 = Hello, val2 = World
调用函数之后!
val1 = Hello, val2 = World

按引用传递参数

当你传递一个对象作为参数值时,函数将对象的地址作为参数发送给函数定义。因此,这被称为参数值按引用传递。

在函数体中,如果你更改了对象的属性,那么在函数外部也会反映出来。

示例

在下面的代码中,我们将 obj 对象作为函数的参数值传递。在函数体中,我们更改了对象的 domain 属性的值。

在输出中,你可以看到即使在调用函数之后,domain 属性的值发生了变化,因为对象是按引用传递的。

<html>
<head>
   <title> JavaScript - 参数值按引用传递 </title>
</head>
<body>
   <p id="output"> </p>
   <script>
      const output = document.getElementById("output");
      function update(obj) {
         obj.domain = "yoagoa.com";
      }
      var obj = {
         domain: "www.google.com",
      }
      output.innerHTML += "调用函数之前!<br>";
      output.innerHTML += "domain = " + obj.domain + "<br>";
      update(obj);
      output.innerHTML += "调用函数之后!<br>";
      output.innerHTML += "domain = " + obj.domain + "<br>";
    
</script>
</body>
</html>

输出:

调用函数之前!
domain = www.google.com
调用函数之后!
domain = yoagoa.com
上一章 下一章
阅读号二维码

关注阅读号

联系二维码

联系我们

© 2024 Yoagoa. All rights reserved.

粤ICP备18007391号

站点地图