JS笔记-函数

一、函数

函数是一个复杂数据类型。可以将重复使用的代码进行封装,实现代码的复用。

使用function关键字声明一个函数。

语法格式:

function 函数名() {}

function foo() {
    
    
  // 代码
}
// function 声明函数的关键字,表示接下来是一个函数
// foo 函数名(自己定义名字)
// () 用来传参数的位置
// {} 写代码的位置

在使用函数的时候,必须要调用才可以。
调用语法格式:

函数名()

所谓的函数调用就是让函数大括号中的代码执行。

函数的参数:

参数的本质就是一个变量,它位于函数小括号
语法格式:

function 函数名(参数1,参数2,…参数n){}

  • 参数的命名规则和变量命名规则一致。

形式参数

形式参数可以设置默认值,语法格式:

function 函数名(参数1 = 默认值1,参数2 = 默认值2){}

函数的返回值(执行结果)

函数默认情况下执行结果为:undefined。
除非在函数内部使用return才可以改变计算结果(返回值),return后面跟什么内容,结果就是什么内容。
举例说明:

function foo() {
    
    
  return [1,2,3]
}
// return一次只能有一个结果

return包含两层含义

  • 返回一个结果
  • 让函数停止执行(return之后的代码不再执行)

1.定义函数

1.1 声明式

 function foo() {
    
    
   var obj = '可乐'
   console.log('我是foo')
 }
 function foo1() {
    
      
   console.log('我是foo1')
 }

1.2 赋值式

var foo2 = function() {
    
    
  consloe.log('我是foo2')
}

声明式和赋值式的区别:

  • 声明式可以先调用再定义。
  • 赋值式先定义再调用。

2.调用函数

foo()
foo1()
foo2()

3.案例

求两个数的和:

function obj( ) {
    
    

  let x = 5;

  let y = 5;

  let z = x + y;

  console.log(z)

}
obj()

4.参数

函数的参数其实就是一个变量,写在函数的()中。
语法格式为:

function 函数名(参数1,参数2,参数n…) { }

1.语法格式为:

function 函数名(参数1,参数2,参数n...) {
    
     }

// 如果一个变量没有被赋值,那么这个值就是 undefind
function arr(x, y) {
    
    

  console.log(x, y);

}
arr() // undefind undefind

// 2.在调用函数的时候为参数进行赋值

function arr(x, y) {
    
    

  console.log(x, y);
  
  let z = x + y;
  
  console.log(z);

}

arr(510) // 15
arr(230) // 32

5.参数相关的术语

  • 实参:实际的参数
  • 形参:形式的参数
  • 定义函数时,小括号中的参数叫形参,调用函数时小括号中的叫实参。
function arr(x, y) {
    
     // 形参

  console.log(x, y);
  
  let z = x + y;
  
  console.log(z);

}

arr(510) // 实参

6.函数参数练习

练习一:函数求和

用户输入两个数字:

let x = +promp('请输入一个数字:')

let y = +promp('请再输入一个数字:')

通过函数计算求和

function arr(a, b) {
    
    
  let z = a + b;
  console.log(c)
}

函数的调用

arr(x, y)

练习二:求数组中的和(使用参数来实现)

let num = [10, 21, 54, 23, 98, 12]

function obj() {
    
    
  let s = 0;
  for(let i = 0; i < num.length; i++) {
    
    
    s += number[i]
  }
}
obj()

练习三:求任意数组中的和(使用参数来实现)

let num = [10, 21, 54, 23, 98, 12]
let num1 = [17, 21, 34, 21, 96, 14]

function obj(arr) {
    
    
  let s = 0;
  for(let i = 0; i < arr.length; i++) {
    
    
    s += arr[i]
  }
  console.log(s)
}
obj(num)
obj(num1)

参数:任意的时候就会用到参数

7.参数的默认值

参数是一个变量,在没有赋值的时候可以给它一个默认值。

不严谨的写法:

function arr(name) {
    
    
  console.log('你好' + name)
}
arr('黄昏') // 你好黄昏
// 如果一个变量只声明了,但是没有赋值,那么他的值就是undefined
arr() // 你好undefined

严谨的写法:

使用参数的默认值是为了让函数的逻辑更严谨

function arr(name = '黄昏终结者') {
    
    
  console.log('你好' + name)
}
arr('黄昏') // 你好黄昏
arr() // 你好黄昏终结者

语法格式:

function 函数名(参数 = 默认值) {
    
    }

函数支持中英文练习:

