太阳鱼吃什么食物

Baseline Widely available
百度 1月4日,在接受科技日报记者采访时,武传松向记者展示了其最新作品——世界首创“超声辅助搅拌摩擦焊设备”。

This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2016.

??? ?? ???(??? ?? expression)? ?? ???? ?? ??? ????, ??? ??? ??? ???? ???? ??? ??? ????.

??? ??

const materials = ["Hydrogen", "Helium", "Lithium", "Beryllium"];

console.log(materials.map((material) => material.length));
// Expected output: Array [8, 6, 7, 9]

??

js
() => expression

param => expression

(param) => expression

(param1, paramN) => expression

() => {
  statements
}

param => {
  statements
}

(param1, paramN) => {
  statements
}

???? ? ??? ????, ??? ????, ?? ?? ??? ???? ?? ?? ?? ??? ???.

js
(a, b, ...r) => expression
(a = 400, b = 20, c) => expression
([a, b] = [10, 20]) => expression
({ a, b } = { a: 10, b: 20 }) => expression

??? ??? ??? ?? async ???? ??? async? ??? ? ????.

js
async param => expression
async (param1, param2, ...paramN) => {
  statements
}

??

??? ?? ??? ?? ??? ??? ??? ???? ??? ?????. ? ???? ? ??? ??? ??? ?????.

?? : ?? ?? ???? ??? ??? ?? ??? ? ?? ???? ????. ?? ? ?? ?? ???? ? ??? ?? ??? ?? ??? ???????.

js
// ??? ?? ??
(function (a) {
  return a + 100;
});

// 1. "function"??? ??? ???? ??? ?? ??? ??? ???? ?????.
(a) => {
  return a + 100;
};

// 2. ???? "return"??? ??? ???? ??? ?????.
(a) => a + 100;

// 3. ????? ??? ?????.
a => a + 100;

?? ???? ???? ??? ??? ?? ?? ??? ???? ?? ??? ? ????. ??? ?? ???? ??? ? ????.

??? ??? ??? ??? ????? ?? ???? ??? ? ????. ?? ??? ?? ? ??? ??? ???? ??? ?? ?? ??? ?? ?? ?? ??? ?? ??? ?? ?? ?? ?? ?? ??? ??? ???? ???.

js
// ??? ?? ??
(function (a, b) {
  return a + b + 100;
});

// ??? ??
(a, b) => a + b + 100;

const a = 4;
const b = 2;

// ??? ?? ?? (????? ??)
(function () {
  return a + b + 100;
});

// ??? ?? (????? ??)
() => a + b + 100;

???? ??? ?? ???? ???? ???? ??? ? ????. ??? ??? ???? ??? ?? ?? ???? ???? return ???? ???????. ??? ??? ??? ?? ???? ??? ? ????.

js
// ??? ?? ??
(function (a, b) {
  const chuck = 42;
  return a + b + chuck;
});

// ??? ??
(a, b) => {
  const chuck = 42;
  return a + b + chuck;
};

??? ??? ?? ??? ???? ????. ??? ??? ???? ???? ?? ?? ??? ?? ???? ?? ?????. ??? ??? ??? ???? ??? ??? ?? ????.

js
// ?? ??
function bob(a) {
  return a + 100;
}

// ??? ??
const bob2 = (a) => a + 100;

?? ??

??? ??? ??? ???? ???? ?? ??? ??? ?? ? ????.

??? ????? ??? ???? ?? ?? ???? ?????. ?? ????? ???? return ?? ???? ???.

js
const func = (x) => x * x;
// ??? ?? ??, ??? "??"

const func2 = (x, y) => {
  return x + y;
};
// ?? ??? ??, ??? "??" ??

??? ?? ??? (params) => { object: literal }? ???? ?? ???? ???? ???? ???? ????.

js
const func = () => { foo: 1 };
// func()? ???? ???? ?? ?? ?????.

const func2 = () => { foo: function () {} };
// SyntaxError: function statement requires a name

const func3 = () => { foo() {} };
// SyntaxError: Unexpected token '{'

