函数是 ECMAScript 的核心,可以用来包装的一个代码块,具备一定的功能,可以执行特定的任务或计算值的语句。定义一次 可执行多次。
函数定义(也称为函数声明,或函数语句)由一系列的function关键字组成,依次为:
函数的名称。
函数参数列表,包围在圆括号中并由逗号分隔。
定义函数的 JavaScript 语句,用大括号{}括起来。
当定义一个函数的时候开辟了一个新的堆内存 然后把函数中的代码转成字符串存到了堆内存中 最后把堆内存的地址,赋值给函数名或者变量
在函数调用的时候,函数内形成一个执行栈 把函数代码块内的字符串代码拷贝一份放到执行栈中执行 参数赋值 执行上下文 预解析的机制 函数内的变量销毁
直接写匿名函数是会报错的。
如何避免报错呢? 1.声明函数时要有名字2.匿名函数要为一个表达式函数名()代表函数执行。定义一个函数,可以重复执行多次。 函数的调用(只有函数才能调用,不然就报错)
函数名 + 括号事件调用 一般是赋值一个匿名函数或者是赋值一个函数(名)地址定时器调用 setTimeout(function(){},1000) setInterval(function(){},1000) // 1、函数名 + 括号调用 fn() function fn () { console.log('hello') } fn() // 函数执行 fn() //2、事件调用(举例,点击事件) document.onclick = function(){ alert('1'); } //3、定时器调用 setTimeout(function(){},1000) setInterval(function(){},1000)对于函数表达式 必须在定义后才能调用
fn() // 报错 Uncaught TypeError: fn is not a function var fn = function () { console.log('hello') } fn() // 成功执行在调用函数时,您可以向其传递值,这些值被称为参数。
函数可以通过定义时设定形参来接收调用时传递的参数
// param1 和 param2 都是形参 function fn (param1, param2) { console.log(param1, param2) // 1, 2 } fn(1, 2) // 自执行函数 (function (num) { console.log(num) // 100 })(100)每个函数里都一个属于自己的实参集合arguments
arguments是个类数组里面存储着函数调用时传递进来的所有参数
// 命名函数 function fn (param1, param2) { // Arguments(2) [1, 2, callee: ƒ, Symbol(Symbol.iterator): ƒ] console.log(arguments) } fn(1, 2)当函数程序运行后 外部想要拿到内部结果时 可通过return关键字来指定,如果不指定return 函数执行后默认返回undefined
// 将计算的结果返回 并结束函数执行 return param1 + param2 } var sum = fn(1, 2) console.log(sum) // 3return 后面指定什么就将什么返回,函数使用return语句后,这个函数会在执行完 return 语句之后停止并立即退出,也就是说return后面的所有其他代码都不会再执行,所以函数返回具有切断函数执行的功能
根据相应的浏览器行为(点击、滑过),执行相应动作。
<body> <button id="btn">点我</button> <script> var btn = document.getElementById('btn') // 给按钮绑定一个点击事件 btn.onclick = function() { // 当这个按钮被点击时,会执行这个函数 alert('点我! 点我!') }; </script> </body> </html>在事件函数中存在一个内置关键字 this,代表当前绑定事件的元素对象
<body> <button id="btn">点我</button> <script> // 获取元素 var btn = document.querySelector('#btn') // 给元素绑定点击事件 btn.onclick = function () { // 这个事件函数中的this 代表当前btn这个元素对象 它两是同一个人 console.log(this === btn) // true console.log(this) // 就是btn这个元素对象 } </script> </body>