JavaScript学习笔记(四)

JavaScript学习笔记(四)

本文为黑马程序员JavaScript视频学习笔记

函数

函数是被设计执行特定任务的代码块，函数可以吧具有相同或相似逻辑的代码包裹起来，通过函数调用执行这些被包裹的代码逻辑，其优势在于精简代码，方便复用。

函数使用

函数声明语法

function 函数名(){
  函数体
}

function sayHi(){
  console.log("Hi~")
}

函数名命名规范

• 和变量命名基本一致
• 尽量小驼峰式命名法
• 前缀应该为动词
• 命名建议：常用动词约定

动词	含义
can	判断是否可执行某个动作
has	判断是否含义某个值
is	判断是否为某个值
get	获取某个值
set	设置某个值
load	加载某些数据

函数的调用语法

函数名()

sayHi()

函数传参

function 函数名参数列表(){
  函数体
}

function getSum(num1, num2){
  document.write(num1 + num2)
}

• 形参：声明函数时写在函数名右边小括号里的叫形参
• 实参：调用函数时写在函数名右边小括号里的叫实参

参数默认值

如果一个参数在调用的时候没有传入值，那么其默认为undefined。问你可以手动给形参设定默认值，通过在声明函数的时候，在形参后面直接等于一个值

function getSum(num1 = 0, num2 = 0){
  document.write(num1 + num2)
}

例题：学生的分数是一个数组，计算每个学生的总分

function getArrSum(arr = []){ // 传入默认值
  let sum = 0
  for(let i = 0; i<arr.length;i++){
    sum += arr[i]
  }
  console.log(sum)
}

函数返回值

当函数需要返回数据出去时，用return关键字

语法：return 数据

function getSum(num1 = 0, num2 = 0){
  return sum1 + sum2
}
sum = getSum(10, 10)
document.write(sum)

作用域

一段程序代码中所用到的变量并不总是有效可用的，而限定这个名字的可用性的代码范围就是这个名字的作用域。作用域的使用提高了程序逻辑的局部性，增强了程序的可靠性，减少了名字冲突。分为：

• 全局作用域：作用与所有代码执行的环境
• 局部作用域：作用与函数内的代码环境

根据作用域不同，变量可以分为：

• 全局变量：
  • 函数外let的变量
  • 全局变量在任何区域都可以访问和修改
• 局部变量：
  • 函数内部let的变量
  • 局部变量只能在当前函数内部访问和修改

for循环括号中声明的变量也是局部变量

如果函数内部，变量没有声明，直接赋值，也当全局变量来看

变量访问原则

• 只要是代码，就至少有一个作用域
• 写在函数内部的就是局部作用域
• 如果函数中还有函数，那么在这个作用域中就又可以诞生一个作用域
• 访问原则：在能够访问的情况下，先局部，局部没有在找全局

匿名函数

没有名字的函数，无法直接使用。使用方式：

• 函数表达式
• 立即执行函数

函数表达式

将匿名函数赋值给一个变量，并且通过变量名称进行调用，语法：

let fn = function{
  函数体
}

let fn = function(x, y){
  console.log(x + y)
}
fn(1, 2)

具名函数的调用可以写在任何位置，函数表达式的调用只能在声明之后

立即执行函数

场景：避免全局变量之间的污染

语法：

// 方法一
(function(){console.log(11)})();
// 方法二
(function(){console.log(11)}());

立即执行函数后面必须加分号

本质上最后面的小括号是在调用函数，function后面的小括号是传入参数

(function(x, y){consloe.log(x + y)})(1, 2);

案例：计算时间函数，根据用户输入的秒数，计算时分秒的倒计时效果

let s = prompt("请输入时间")

function getTime(t){
  let h = parseInt(t/60/60%24)
  let m = parseInt(t/60%60)
  let s = parseInt(t%60)
  h = h < 10 ? '0' + h : h
  m = m < 10 ? '0' + m : m
  s = s < 10 ? '0' + s : s
  return `转换完毕后是${h}小时${m}分${s}秒`
}
let str = getTime(s)
document.write(str)
console.log(h)

逻辑中断

逻辑中断的核心原理是短路行为，即在布尔运算中，一旦结果已可确定，后续表达式就不会再被计算。主要有两种情况：

• &&（逻辑与）：A && B
  • 如果 A 为 false，则整个表达式返回 A（不会执行 B，即中断）
  • 如果 A 为 true，则继续执行 B，返回 B 的值
• ||（逻辑或）
  • 如果 A 为 true，则整个表达式返回 A（不会执行 B，即中断）
  • 如果 A 为 false，则继续执行 B，返回 B 的值

console.log(11 && 22) // 都是真，返回最后一个真值
console.log(11 || 22) // 输出第一个真值