Hướng dẫn do you have to name a function in javascript? - bạn có phải đặt tên cho một hàm trong javascript không?

Thử nó

Lưu ý: Trong các triển khai không chuẩn, Pre-ES2015, thuộc tính

// -- someModule.js --
export default function () {};

// -- main.js --
import someModule from "./someModule.js";

someModule.name; // "default"

// -- someModule.js --
export default function () {};

// -- main.js --
import someModule from "./someModule.js";

someModule.name; // "default"

// -- someModule.js --
export default function () {};

// -- main.js --
import someModule from "./someModule.js";

someModule.name; // "default"

// -- someModule.js --
export default function () {};

// -- main.js --
import someModule from "./someModule.js";

someModule.name; // "default"

Sự mô tả

Thuộc tính

// -- someModule.js --
export default function () {};

// -- main.js --
import someModule from "./someModule.js";

someModule.name; // "default"

Thuộc tính

// -- someModule.js --
export default function () {};

// -- main.js --
import someModule from "./someModule.js";

someModule.name; // "default"

function someFunction() {}

someFunction.name = 'otherFunction';
console.log(someFunction.name); // someFunction

Để thay đổi nó, sử dụng

new Function().name; // "anonymous"

Thuộc tính

// -- someModule.js --
export default function () {};

// -- main.js --
import someModule from "./someModule.js";

someModule.name; // "default"

Tuyên bố chức năng

Thuộc tính

// -- someModule.js --
export default function () {};

// -- main.js --
import someModule from "./someModule.js";

someModule.name; // "default"

function doSomething() {}
doSomething.name; // "doSomething"

Tuyên bố chức năng xuất hiện mặc định

Tuyên bố

new Function().name; // "anonymous"

new Function().name; // "anonymous"

// -- someModule.js --
export default function () {};

// -- main.js --
import someModule from "./someModule.js";

someModule.name; // "default"

Hàm tạo chức năng

Các chức năng được tạo với hàm tạo

new Function().name; // "anonymous"

new Function().name; // "anonymous"

Biểu thức chức năng

Nếu biểu thức hàm được đặt tên, tên đó được sử dụng làm thuộc tính

// -- someModule.js --
export default function () {};

// -- main.js --
import someModule from "./someModule.js";

someModule.name; // "default"

const someFunction = function someFunctionName() {};
someFunction.name; // "someFunctionName"

Các biểu thức chức năng ẩn danh được tạo bằng cách sử dụng từ khóa

new Function().name; // "anonymous"

new Function().name; // "anonymous"

(function () {}).name; // ""
(() => {}).name; // ""

Tuy nhiên, những trường hợp như vậy là rất hiếm - thông thường, để chỉ biểu thức ở nơi khác, biểu thức hàm được gắn vào một định danh khi nó được tạo (chẳng hạn như trong một khai báo biến). Trong những trường hợp như vậy, tên có thể được suy ra, vì một vài tiểu mục sau đây chứng minh.

Một trường hợp thực tế trong đó tên không thể được suy ra là một hàm được trả về từ một hàm khác:

function getFoo() {
  return () => {};
}
getFoo().name; // ""

Khai báo và phương pháp biến

Các biến và phương thức có thể suy ra tên của một hàm ẩn danh từ vị trí cú pháp của nó.

const f = function () {};
const object = {
  someMethod: function () {}
};

console.log(f.name); // "f"
console.log(object.someMethod.name); // "someMethod"

Điều tương tự áp dụng cho bài tập:

let f;
f = () => {};
f.name; // "f"

Khởi tạo và giá trị mặc định

Các chức năng trong các bộ khởi tạo (giá trị mặc định) của phá hủy, tham số mặc định, trường lớp, v.v., sẽ kế thừa tên của định danh bị ràng buộc là

// -- someModule.js --
export default function () {};

// -- main.js --
import someModule from "./someModule.js";

someModule.name; // "default"

const [f = () => {}] = [];
f.name; // "f"

const { someMethod: m = () => {} } = {};
m.name; // "m"

function foo(f = () => {}) {
  console.log(f.name);
}
foo(); // "f"

class Foo {
  static someMethod = () => {};
}
Foo.someMethod.name; // someMethod

Phương pháp tốc ký

function doSomething() {}
doSomething.name; // "doSomething"

Chức năng ràng buộc

const someFunction = function someFunctionName() {};
someFunction.name; // "someFunctionName"

function doSomething() {}
doSomething.name; // "doSomething"

Getter và setter

Khi sử dụng các thuộc tính của

const someFunction = function someFunctionName() {};
someFunction.name; // "someFunctionName"

const someFunction = function someFunctionName() {};
someFunction.name; // "someFunctionName"

