JavaScript函数的基本使用

简介: 术语foobar, foo, bar, baz 和qux经常在计算机编程或计算机相关的文档中被用作占位符的名字。当变量,函数,或命令本身不太重要的时候,foobar, foo, bar, baz 和qux就被用来充当这些实体的名字,这样做的目的仅仅是阐述一个概念,说明一个想法。这些术语本身相对于使用的场景来说没有任何意义。

image.png


先补充一点小知识:


术语foobar, foo, bar, bazqux经常在计算机编程或计算机相关的文档中被用作占位符的名字。当变量,函数,或命令本身不太重要的时候,foobar, foo, bar, bazqux就被用来充当这些实体的名字,这样做的目的仅仅是阐述一个概念,说明一个想法。这些术语本身相对于使用的场景来说没有任何意义。


1 函数的使用步骤:


  • 函数的使用包含两个步骤:
  • 声明函数 —— 封装 独立的功能
  • 调用函数 —— 享受 封装 的成果
  • 声明函数,在JavaScript中也可以称为定义函数:
  • 声明函数的过程是对某些功能的封装过程;
  • 调用函数,也可以称为函数调用:
  • 调用函数是让已存在的函数为我们所用;
  • 这些函数可以是刚刚自己封装好的某个功能函数;
  • 也可以去使用默认提供的或者其他三方库定义好的函数;
  • 函数的作用:
  • 在开发程序时,使用函数可以提高编写的效率以及代码的重用;
  • 声明函数使用function关键字:这种写法称之为函数的定义


function 函数名(形参 parameter) {
  封装的代码
}


  • 注意:
  • 函数名的命名规则和前面变量名的命名规则是相同的;
  • 函数要尽量做到见名知意(并且函数通常是一些行为(action),所以使用动词会更多一些);
  • 函数定义完后里面的代码是不会执行的,函数必须调用才会执行;
  • 调用函数通过 函数名(实参 argument)  即可
  • 形参和实参
  • 形参(参数 parameter):定义 函数时,小括号中的参数,是用来接收参数用的,在函数内部 作为变量使用
  • 实参(参数 argument):调用 函数时,小括号中的参数,是用来把数据传递到函数内部用的
  • 练习: sayHello,求和
function sayHello(name) {
  console.log(`Hello, ${name}`)
}
sayHello('八戒')
function sum(a, b) {
  console.log(`${a + b}`)
}
sum(6, 6)
  • 函数返回值:
  • 回想我们之前使用的prompt函数,函数需要接受参数,并且会返回用户的输入
  • 所以说, 函数不仅仅可以有参数, 也可以有返回值:
  • 使用return关键字来返回结果;
  • 一旦在函数中执行return操作,那么当前函数会终止;
  • 如果函数中没有使用 return语句 ,那么函数有默认的返回值:undefined;
  • 如果函数使用 return 语句,但是return后面没有任何值,那么函数的返回值也是:undefined;


2 arguments 参数


直接看代码:


// 1.arguments的认识
function foo(name, age) {
  console.log("传入的参数", name, age)
  // 在函数中都存在一个变量, 叫arguments
  console.log(arguments)
  // arguments是一个对象
  console.log(typeof arguments) // object
  // 对象内部包含了所有传入的参数
  // console.log(arguments[0])
  // console.log(arguments[1])
  // console.log(arguments[2])
  // console.log(arguments[3])
  // 对arguments来进行遍历
  for (var i = 0; i < arguments.length; i++) {
    console.log(arguments[i])
  }
}
foo("bajie", 28, 1.6, "高老庄")
// 2.arguments的案例
function sum() {
  var total = 0
  for (var i = 0; i < arguments.length; i++) {
    var num = arguments[i]
    total += num
  }
  return total
}
console.log(sum(10, 20))
console.log(sum(10, 20, 30))
console.log(sum(10, 20, 30, 40))


目录
相关文章
|
6天前
|
JavaScript
js export 对外输出常量、变量和函数
js export 对外输出常量、变量和函数
12 5
|
5天前
|
JavaScript
js函数封装 —— 金额添加千分位分隔符
js函数封装 —— 金额添加千分位分隔符
10 2
|
5天前
|
JavaScript 前端开发 网络架构
JavaScript编码之路【对象的增强、ES6新特性之函数的默认值设置 、rest参数 (剩余参数)、拓展运算符、对象与数组的解构赋值】
JavaScript编码之路【对象的增强、ES6新特性之函数的默认值设置 、rest参数 (剩余参数)、拓展运算符、对象与数组的解构赋值】
11 1
|
11天前
|
JavaScript 前端开发
JavaScript作用域关乎变量和函数的可见范围。
【6月更文挑战第27天】JavaScript作用域关乎变量和函数的可见范围。全局作用域适用于整个脚本,局部作用域限于函数内部,而ES6引入的`let`和`const`实现了块级作用域。全局变量易引发冲突和内存占用,局部作用域在函数执行后消失,块级作用域提高了变量管理的灵活性。作用域关键在于组织代码和管理变量生命周期。
18 1
|
2天前
|
JavaScript
js 延时执行代码的最佳实践 —— 自定义 sleep 函数
js 延时执行代码的最佳实践 —— 自定义 sleep 函数
3 0
|
3天前
|
JavaScript
js 高频实用函数封装汇总(持续更新)
js 高频实用函数封装汇总(持续更新)
6 0
|
4天前
|
JavaScript
js 数组移除指定元素【函数封装】(含对象数组移除指定元素)
js 数组移除指定元素【函数封装】(含对象数组移除指定元素)
4 0
|
4天前
|
JavaScript
js 调试 —— 断点(含进入函数、条件断点等)
js 调试 —— 断点(含进入函数、条件断点等)
11 0
|
4天前
|
JavaScript
JS【详解】函数.bind()
JS【详解】函数.bind()
4 0
|
4天前
|
JavaScript
js 【详解】函数中的 this 指向
js 【详解】函数中的 this 指向
5 0