2021年7月15日星期四

【前端】JavaScript学习笔记（三）——函数

✨课程链接

【狂神说Java】JavaScript最新教程通俗易懂_哔哩哔哩_bilibili

✨学习笔记

定义函数

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <script>  // 定义方式一  function abs(x) {   // 手动抛出异常   if(typeof x !== "number"){    throw "Not a Number"   }   console.log("x=>"+x)   console.log("arguments:")   for(let argu of arguments){    console.log(argu)   }   if(arguments.length == 2){    console.log("argu2:"+arguments[1])   }   if(x > 0){    return x   }   else {    return -x   }  }    // 定义方式二  // function (x){...}是一个匿名函数 但是可以把结果赋值给abs 通过abs就可以调用函数  // var abs = function (x) {  //  if(x > 0){  //   return x  //  }  //  else {  //   return -x  //  }  // }  abs(10)  abs(10, 11, 12)  // 参数问题:JavaScript可以传任意个参数  // 参数是否存在的问题？  // 假设不存在参数 如何规避 -> 手动抛出异常  // arguments 代表传递进来的所有的参数 是一个数组 </script></head><body></body></html>

多个参数的问题

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head> <script>  // ES6引入的新特性 获取除了已经定义的参数之外的所有参数  function f(a, b,...rest) {   // if(arguments.length > 2){   //  for (let i = 2; i < arguments.length; i++){   //   console.log("不使用rest的方式")   //  }   // }   console.log("a=>"+a)   console.log("b=>"+b)   // rest参数只能写在最后面 必须用...标识   console.log(rest)  }  f(1, 2, 3, 4, 5) </script><body></body></html>

变量的作用域

在JavaScript中 var定义的变量实际是有作用域的

假设在函数体中声明则在函数体外不可以使用（非要想实现可以研究闭包）

"use strict"function f() { var x = 1 x = x + 1}x = x +2 // Uncaught ReferenceError: x is not defined

如果两个函数使用了相同的变量名只要在函数内部就不冲突

function f() { var x = 1 x = x + 1}function f2() { var x = 1 x = x + 1}

内部函数可以访问外部函数成员反之则不行

function f() { var x = 1 // 内部函数可以访问外部函数成员 反之则不行 function f2() {  var y = x + 1 } var z = y + 1 // Uncaught ReferenceError: y is not defined}

假设内部函数变量和外部函数变量重名

function f() { var x = 1 function f2() {  var x = "A"  console.log("inner" + x) } console.log("outer" + x) f2()}f()

JavaScript中函数查找变量从自身函数开始 由内向外 查找

假设外部存在这个同名的函数变量则内部函数回屏蔽外部函数的变量

提升变量的作用域

function f() { var x = "x, y:" + y console.log(x) var y = "y"}f()

output：x, y:undefined

说明：JS执行引擎，自动提升了y的声明，但是不会提升变量y的赋值

这个是在JavaScript建立之初就存在的特性。

养成规范：所有的变量定义都放在函数的头部，不要乱放，便于代码维护;

全局变量

// 全局变量var x = 1function f() { console.log(x)}f()console.log(x)

全局对象

var x = "xxx"alert(x)alert(window.x) // 默认所有的全局变量 都会自动绑定在 windows对象下

alert()这个函数本身也是 windows 的一个变量

var x = "xxx"window.alert(x)var oldAlert = window.alert// oldAlert(x)window.alert = function () {}// 此时alert失效 不弹窗window.alert("失效")// 恢复window.alert = oldAlertwindow.alert("已恢复")

JavaScript 实际上只有一个全局作用域，任何变量(函数也可以视为变量)，假设没有在函数作用范围内找到，就会向外查找,如果在全局作用域都没有找到，报错 ReferenceError

规范

由于我们所有的全局变量都会绑定到我们的window上。

如果不同的js文件，使用了相同的全局变量，产生冲突 -> 如何能够减少冲突

// 唯一全局变量var Demo = {}// 定义全局变量Demo.name = "demo"Demo.add = function (a, b) { return a + b}

......

原文转载：http://www.shaoqun.com/a/879515.html

跨境电商：https://www.ikjzd.com/

www.made-in-china.com：https://www.ikjzd.com/w/2777

声网：https://www.ikjzd.com/w/2176

cicpa考试：https://www.ikjzd.com/w/1375

星空女人频道