function doSomething() {}
doSomething.name; // "doSomething"

Lớp

Tên của một lớp theo cùng một thuật toán như các khai báo và biểu thức hàm.

function doSomething() {}
doSomething.name; // "doSomething"

Cảnh báo: JavaScript sẽ đặt thuộc tính

// -- someModule.js --
export default function () {};

// -- main.js --
import someModule from "./someModule.js";

someModule.name; // "default"

// -- someModule.js --
export default function () {};

// -- main.js --
import someModule from "./someModule.js";

someModule.name; // "default"

// -- someModule.js --
export default function () {};

// -- main.js --
import someModule from "./someModule.js";

someModule.name; // "default"

// -- someModule.js --
export default function () {};

// -- main.js --
import someModule from "./someModule.js";

someModule.name; // "default"

// -- someModule.js --
export default function () {};

// -- main.js --
import someModule from "./someModule.js";

someModule.name; // "default"

// -- someModule.js --
export default function () {};

// -- main.js --
import someModule from "./someModule.js";

someModule.name; // "default"

Biểu tượng là tên hàm

Nếu

const someFunction = function someFunctionName() {};
someFunction.name; // "someFunctionName"

function doSomething() {}
doSomething.name; // "doSomething"

Tài sản cá nhân

Các trường riêng và các phương thức riêng có hàm băm (

const someFunction = function someFunctionName() {};
someFunction.name; // "someFunctionName"

function doSomething() {}
doSomething.name; // "doSomething"

Ví dụ

Nói tên hàm tạo của một đối tượng

Bạn có thể sử dụng

const someFunction = function someFunctionName() {};
someFunction.name; // "someFunctionName"

function doSomething() {}
doSomething.name; // "doSomething"

Tuy nhiên, vì các thành viên tĩnh sẽ trở thành thuộc tính riêng của lớp, chúng tôi không thể có được tên lớp cho hầu như bất kỳ lớp nào có thuộc tính Phương thức tĩnh

(function () {}).name; // ""
(() => {}).name; // ""

function doSomething() {}
doSomething.name; // "doSomething"

Với phương thức

(function () {}).name; // ""
(() => {}).name; // ""

(function () {}).name; // ""
(() => {}).name; // ""

(function () {}).name; // ""
(() => {}).name; // ""

(function () {}).name; // ""
(() => {}).name; // ""

(function () {}).name; // ""
(() => {}).name; // ""

function doSomething() {}
doSomething.name; // "doSomething"

Do sự tồn tại của các trường tĩnh,

// -- someModule.js --
export default function () {};

// -- main.js --
import someModule from "./someModule.js";

someModule.name; // "default"

function doSomething() {}
doSomething.name; // "doSomething"

Nếu một lớp có một thuộc tính tĩnh được gọi là

// -- someModule.js --
export default function () {};

// -- main.js --
import someModule from "./someModule.js";

someModule.name; // "default"

// -- someModule.js --
export default function () {};

// -- main.js --
import someModule from "./someModule.js";

someModule.name; // "default"

Do đó, bạn không thể dựa vào thuộc tính

// -- someModule.js --
export default function () {};

// -- main.js --
import someModule from "./someModule.js";

someModule.name; // "default"

Máy nén JavaScript và máy tính

CẢNH BÁO: Hãy cẩn thận khi sử dụng thuộc tính

// -- someModule.js --
export default function () {};

// -- main.js --
import someModule from "./someModule.js";

someModule.name; // "default"

// -- someModule.js --
export default function () {};

// -- main.js --
import someModule from "./someModule.js";

someModule.name; // "default"

Mã nguồn như:

// -- someModule.js --
export default function () {};

// -- main.js --
import someModule from "./someModule.js";

someModule.name; // "default"

có thể được nén vào:

// -- someModule.js --
export default function () {};

// -- main.js --
import someModule from "./someModule.js";

someModule.name; // "default"

Trong phiên bản không nén, chương trình chạy vào nhánh Truthy và ghi lại "'foo' là một ví dụ của 'foo'" - trong khi, trong phiên bản nén, nó hoạt động khác nhau và chạy vào nhánh khác. Nếu bạn dựa vào thuộc tính

// -- someModule.js --
export default function () {};

// -- main.js --
import someModule from "./someModule.js";

someModule.name; // "default"

Xem thêm

• Thuộc tính polyfill cho chức năng '

  function getFoo() {
    return () => {};
  }
  getFoo().name; // ""
  

  1 có sẵn trong

  function getFoo() {
    return () => {};
  }
  getFoo().name; // ""
  

  2

• // -- someModule.js --
  export default function () {};
  
  // -- main.js --
  import someModule from "./someModule.js";
  
  someModule.name; // "default"
  

  3