JavaScript? ??? ?? ?? ??? ?? ???? ?? ???? ??? ??? ??? ??? ?? ??? ?????. ???({}) ?? ??? ??? ???? ????, ??? foo? ?? ???? ?? ?? label? ???.

? ??? ????? ?? ???? ??? ??? ???.

js
const func = () => ({ foo: 1 });

???? ??? ? ????

??? ?? ???? this? ?? ??? ???? ?? ???? ???? ???. ???? ????? ?? ?? ?? ????? ?????.

js
"use strict";

const obj = {
  i: 10,
  b: () => console.log(this.i, this),
  c() {
    console.log(this.i, this);
  },
};

obj.b(); // logs undefined, Window { /* … */ } (or the global object)
obj.c(); // logs 10, Object { /* … */ }

? ?? ?? Object.defineProperty()? ??? ????.

js
"use strict";

const obj = {
  a: 10,
};

Object.defineProperty(obj, "b", {
  get: () => {
    console.log(this.a, typeof this.a, this); // undefined 'undefined' Window { /* … */ } (or the global object)
    return this.a + 10; // represents global object 'Window', therefore 'this.a' returns 'undefined'
  },
});

???? ???? this? ????, ??? ??? ??? ??? ???? this ???? ?? ?? ? ?????. ??? ??? ?? ??? this? ???? (?? ?? ??? ?? ??? ??)? ???? ???? ???. ??? ?? ??? ???? ?? ?????? ?? ????? ?? this? ?? ???? ????.

js
class C {
  a = 1;
  autoBoundMethod = () => {
    console.log(this.a);
  };
}

const c = new C();
c.autoBoundMethod(); // 1
const { autoBoundMethod } = c;
autoBoundMethod(); // 1
// ???? ????? ? ???? ???? ??? ???.

??? ?? ??? ?? ???? ???? ??? ?? "?? ??? ???"?? ????.

js
class C {
  a = 1;
  constructor() {
    this.method = this.method.bind(this);
  }
  method() {
    console.log(this.a);
  }
}

?? : ??? ??? ?????? ?? ????? ????? ????? ??? ??? ? ?? ??? ???? ? ???? ???? ???? ???? ????? ??? ???? ??? ? ????.

??? ??? call(), apply(), bind() ???? ??? ???? ??? ? ???? ????. ??? ??? ??? ??? ??? ??? ???? this? ???? ??? ???? ??? ?? this ?? ??? ?? ?????.

??? ???? ????

??? ???? ?? arguments ??? ????. ??? ? ???? arguments? ???? ??? ??? ?????.

js
function foo(n) {
  const f = () => arguments[0] + n; // foo? ??? ?? ??????. arguments[0]? n???.
  return f();
}

foo(3); // 3 + 3 = 6

??: strict mode??? arguments? ??? ??? ? ???? ?? ??? ?? ??? ???. ??? ?? arguments? ?? ?? ??? ?? ? ?? ??? ? ????.

???? ??, ??? ????? ???? ?? arguments ??? ???? ??? ?? ?????.

js
function foo(n) {
  const f = (...args) => args[0] + n;
  return f(10);
}

foo(1); // 11

???? ??? ? ????

??? ??? ???? ??? ? ??? new? ?? ???? ??? ?????. ?? prototype ??? ????.

js
const Foo = () => {};
const foo = new Foo(); // TypeError: Foo is not a constructor
console.log("prototype" in Foo); // false

?????? ??? ? ????

yield ???? ??? ?? ???? ??? ? ????. (??? ?? ?? ??? ????? ?? ??? ???? ??? ??????). ??? ??? ??? ?????? ??? ? ????.

??? ? ? ??

??? ???? ????? ??? ??? ? ??? ??? ? ????.

js
const func = (a, b, c)
  => 1;
// SyntaxError: Unexpected token '=>'

??? ????? ??? ?? ??? ?? ? ??? ??? ?? ?? ??? ??/???? ??? ? ????. ???? ??? ? ??? ?? ?? ????.

js
const func = (a, b, c) =>
  1;