function sayHello(name, lang = 'zh') {
    
    
  // lang自定义变量。如果他的值为zh表示用中文打招呼,如果为en就用英文打招呼
  if(lang === 'zh') {
    
    
    console.log('你好' + name)
  } else if(lang === 'en') {
    
    
    console.log('Hi~' + name)
  }
}
sayHello('黄昏''zh') // 你好黄昏
sayHello('boss''en') // Hi~boss

sayHello('黄昏''en') // Hi~黄昏
sayHello('boss') // 你好boss

8.函数的返回值

函数的返回值就是函数本身执行的【结果】,【结果】是一个值。

// 二元运算
let x = 5 + 5; // 10(结果)

// 三元运算
let y = x > 5 ? '真' : '假'// 真(结果)

// 函数
// 一个函数的执行结果[默认]情况下为undefined
function obj() {
    
    
  console.log('一个函数')
}
let j = obj(); 
console.log(j); // undefined
// 改变函数的结果值需要用到函数的返回值,只需要在函数中使用return即可
function arr() {
    
    
  return 10;
}
let t = arr();
console.log(t); // 10
// 函数的return一次只能有1个返回值。如果需要返回多个值可以通过数组来实现。
function foo() {
    
    
  retun [1,2]
}
console.log(foo()); // [1,2]

分析之前用到的代码:

// 这是一个内置的函数,可以供开发者直接使用。
prompt('请输入一个数字:') // 实参

let n = prompt('请输入一个数字:');
console.log(n); // 执行结果就是用户输入的值

// 这是一个内置的函数,可以供开发者直接使用。
alert('这是一个警告')

let s = alert('这是一个警告');
console.log(s); // 结果是undefined

函数中是否需要有return取决于函数自身的功能。

数组:[12,8,6,13,21,7,30]

需求:将6从数组中删除

可以用splice(下标,1)

let numbers = [12,8,6,13,21,7,30]
// 先找到6的下标(封装成函数)
function arr(obj,num){
    
    
  let index;
  // 遍历查找某个单元
  for(let i = 0; i < obj.length; i++){
    
    
    if(obj[i] === num){
    
    
      index = i
      break
    } else {
    
    
      index = -1
    }
  }
  // 将结果返回到函数外部
  return index
}
let key = arr(numbers,6)
// 调用splice将其删除
numbers.splice(key,1)
console.log(numbers)

函数中使用了return后,后面的代码就不再执行。

function foo() {
    
    
  console.log('会执行') // 输出
  return // 终止函数的执行
  console.log('测试') // 不会输出
}
foo()

return两个含义:

  • 就是为了给函数添加一个返回值,那么后面需要跟一个值

  • 单纯只是让函数停止执行,后面啥也不写。

function foo() {
    
    
  console.log('会执行') // 输出
  return 1 // 终止函数的执行
  console.log('测试') // 不会输出
}
foo()

练习:
(1)用户输入100以内的数字

let ages = [];
function set (age) {
    
    

  // 第一种实现方式
  // if(age > 0 && age <= 100) {
    
    
  //   ages.push(age);
  // }
  
  // 第二种实现方式
  if(age < 0 || age > 100) {
    
    
    return;
  }
  ages.push(age);
}

(2)用户输入秒数,自动转换为时分秒

// 1小时是3600秒

// 封装一个函数能够将秒数转换为[时分秒]显示
function format(seconds) {
    
    
  // 将[秒]转换为[小时],parseInt(秒数/3600)
  let h = parseInt(seconds / 3600)
  // 将[秒]转换为[分钟],parseInt((秒数%3600)/60)
  let i = parseInt((seconds % 3600) / 60)
  // 将总的[秒]数转换成秒,seconds%60
  let s = seconds % 60
  return `时间为{h}:{i}:{s}`
}
// 用户输入的秒数
let seconds = +prompt('请输入一个秒数:')
let str = format(seconds)
console.log(str)

9.函数总结

  • 函数的返回值就是函数本身执行的【结果】,【结果】是一个值。

  • 一个函数的执行结果【默认】情况下为undefined。

  • 改变函数的结果值需要用到函数的返回值,只需要在函数中使用return即可。

  • 函数中使用了returnreturn之后所跟的内容就是函数的返回值,也叫函数的执行结果。

  • 函数的return一次只能有1个返回值。如果需要返回多个值可以通过数组来实现。

  • 函数中是否需要有return取决于函数自身的功能。

猜你喜欢

转载自blog.csdn.net/m0_62181310/article/details/127908752
今日推荐