摘要：对象方法当用作对象属性时，函数称为方法箭头函数中的当箭头函数与常规函数用作对象方法时，有一个重要的行为。这是因为的处理在两个函数声明样式中是不同的。会将函数移动到其范围的顶部。变量声明被提升，但不是值，因此不是函数。
简介
JavaScript中的所有内容都发生在函数中。
函数是一个代码块，可以定义一次并随时运行。
函数可以选择接受参数，并返回一个值。
JavaScript中的函数是对象，一种特殊的对象：函数对象。
另外，函数被称为第一类函数，因为它们可以被赋值给一个值，它们可以作为参数传递并用作返回值。
句法让我们从“旧的”，ES6 / ES2015之前的语法开始。这是一个函数声明：
function dosomething(foo) {
// do something
}
（现在，在ES6 / ES2015世界中，被称为常规函数）
函数可以分配给变量（这称为函数表达式）：
const dosomething = function(foo) {
// do something
}
命名函数表达式类似，但在堆栈调用跟踪中更好用，这在发生错误时很有用 - 它保存函数的名称：
const dosomething = function dosomething(foo) {
// do something
}
ES6 / ES2015引入了箭头函数，在使用内联函数时，特别适合用作参数或回调函数：
const dosomething = foo => {
//do something
}
箭头函数与上面的其他函数定义有很大的不同，我们稍后会解释。
参数一个函数可以有一个或多个参数。
const dosomething = () => {
//do something
}
const dosomethingElse = foo => {
//do something
}
const dosomethingElseAgain = (foo, bar) => {
//do something
}
从ES6 / ES2015开始，函数可以具有参数的默认值：
const dosomething = (foo = 1, bar = "hey") => {
//do something
}
这允许您在不填充所有参数的情况下调用函数：
dosomething(3) dosomething()
ES2018引入了参数的尾随逗号，这个功能有助于减少因移动参数时丢失逗号而导致的错误（例如，移动中间的最后一个）：
const dosomething = (foo = 1, bar = "hey") => {
//do something
}
dosomething(2, "ho!")
您可以将所有参数包装在一个数组中，并在调用函数时使用spread运算符：
const dosomething = (foo = 1, bar = "hey") => {
//do something
}
const args = [2, "ho!"]
dosomething(...args)
当使用许多参数的时候，记住这些参数可能很困难。这里可以使用对象，解构保留参数名称：
const dosomething = ({ foo = 1, bar = "hey" }) => {
//do something
console.log(foo) // 2
console.log(bar) // "ho!"
}
const args = { foo: 2, bar: "ho!" }
dosomething(args)
返回值
每个函数都返回一个值，默认情况下为“undefined”。
任何函数在其代码行结束时，或者当执行流找到return关键字时终止。
当JavaScript遇到此关键字时，它退出函数执行并将控制权交还给其调用者。
如果传递一个值，则该值将作为函数的结果返回：
const dosomething = () => {
return "test"
}
const result = dosomething() // result === "test"
您只能返回一个值。
要_模拟_返回多个值，您可以返回对象文字或数组，并在调用时使用解构赋值功能。
使用数组：
使用对象：
嵌套函数可以在其他函数中定义函数：
const dosomething = () => {
const dosomethingelse = () => {}
dosomethingelse()
return "test"
}
嵌套函数的作用域是外部函数，不能从外部调用。对象方法
当用作对象属性时，函数称为方法：
const car = {
brand: "Ford",
model: "Fiesta",
start: function() {
console.log(Started)
}
}
car.start()
箭头函数中的this
当箭头函数与常规函数用作对象方法时，有一个重要的行为。考虑这个例子：
const car = {
brand: "Ford",
model: "Fiesta",
start: function() {
console.log(Started ${this.brand} ${this.model})
},
stop: () => {
console.log(Stopped ${this.brand} ${this.model})
}
}
stop（）方法不能像你期望的那样工作。
这是因为this的处理在两个函数声明样式中是不同的。箭头函数中的this指的是封闭函数上下文，在本例中是window对象
this，使用function（）引用宿主对象
这意味着箭头函数不适合用于对象方法和构造函数（箭头函数构造函数实际上会在调用时引发TypeError）。
IIFE，立即调用函数表达式IIFE是一个在声明后立即执行的功能：
;(function dosomething() {
console.log("executed")
})()
您可以将结果分配给变量：
const something = (function dosomething() {
return "something"
})()
它们非常方便，因为您无需在定义后多带带调用该函数。
Function 挂载执行代码之前的JavaScript会根据某些规则对其进行重新排序。
会将函数移动到其范围的顶部。这就是下面例子不会报错的原因;
dosomething()
function dosomething() {
console.log("did something")
}
在内部，JavaScript在调用之前移动函数，以及在同一范围内找到的所有其他函数：
function dosomething() {
console.log("did something")
}
dosomething()
现在，如果你使用命名函数表达式，因为你正在使用变量，会发生不同的事情。变量声明被提升，但不是值，因此不是函数。
dosomething()
const dosomething = function dosomething() {
console.log("did something")
}
不会工作：
这是因为内部发生的事情是：
const dosomething
dosomething()
dosomething = function dosomething() {
console.log("did something")
}
“let”声明也是如此。var声明也不起作用，但是报的不是同样的错误：
这是因为var声明被提升并用undefined作为值初始化，而const和let被提升但未初始化。
文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。
转载请注明本文地址：https://www.ucloud.cn/yun/52970.html
摘要：对象方法当用作对象属性时，函数称为方法箭头函数中的当箭头函数与常规函数用作对象方法时，有一个重要的行为。这是因为的处理在两个函数声明样式中是不同的。会将函数移动到其范围的顶部。变量声明被提升，但不是值，因此不是函数。 简介 JavaScript中的所有内容都发生在函数中。 函数是一个代码块，可以定义一次并随时运行。 函数可以选择接受参数，并返回一个值。 JavaScript中的函数是对...
摘要：以下例子的目的是使用来展示一个每秒都会更新的时钟当尝试在的回调中使用来引用元素时，很不幸，我们得到的只是一个属于回调函数自身上下文的。 前言 胖箭头函数（Fat arrow functions），又称箭头函数，是一个来自ECMAScript 2015（又称ES6）的全新特性。有传闻说，箭头函数的语法=>，是受到了CoffeeScript 的影响，并且它与CoffeeScript中的=>...
摘要：回顾我们先来回顾下箭头函数的基本语法。主要区别包括没有箭头函数没有，所以需要通过查找作用域链来确定的值。箭头函数并没有方法，不能被用作构造函数，如果通过的方式调用，会报错。 回顾 我们先来回顾下箭头函数的基本语法。 ES6 增加了箭头函数： let func = value => value; 相当于： let func = function (value) { return ...
摘要：注意箭头函数有几个使用注意点不可以使用对象，该对象在函数体内不存在。不可以当作构造函数，也就是说，不可以使用命令，否则会抛出一个错误。不可以使用命令，因此箭头函数不能用作函数。 前言 在JavaScript的世界中函数被誉为一等公民，每当我们需要在JS定义一个新的函数，我们都会毫不犹豫的function() {}，也许我们可以开始换一种方式来定义一个函数，也就是本文的主角箭头函数，一个...
阅读 3692·2023-04-25 17:45
阅读 3349·2021-09-04 16:40
阅读 982·2019-08-30 13:54
阅读 2103·2019-08-29 12:59
阅读 1375·2019-08-26 12:11
阅读 3257·2019-08-23 15:17
阅读 1490·2019-08-23 12:07
阅读 3851·2019-08-22 18:00