const func2 = (a, b, c) => (
  1
);

const func3 = (a, b, c) => {
  return 1;
};

const func4 = (
  a,
  b,
  c,
) => 1;

???? ?? ??

??? ??? ???? ???? ????, ??? ???? ?? ??? ?? ??? ????? ?? ??? ?? ?? ??? ????.

js
let callback;

callback = callback || () => {};
// SyntaxError: invalid arrow-function arguments

=>? ???? ????? ????? ???? callback || ()? ??? ??? ?? ???? ?? ???? ??? ??? ???? ???.

js
callback = callback || (() => {});

??

??? ?? ????

js
// ? ??? ??? ???? ?? ?? ?????.
const empty = () => {};

(() => "foobar")();
// "foobar"? ?????.
// (?? ???? ?? ??????.)

const simple = (a) => (a > 15 ? 15 : a);
simple(16); // 15
simple(10); // 10

const max = (a, b) => (a > b ? a : b);

// ??? ?? ???, ?? ?
const arr = [5, 6, 13, 0, 1, 18, 23];

const sum = arr.reduce((a, b) => a + b);
// 66

const even = arr.filter((v) => v % 2 === 0);
// [6, 0, 18]

const double = arr.map((v) => v * 2);
// [10, 12, 26, 0, 2, 36, 46]

// ?? ??? ???? ??
promise
  .then((a) => {
    // …
  })
  .then((b) => {
    // …
  });

// ????? ? ?? ?? ??? ? ?? ???? ?? ??? ??
setTimeout(() => {
  console.log("I happen sooner");
  setTimeout(() => {
    // deeper code
    console.log("I happen later");
  }, 1);
}, 1);

call, bind, apply ??? ????

call(), apply(), bind() ???? ? ???? ??? ????? ?? ???? ???? ?? ?????.

js
const obj = {
  num: 100,
};

// globalThis? "num"? ???? ???? ?? ??? ?????.
globalThis.num = 42;

// "this"?? ???? ??? ?? ??
const add = function (a, b, c) {
  return this.num + a + b + c;
};

console.log(add.call(obj, 1, 2, 3)); // 106
console.log(add.apply(obj, [1, 2, 3])); // 106
const boundAdd = add.bind(obj);
console.log(boundAdd(1, 2, 3)); // 106

??? ??? ??, add ??? ????? globalThis(??) ???? ????? this? globalThis?? ?????.

js
const obj = {
  num: 100,
};

// globalThis? "num"? ???? ???? ??? ?????.
globalThis.num = 42;

// ??? ??
const add = (a, b, c) => this.num + a + b + c;

console.log(add.call(obj, 1, 2, 3)); // 48
console.log(add.apply(obj, [1, 2, 3])); // 48
const boundAdd = add.bind(obj);
console.log(boundAdd(1, 2, 3)); // 48

??? ??? ???? ?? ? ??? setTimeout(), EventTarget.prototype.addEventListener()? ?? ??? ??? ???? ????? ?? ?? ????? ??? ???, call(), apply() ?? bind()? ??? ???? ??? ? ??? ????.

?? ?? ???? ???? ?? ?? ??? ???? ???? ????.

js
const obj = {
  count: 10,
  doSomethingLater() {
    setTimeout(function () {
      // ??? window ???? ?????.
      this.count++;
      console.log(this.count);
    }, 300);
  },
};

obj.doSomethingLater(); // "count" ??? window ??? ?? ??? "NaN"? ?????.

??? ??? ???? this? ??? ? ?? ??? ? ????.

js
const obj = {
  count: 10,
  doSomethingLater() {
    // ??? ??? "this"? "obj" ????? ??????.
    setTimeout(() => {
      // ??? ???? ?? ???? ??
      // ?? ???? setTimeout? ??? ??? ???? ????
      // ?? ???? "obj" ????? ?????.
      this.count++;
      console.log(this.count);
    }, 300);
  },
};

obj.doSomethingLater(); // 11? ?????.

???

Specification
ECMAScript? 2026 Language?Specification
# sec-arrow-function-definitions

???? ???

??