Phương thức
4 tạo ra một hàm mới, khi được gọi, có từ khóa function log[...args] {
"use strict"; // prevent `this` from being boxed into the wrapper object
console.log[this, ...args];
};
const boundLog = log.bind["this value", 1, 2];
const boundLog2 = boundLog.bind["new this value", 3, 4];
boundLog2[5, 6]; // "this value", 1, 2, 3, 4, 5, 6
5 được đặt thành giá trị được cung cấp, với một chuỗi các đối số nhất định trước bất kỳ được cung cấp nào khi hàm mới được gọi.function log[...args] {
"use strict"; // prevent `this` from being boxed into the wrapper object
console.log[this, ...args];
};
const boundLog = log.bind["this value", 1, 2];
const boundLog2 = boundLog.bind["new this value", 3, 4];
boundLog2[5, 6]; // "this value", 1, 2, 3, 4, 5, 6
4 method creates a new function that, when called, has its function log[...args] {
"use strict"; // prevent `this` from being boxed into the wrapper object
console.log[this, ...args];
};
const boundLog = log.bind["this value", 1, 2];
const boundLog2 = boundLog.bind["new this value", 3, 4];
boundLog2[5, 6]; // "this value", 1, 2, 3, 4, 5, 6
5 keyword set to the provided value, with a given sequence of arguments preceding any provided when the new function is called.function log[...args] {
"use strict"; // prevent `this` from being boxed into the wrapper object
console.log[this, ...args];
};
const boundLog = log.bind["this value", 1, 2];
const boundLog2 = boundLog.bind["new this value", 3, 4];
boundLog2[5, 6]; // "this value", 1, 2, 3, 4, 5, 6
Thử nó
Cú pháp
bind[thisArg]
bind[thisArg, arg1]
bind[thisArg, arg1, arg2]
bind[thisArg, arg1, arg2, /* …, */ argN]
Thông số
function log[...args] {
"use strict"; // prevent `this` from being boxed into the wrapper object
console.log[this, ...args];
};
const boundLog = log.bind["this value", 1, 2];
const boundLog2 = boundLog.bind["new this value", 3, 4];
boundLog2[5, 6]; // "this value", 1, 2, 3, 4, 5, 6
6Giá trị được truyền dưới dạng tham số
function log[...args] {
"use strict"; // prevent `this` from being boxed into the wrapper object
console.log[this, ...args];
};
const boundLog = log.bind["this value", 1, 2];
const boundLog2 = boundLog.bind["new this value", 3, 4];
boundLog2[5, 6]; // "this value", 1, 2, 3, 4, 5, 6
5 cho hàm đích function log[...args] {
"use strict"; // prevent `this` from being boxed into the wrapper object
console.log[this, ...args];
};
const boundLog = log.bind["this value", 1, 2];
const boundLog2 = boundLog.bind["new this value", 3, 4];
boundLog2[5, 6]; // "this value", 1, 2, 3, 4, 5, 6
8 khi hàm giới hạn được gọi. Nếu hàm không ở chế độ nghiêm ngặt, function log[...args] {
"use strict"; // prevent `this` from being boxed into the wrapper object
console.log[this, ...args];
};
const boundLog = log.bind["this value", 1, 2];
const boundLog2 = boundLog.bind["new this value", 3, 4];
boundLog2[5, 6]; // "this value", 1, 2, 3, 4, 5, 6
9 và class Base {
constructor[...args] {
console.log[new.target === Base];
console.log[args];
}
}
const BoundBase = Base.bind[null, 1, 2];
new BoundBase[3, 4]; // true, [1, 2, 3, 4]
0 sẽ được thay thế bằng đối tượng toàn cầu và các giá trị nguyên thủy sẽ được chuyển đổi thành các đối tượng. Giá trị bị bỏ qua nếu hàm giới hạn được xây dựng bằng toán tử class Base {
constructor[...args] {
console.log[new.target === Base];
console.log[args];
}
}
const BoundBase = Base.bind[null, 1, 2];
new BoundBase[3, 4]; // true, [1, 2, 3, 4]
1.class Base {
constructor[...args] {
console.log[new.target === Base];
console.log[args];
}
}
const BoundBase = Base.bind[null, 1, 2];
new BoundBase[3, 4]; // true, [1, 2, 3, 4]
2 Tùy chọnOptionalCác đối số để mong đợi các đối số được cung cấp cho chức năng ràng buộc khi gọi
function log[...args] {
"use strict"; // prevent `this` from being boxed into the wrapper object
console.log[this, ...args];
};
const boundLog = log.bind["this value", 1, 2];
const boundLog2 = boundLog.bind["new this value", 3, 4];
boundLog2[5, 6]; // "this value", 1, 2, 3, 4, 5, 6
8.Giá trị trả về
Một bản sao của hàm đã cho với giá trị
function log[...args] {
"use strict"; // prevent `this` from being boxed into the wrapper object
console.log[this, ...args];
};
const boundLog = log.bind["this value", 1, 2];
const boundLog2 = boundLog.bind["new this value", 3, 4];
boundLog2[5, 6]; // "this value", 1, 2, 3, 4, 5, 6
5 được chỉ định và các đối số ban đầu [nếu được cung cấp].Sự mô tả
Hàm
function log[...args] {
"use strict"; // prevent `this` from being boxed into the wrapper object
console.log[this, ...args];
};
const boundLog = log.bind["this value", 1, 2];
const boundLog2 = boundLog.bind["new this value", 3, 4];
boundLog2[5, 6]; // "this value", 1, 2, 3, 4, 5, 6
4 tạo ra một hàm ràng buộc mới. Gọi hàm ràng buộc thường dẫn đến việc thực thi chức năng mà nó kết thúc, còn được gọi là hàm đích. Hàm ràng buộc sẽ lưu trữ các tham số được truyền - bao gồm giá trị của function log[...args] {
"use strict"; // prevent `this` from being boxed into the wrapper object
console.log[this, ...args];
};
const boundLog = log.bind["this value", 1, 2];
const boundLog2 = boundLog.bind["new this value", 3, 4];
boundLog2[5, 6]; // "this value", 1, 2, 3, 4, 5, 6
5 và một vài đối số đầu tiên - là trạng thái bên trong của nó. Các giá trị này được lưu trữ trước, thay vì được thông qua tại thời điểm gọi. Nói chung, bạn có thể thấy class Base {
constructor[...args] {
console.log[new.target === Base];
console.log[args];
}
}
const BoundBase = Base.bind[null, 1, 2];
new BoundBase[3, 4]; // true, [1, 2, 3, 4]
7 tương đương với class Base {
constructor[...args] {
console.log[new.target === Base];
console.log[args];
}
}
const BoundBase = Base.bind[null, 1, 2];
new BoundBase[3, 4]; // true, [1, 2, 3, 4]
8 cho hiệu ứng khi nó được gọi [nhưng không phải khi class Base {
constructor[...args] {
console.log[new.target === Base];
console.log[args];
}
}
const BoundBase = Base.bind[null, 1, 2];
new BoundBase[3, 4]; // true, [1, 2, 3, 4]
9 được xây dựng].Một hàm ràng buộc có thể bị ràng buộc hơn nữa bằng cách gọi
class Derived extends class {}.bind[null] {}
// TypeError: Class extends value does not have valid prototype property undefined
0, tạo ra một hàm ràng buộc khác class Derived extends class {}.bind[null] {}
// TypeError: Class extends value does not have valid prototype property undefined
1. Giá trị function log[...args] {
"use strict"; // prevent `this` from being boxed into the wrapper object
console.log[this, ...args];
};
const boundLog = log.bind["this value", 1, 2];
const boundLog2 = boundLog.bind["new this value", 3, 4];
boundLog2[5, 6]; // "this value", 1, 2, 3, 4, 5, 6
6 bị ràng buộc mới bị bỏ qua, bởi vì hàm mục tiêu của class Derived extends class {}.bind[null] {}
// TypeError: Class extends value does not have valid prototype property undefined
1, là class Base {
constructor[...args] {
console.log[new.target === Base];
console.log[args];
}
}
const BoundBase = Base.bind[null, 1, 2];
new BoundBase[3, 4]; // true, [1, 2, 3, 4]
9, đã có một ràng buộc function log[...args] {
"use strict"; // prevent `this` from being boxed into the wrapper object
console.log[this, ...args];
};
const boundLog = log.bind["this value", 1, 2];
const boundLog2 = boundLog.bind["new this value", 3, 4];
boundLog2[5, 6]; // "this value", 1, 2, 3, 4, 5, 6
5. Khi class Derived extends class {}.bind[null] {}
// TypeError: Class extends value does not have valid prototype property undefined
1 được gọi, nó sẽ gọi class Base {
constructor[...args] {
console.log[new.target === Base];
console.log[args];
}
}
const BoundBase = Base.bind[null, 1, 2];
new BoundBase[3, 4]; // true, [1, 2, 3, 4]
9, từ đó gọi class Derived extends class {}.bind[null] {}
// TypeError: Class extends value does not have valid prototype property undefined
8. Các đối số mà class Derived extends class {}.bind[null] {}
// TypeError: Class extends value does not have valid prototype property undefined
8 cuối cùng nhận được, theo thứ tự: các đối số bị ràng buộc bởi class Base {
constructor[...args] {
console.log[new.target === Base];
console.log[args];
}
}
const BoundBase = Base.bind[null, 1, 2];
new BoundBase[3, 4]; // true, [1, 2, 3, 4]
9, các đối số bị ràng buộc bởi class Derived extends class {}.bind[null] {}
// TypeError: Class extends value does not have valid prototype property undefined
1 và các đối số nhận được bởi class Derived extends class {}.bind[null] {}
// TypeError: Class extends value does not have valid prototype property undefined
1.function log[...args] {
"use strict"; // prevent `this` from being boxed into the wrapper object
console.log[this, ...args];
};
const boundLog = log.bind["this value", 1, 2];
const boundLog2 = boundLog.bind["new this value", 3, 4];
boundLog2[5, 6]; // "this value", 1, 2, 3, 4, 5, 6
Một hàm ràng buộc cũng có thể được xây dựng bằng toán tử
class Base {
constructor[...args] {
console.log[new.target === Base];
console.log[args];
}
}
const BoundBase = Base.bind[null, 1, 2];
new BoundBase[3, 4]; // true, [1, 2, 3, 4]
1 nếu hàm đích của nó có thể xây dựng được. Làm như vậy hoạt động như thể chức năng đích thay vào đó đã được xây dựng. Các đối số được chuẩn bị được cung cấp cho chức năng đích như bình thường, trong khi giá trị function log[...args] {
"use strict"; // prevent `this` from being boxed into the wrapper object
console.log[this, ...args];
};
const boundLog = log.bind["this value", 1, 2];
const boundLog2 = boundLog.bind["new this value", 3, 4];
boundLog2[5, 6]; // "this value", 1, 2, 3, 4, 5, 6
5 được cung cấp bị bỏ qua [vì việc xây dựng chuẩn bị function log[...args] {
"use strict"; // prevent `this` from being boxed into the wrapper object
console.log[this, ...args];
};
const boundLog = log.bind["this value", 1, 2];
const boundLog2 = boundLog.bind["new this value", 3, 4];
boundLog2[5, 6]; // "this value", 1, 2, 3, 4, 5, 6
5 của chính nó, như được thấy bởi các tham số của class Base {}
const BoundBase = Base.bind[null, 1, 2];
console.log[new Base[] instanceof BoundBase]; // true
6]. Nếu hàm giới hạn được xây dựng trực tiếp, class Base {}
const BoundBase = Base.bind[null, 1, 2];
console.log[new Base[] instanceof BoundBase]; // true
7 sẽ là hàm đích thay thế. [Nghĩa là, hàm ràng buộc trong suốt đến class Base {}
const BoundBase = Base.bind[null, 1, 2];
console.log[new Base[] instanceof BoundBase]; // true
7.]class Base {
constructor[...args] {
console.log[new.target === Base];
console.log[args];
}
}
const BoundBase = Base.bind[null, 1, 2];
new BoundBase[3, 4]; // true, [1, 2, 3, 4]
Tuy nhiên, vì một hàm ràng buộc không có thuộc tính
class Base {}
const BoundBase = Base.bind[null, 1, 2];
console.log[new Base[] instanceof BoundBase]; // true
9, nó không thể được sử dụng làm lớp cơ sở cho this.x = 9; // 'this' refers to the global object [e.g. 'window'] in non-strict mode
const module = {
x: 81,
getX[] {
return this.x;
},
};
module.getX[];
// returns 81
const retrieveX = module.getX;
retrieveX[];
// returns 9; the function gets invoked at the global scope
// Create a new function with 'this' bound to module
// New programmers might confuse the
// global variable 'x' with module's property 'x'
const boundGetX = retrieveX.bind[module];
boundGetX[];
// returns 81
0.class Derived extends class {}.bind[null] {}
// TypeError: Class extends value does not have valid prototype property undefined
Khi sử dụng hàm ràng buộc làm phía bên phải của
this.x = 9; // 'this' refers to the global object [e.g. 'window'] in non-strict mode
const module = {
x: 81,
getX[] {
return this.x;
},
};
module.getX[];
// returns 81
const retrieveX = module.getX;
retrieveX[];
// returns 9; the function gets invoked at the global scope
// Create a new function with 'this' bound to module
// New programmers might confuse the
// global variable 'x' with module's property 'x'
const boundGetX = retrieveX.bind[module];
boundGetX[];
// returns 81
1, this.x = 9; // 'this' refers to the global object [e.g. 'window'] in non-strict mode
const module = {
x: 81,
getX[] {
return this.x;
},
};
module.getX[];
// returns 81
const retrieveX = module.getX;
retrieveX[];
// returns 9; the function gets invoked at the global scope
// Create a new function with 'this' bound to module
// New programmers might confuse the
// global variable 'x' with module's property 'x'
const boundGetX = retrieveX.bind[module];
boundGetX[];
// returns 81
1 sẽ đạt được chức năng đích [được lưu trữ bên trong trong hàm ràng buộc] và thay vào đó đọc class Base {}
const BoundBase = Base.bind[null, 1, 2];
console.log[new Base[] instanceof BoundBase]; // true
9.class Base {}
const BoundBase = Base.bind[null, 1, 2];
console.log[new Base[] instanceof BoundBase]; // true
Hàm giới hạn có các thuộc tính sau:
this.x = 9; // 'this' refers to the global object [e.g. 'window'] in non-strict mode
const module = {
x: 81,
getX[] {
return this.x;
},
};
module.getX[];
// returns 81
const retrieveX = module.getX;
retrieveX[];
// returns 9; the function gets invoked at the global scope
// Create a new function with 'this' bound to module
// New programmers might confuse the
// global variable 'x' with module's property 'x'
const boundGetX = retrieveX.bind[module];
boundGetX[];
// returns 81
4this.x = 9; // 'this' refers to the global object [e.g. 'window'] in non-strict mode
const module = {
x: 81,
getX[] {
return this.x;
},
};
module.getX[];
// returns 81
const retrieveX = module.getX;
retrieveX[];
// returns 9; the function gets invoked at the global scope
// Create a new function with 'this' bound to module
// New programmers might confuse the
// global variable 'x' with module's property 'x'
const boundGetX = retrieveX.bind[module];
boundGetX[];
// returns 81
4 của hàm đích trừ đi số lượng đối số bị ràng buộc [không tính tham số function log[...args] {
"use strict"; // prevent `this` from being boxed into the wrapper object
console.log[this, ...args];
};
const boundLog = log.bind["this value", 1, 2];
const boundLog2 = boundLog.bind["new this value", 3, 4];
boundLog2[5, 6]; // "this value", 1, 2, 3, 4, 5, 6
6], với 0 là giá trị tối thiểu.this.x = 9; // 'this' refers to the global object [e.g. 'window'] in non-strict mode
const module = {
x: 81,
getX[] {
return this.x;
},
};
module.getX[];
// returns 81
const retrieveX = module.getX;
retrieveX[];
// returns 9; the function gets invoked at the global scope
// Create a new function with 'this' bound to module
// New programmers might confuse the
// global variable 'x' with module's property 'x'
const boundGetX = retrieveX.bind[module];
boundGetX[];
// returns 81
7this.x = 9; // 'this' refers to the global object [e.g. 'window'] in non-strict mode
const module = {
x: 81,
getX[] {
return this.x;
},
};
module.getX[];
// returns 81
const retrieveX = module.getX;
retrieveX[];
// returns 9; the function gets invoked at the global scope
// Create a new function with 'this' bound to module
// New programmers might confuse the
// global variable 'x' with module's property 'x'
const boundGetX = retrieveX.bind[module];
boundGetX[];
// returns 81
7 của hàm đích cộng với tiền tố this.x = 9; // 'this' refers to the global object [e.g. 'window'] in non-strict mode
const module = {
x: 81,
getX[] {
return this.x;
},
};
module.getX[];
// returns 81
const retrieveX = module.getX;
retrieveX[];
// returns 9; the function gets invoked at the global scope
// Create a new function with 'this' bound to module
// New programmers might confuse the
// global variable 'x' with module's property 'x'
const boundGetX = retrieveX.bind[module];
boundGetX[];
// returns 81
9.Hàm giới hạn cũng kế thừa chuỗi nguyên mẫu của hàm đích. Tuy nhiên, nó không có các thuộc tính riêng khác của hàm đích [chẳng hạn như các thuộc tính tĩnh nếu hàm đích là một lớp].
Ví dụ
Tạo hàm ràng buộc
Việc sử dụng đơn giản nhất của
function log[...args] {
"use strict"; // prevent `this` from being boxed into the wrapper object
console.log[this, ...args];
};
const boundLog = log.bind["this value", 1, 2];
const boundLog2 = boundLog.bind["new this value", 3, 4];
boundLog2[5, 6]; // "this value", 1, 2, 3, 4, 5, 6
4 là tạo ra một hàm, bất kể nó được gọi như thế nào, được gọi với một giá trị function log[...args] {
"use strict"; // prevent `this` from being boxed into the wrapper object
console.log[this, ...args];
};
const boundLog = log.bind["this value", 1, 2];
const boundLog2 = boundLog.bind["new this value", 3, 4];
boundLog2[5, 6]; // "this value", 1, 2, 3, 4, 5, 6
5 cụ thể.Một sai lầm phổ biến đối với các lập trình viên JavaScript mới là trích xuất một phương thức từ một đối tượng, sau đó gọi chức năng đó và hy vọng nó sẽ sử dụng đối tượng gốc làm
function log[...args] {
"use strict"; // prevent `this` from being boxed into the wrapper object
console.log[this, ...args];
};
const boundLog = log.bind["this value", 1, 2];
const boundLog2 = boundLog.bind["new this value", 3, 4];
boundLog2[5, 6]; // "this value", 1, 2, 3, 4, 5, 6
5 [ví dụ: bằng cách sử dụng phương thức trong mã dựa trên gọi lại].Tuy nhiên, không có sự quan tâm đặc biệt, đối tượng ban đầu thường bị mất. Tạo hàm ràng buộc từ hàm, sử dụng đối tượng gốc, giải quyết gọn gàng vấn đề này:
this.x = 9; // 'this' refers to the global object [e.g. 'window'] in non-strict mode
const module = {
x: 81,
getX[] {
return this.x;
},
};
module.getX[];
// returns 81
const retrieveX = module.getX;
retrieveX[];
// returns 9; the function gets invoked at the global scope
// Create a new function with 'this' bound to module
// New programmers might confuse the
// global variable 'x' with module's property 'x'
const boundGetX = retrieveX.bind[module];
boundGetX[];
// returns 81
Lưu ý: Nếu bạn chạy ví dụ này ở chế độ nghiêm ngặt [ví dụ: trong các mô -đun ECMAScript hoặc thông qua Chỉ thị
3], giá trị toàn cầu function list[...args] {
return args;
}
function addArguments[arg1, arg2] {
return arg1 + arg2;
}
const list1 = list[1, 2, 3];
// [1, 2, 3]
const result1 = addArguments[1, 2];
// 3
// Create a function with a preset leading argument
const leadingThirtySevenList = list.bind[null, 37];
// Create a function with a preset first argument.
const addThirtySeven = addArguments.bind[null, 37];
const list2 = leadingThirtySevenList[];
// [37]
const list3 = leadingThirtySevenList[1, 2, 3];
// [37, 1, 2, 3]
const result2 = addThirtySeven[5];
// 37 + 5 = 42
const result3 = addThirtySeven[5, 10];
// 37 + 5 = 42
// [the second argument is ignored]
5 sẽ không được xác định, khiến cuộc gọi function log[...args] {
"use strict"; // prevent `this` from being boxed into the wrapper object
console.log[this, ...args];
};
const boundLog = log.bind["this value", 1, 2];
const boundLog2 = boundLog.bind["new this value", 3, 4];
boundLog2[5, 6]; // "this value", 1, 2, 3, 4, 5, 6
5 bị lỗi. If you run this example in strict mode [e.g. in
ECMAScript modules, or through the function list[...args] {
return args;
}
function addArguments[arg1, arg2] {
return arg1 + arg2;
}
const list1 = list[1, 2, 3];
// [1, 2, 3]
const result1 = addArguments[1, 2];
// 3
// Create a function with a preset leading argument
const leadingThirtySevenList = list.bind[null, 37];
// Create a function with a preset first argument.
const addThirtySeven = addArguments.bind[null, 37];
const list2 = leadingThirtySevenList[];
// [37]
const list3 = leadingThirtySevenList[1, 2, 3];
// [37, 1, 2, 3]
const result2 = addThirtySeven[5];
// 37 + 5 = 42
const result3 = addThirtySeven[5, 10];
// 37 + 5 = 42
// [the second argument is ignored]
function list[...args] {
return args;
}
function addArguments[arg1, arg2] {
return arg1 + arg2;
}
const list1 = list[1, 2, 3];
// [1, 2, 3]
const result1 = addArguments[1, 2];
// 3
// Create a function with a preset leading argument
const leadingThirtySevenList = list.bind[null, 37];
// Create a function with a preset first argument.
const addThirtySeven = addArguments.bind[null, 37];
const list2 = leadingThirtySevenList[];
// [37]
const list3 = leadingThirtySevenList[1, 2, 3];
// [37, 1, 2, 3]
const result2 = addThirtySeven[5];
// 37 + 5 = 42
const result3 = addThirtySeven[5, 10];
// 37 + 5 = 42
// [the second argument is ignored]
3 directive], the global function log[...args] {
"use strict"; // prevent `this` from being boxed into the wrapper object
console.log[this, ...args];
};
const boundLog = log.bind["this value", 1, 2];
const boundLog2 = boundLog.bind["new this value", 3, 4];
boundLog2[5, 6]; // "this value", 1, 2, 3, 4, 5, 6
5 value will be undefined, causing the function list[...args] {
return args;
}
function addArguments[arg1, arg2] {
return arg1 + arg2;
}
const list1 = list[1, 2, 3];
// [1, 2, 3]
const result1 = addArguments[1, 2];
// 3
// Create a function with a preset leading argument
const leadingThirtySevenList = list.bind[null, 37];
// Create a function with a preset first argument.
const addThirtySeven = addArguments.bind[null, 37];
const list2 = leadingThirtySevenList[];
// [37]
const list3 = leadingThirtySevenList[1, 2, 3];
// [37, 1, 2, 3]
const result2 = addThirtySeven[5];
// 37 + 5 = 42
const result3 = addThirtySeven[5, 10];
// 37 + 5 = 42
// [the second argument is ignored]
5 call to fail.Nếu bạn chạy điều này trong một mô-đun Node CommonJS, phạm vi hàng đầu
function log[...args] {
"use strict"; // prevent `this` from being boxed into the wrapper object
console.log[this, ...args];
};
const boundLog = log.bind["this value", 1, 2];
const boundLog2 = boundLog.bind["new this value", 3, 4];
boundLog2[5, 6]; // "this value", 1, 2, 3, 4, 5, 6
5 sẽ chỉ vào function list[...args] {
return args;
}
function addArguments[arg1, arg2] {
return arg1 + arg2;
}
const list1 = list[1, 2, 3];
// [1, 2, 3]
const result1 = addArguments[1, 2];
// 3
// Create a function with a preset leading argument
const leadingThirtySevenList = list.bind[null, 37];
// Create a function with a preset first argument.
const addThirtySeven = addArguments.bind[null, 37];
const list2 = leadingThirtySevenList[];
// [37]
const list3 = leadingThirtySevenList[1, 2, 3];
// [37, 1, 2, 3]
const result2 = addThirtySeven[5];
// 37 + 5 = 42
const result3 = addThirtySeven[5, 10];
// 37 + 5 = 42
// [the second argument is ignored]
7 thay vì function list[...args] {
return args;
}
function addArguments[arg1, arg2] {
return arg1 + arg2;
}
const list1 = list[1, 2, 3];
// [1, 2, 3]
const result1 = addArguments[1, 2];
// 3
// Create a function with a preset leading argument
const leadingThirtySevenList = list.bind[null, 37];
// Create a function with a preset first argument.
const addThirtySeven = addArguments.bind[null, 37];
const list2 = leadingThirtySevenList[];
// [37]
const list3 = leadingThirtySevenList[1, 2, 3];
// [37, 1, 2, 3]
const result2 = addThirtySeven[5];
// 37 + 5 = 42
const result3 = addThirtySeven[5, 10];
// 37 + 5 = 42
// [the second argument is ignored]
8, bất kể ở chế độ nghiêm ngặt hay không. Tuy nhiên, trong các chức năng, tham chiếu của function log[...args] {
"use strict"; // prevent `this` from being boxed into the wrapper object
console.log[this, ...args];
};
const boundLog = log.bind["this value", 1, 2];
const boundLog2 = boundLog.bind["new this value", 3, 4];
boundLog2[5, 6]; // "this value", 1, 2, 3, 4, 5, 6
5 không liên kết vẫn tuân theo quy tắc của "function list[...args] {
return args;
}
function addArguments[arg1, arg2] {
return arg1 + arg2;
}
const list1 = list[1, 2, 3];
// [1, 2, 3]
const result1 = addArguments[1, 2];
// 3
// Create a function with a preset leading argument
const leadingThirtySevenList = list.bind[null, 37];
// Create a function with a preset first argument.
const addThirtySeven = addArguments.bind[null, 37];
const list2 = leadingThirtySevenList[];
// [37]
const list3 = leadingThirtySevenList[1, 2, 3];
// [37, 1, 2, 3]
const result2 = addThirtySeven[5];
// 37 + 5 = 42
const result3 = addThirtySeven[5, 10];
// 37 + 5 = 42
// [the second argument is ignored]
8 trong không nghiêm ngặt, class Base {
constructor[...args] {
console.log[new.target === Base];
console.log[args];
}
}
const BoundBase = Base.bind[null, 1, 2];
new BoundBase[3, 4]; // true, [1, 2, 3, 4]
0 trong nghiêm ngặt". Do đó, trong chế độ không nghiêm ngặt [mặc định], function list[...args] {
return args;
}
function addArguments[arg1, arg2] {
return arg1 + arg2;
}
const list1 = list[1, 2, 3];
// [1, 2, 3]
const result1 = addArguments[1, 2];
// 3
// Create a function with a preset leading argument
const leadingThirtySevenList = list.bind[null, 37];
// Create a function with a preset first argument.
const addThirtySeven = addArguments.bind[null, 37];
const list2 = leadingThirtySevenList[];
// [37]
const list3 = leadingThirtySevenList[1, 2, 3];
// [37, 1, 2, 3]
const result2 = addThirtySeven[5];
// 37 + 5 = 42
const result3 = addThirtySeven[5, 10];
// 37 + 5 = 42
// [the second argument is ignored]
5 sẽ trả về class Base {
constructor[...args] {
console.log[new.target === Base];
console.log[args];
}
}
const BoundBase = Base.bind[null, 1, 2];
new BoundBase[3, 4]; // true, [1, 2, 3, 4]
0 vì class LateBloomer {
constructor[] {
this.petalCount = Math.floor[Math.random[] * 12] + 1;
}
bloom[] {
// Declare bloom after a delay of 1 second
setTimeout[this.declare.bind[this], 1000];
}
declare[] {
console.log[`I am a beautiful flower with ${this.petalCount} petals!`];
}
}
const flower = new LateBloomer[];
flower.bloom[];
// after 1 second, calls 'flower.declare[]'
4 đang viết cho một đối tượng khác [function list[...args] {
return args;
}
function addArguments[arg1, arg2] {
return arg1 + arg2;
}
const list1 = list[1, 2, 3];
// [1, 2, 3]
const result1 = addArguments[1, 2];
// 3
// Create a function with a preset leading argument
const leadingThirtySevenList = list.bind[null, 37];
// Create a function with a preset first argument.
const addThirtySeven = addArguments.bind[null, 37];
const list2 = leadingThirtySevenList[];
// [37]
const list3 = leadingThirtySevenList[1, 2, 3];
// [37, 1, 2, 3]
const result2 = addThirtySeven[5];
// 37 + 5 = 42
const result3 = addThirtySeven[5, 10];
// 37 + 5 = 42
// [the second argument is ignored]
7] từ những gì class LateBloomer {
constructor[] {
this.petalCount = Math.floor[Math.random[] * 12] + 1;
}
bloom[] {
// Declare bloom after a delay of 1 second
setTimeout[this.declare.bind[this], 1000];
}
declare[] {
console.log[`I am a beautiful flower with ${this.petalCount} petals!`];
}
}
const flower = new LateBloomer[];
flower.bloom[];
// after 1 second, calls 'flower.declare[]'
6 đang đọc từ [function list[...args] {
return args;
}
function addArguments[arg1, arg2] {
return arg1 + arg2;
}
const list1 = list[1, 2, 3];
// [1, 2, 3]
const result1 = addArguments[1, 2];
// 3
// Create a function with a preset leading argument
const leadingThirtySevenList = list.bind[null, 37];
// Create a function with a preset first argument.
const addThirtySeven = addArguments.bind[null, 37];
const list2 = leadingThirtySevenList[];
// [37]
const list3 = leadingThirtySevenList[1, 2, 3];
// [37, 1, 2, 3]
const result2 = addThirtySeven[5];
// 37 + 5 = 42
const result3 = addThirtySeven[5, 10];
// 37 + 5 = 42
// [the second argument is ignored]
8].Trên thực tế, một số "Phương thức" tích hợp cũng là những getters trả về các hàm ràng buộc-một ví dụ đáng chú ý là
class LateBloomer {
constructor[] {
this.petalCount = Math.floor[Math.random[] * 12] + 1;
}
bloom[] {
// Declare bloom after a delay of 1 second
setTimeout[this.declare.bind[this], 1000];
}
declare[] {
console.log[`I am a beautiful flower with ${this.petalCount} petals!`];
}
}
const flower = new LateBloomer[];
flower.bloom[];
// after 1 second, calls 'flower.declare[]'
8, khi được truy cập, trả về một hàm ràng buộc mà bạn có thể trực tiếp vượt qua như một cuộc gọi lại.
Các chức năng áp dụng một phần
Việc sử dụng đơn giản nhất tiếp theo của
function log[...args] {
"use strict"; // prevent `this` from being boxed into the wrapper object
console.log[this, ...args];
};
const boundLog = log.bind["this value", 1, 2];
const boundLog2 = boundLog.bind["new this value", 3, 4];
boundLog2[5, 6]; // "this value", 1, 2, 3, 4, 5, 6
4 là tạo một chức năng với các đối số ban đầu được chỉ định trước.Các đối số này [nếu có] tuân theo giá trị
function log[...args] {
"use strict"; // prevent `this` from being boxed into the wrapper object
console.log[this, ...args];
};
const boundLog = log.bind["this value", 1, 2];
const boundLog2 = boundLog.bind["new this value", 3, 4];
boundLog2[5, 6]; // "this value", 1, 2, 3, 4, 5, 6
5 được cung cấp và sau đó được chèn vào đầu các đối số được chuyển đến hàm đích, theo sau là bất kỳ đối số nào được chuyển đến hàm ràng buộc tại thời điểm nó được gọi.function list[...args] {
return args;
}
function addArguments[arg1, arg2] {
return arg1 + arg2;
}
const list1 = list[1, 2, 3];
// [1, 2, 3]
const result1 = addArguments[1, 2];
// 3
// Create a function with a preset leading argument
const leadingThirtySevenList = list.bind[null, 37];
// Create a function with a preset first argument.
const addThirtySeven = addArguments.bind[null, 37];
const list2 = leadingThirtySevenList[];
// [37]
const list3 = leadingThirtySevenList[1, 2, 3];
// [37, 1, 2, 3]
const result2 = addThirtySeven[5];
// 37 + 5 = 42
const result3 = addThirtySeven[5, 10];
// 37 + 5 = 42
// [the second argument is ignored]
Với setTimeout []
Theo mặc định, trong
class LateBloomer {
bloom[] {
// Declare bloom after a delay of 1 second
setTimeout[[] => this.declare[], 1000];
}
}
1, từ khóa function log[...args] {
"use strict"; // prevent `this` from being boxed into the wrapper object
console.log[this, ...args];
};
const boundLog = log.bind["this value", 1, 2];
const boundLog2 = boundLog.bind["new this value", 3, 4];
boundLog2[5, 6]; // "this value", 1, 2, 3, 4, 5, 6
5 sẽ được đặt thành function list[...args] {
return args;
}
function addArguments[arg1, arg2] {
return arg1 + arg2;
}
const list1 = list[1, 2, 3];
// [1, 2, 3]
const result1 = addArguments[1, 2];
// 3
// Create a function with a preset leading argument
const leadingThirtySevenList = list.bind[null, 37];
// Create a function with a preset first argument.
const addThirtySeven = addArguments.bind[null, 37];
const list2 = leadingThirtySevenList[];
// [37]
const list3 = leadingThirtySevenList[1, 2, 3];
// [37, 1, 2, 3]
const result2 = addThirtySeven[5];
// 37 + 5 = 42
const result3 = addThirtySeven[5, 10];
// 37 + 5 = 42
// [the second argument is ignored]
8, đó là class LateBloomer {
bloom[] {
// Declare bloom after a delay of 1 second
setTimeout[[] => this.declare[], 1000];
}
}
4 trong các trình duyệt. Khi làm việc với các phương thức lớp yêu cầu function log[...args] {
"use strict"; // prevent `this` from being boxed into the wrapper object
console.log[this, ...args];
};
const boundLog = log.bind["this value", 1, 2];
const boundLog2 = boundLog.bind["new this value", 3, 4];
boundLog2[5, 6]; // "this value", 1, 2, 3, 4, 5, 6
5 để chỉ các phiên bản lớp, bạn có thể liên kết rõ ràng function log[...args] {
"use strict"; // prevent `this` from being boxed into the wrapper object
console.log[this, ...args];
};
const boundLog = log.bind["this value", 1, 2];
const boundLog2 = boundLog.bind["new this value", 3, 4];
boundLog2[5, 6]; // "this value", 1, 2, 3, 4, 5, 6
5 với chức năng gọi lại, để duy trì thể hiện.class LateBloomer {
constructor[] {
this.petalCount = Math.floor[Math.random[] * 12] + 1;
}
bloom[] {
// Declare bloom after a delay of 1 second
setTimeout[this.declare.bind[this], 1000];
}
declare[] {
console.log[`I am a beautiful flower with ${this.petalCount} petals!`];
}
}
const flower = new LateBloomer[];
flower.bloom[];
// after 1 second, calls 'flower.declare[]'
Bạn cũng có thể sử dụng các chức năng mũi tên cho mục đích này.
class LateBloomer {
bloom[] {
// Declare bloom after a delay of 1 second
setTimeout[[] => this.declare[], 1000];
}
}
Các chức năng ràng buộc được sử dụng làm hàm tạo
Các chức năng ràng buộc được tự động phù hợp để sử dụng với toán tử
class Base {
constructor[...args] {
console.log[new.target === Base];
console.log[args];
}
}
const BoundBase = Base.bind[null, 1, 2];
new BoundBase[3, 4]; // true, [1, 2, 3, 4]
1 để xây dựng các phiên bản mới được tạo bởi hàm đích. Khi một hàm ràng buộc được sử dụng để xây dựng một giá trị, function log[...args] {
"use strict"; // prevent `this` from being boxed into the wrapper object
console.log[this, ...args];
};
const boundLog = log.bind["this value", 1, 2];
const boundLog2 = boundLog.bind["new this value", 3, 4];
boundLog2[5, 6]; // "this value", 1, 2, 3, 4, 5, 6
5 được cung cấp bị bỏ qua. Tuy nhiên, các đối số được cung cấp vẫn được chuẩn bị cho cuộc gọi xây dựng.function Point[x, y] {
this.x = x;
this.y = y;
}
Point.prototype.toString = function [] {
return `${this.x},${this.y}`;
};
const p = new Point[1, 2];
p.toString[];
// '1,2'
// The thisArg's value doesn't matter because it's ignored
const YAxisPoint = Point.bind[null, 0 /*x*/];
const axisPoint = new YAxisPoint[5];
axisPoint.toString[]; // '0,5'
axisPoint instanceof Point; // true
axisPoint instanceof YAxisPoint; // true
new YAxisPoint[17, 42] instanceof Point; // true
Lưu ý rằng bạn không cần phải làm bất cứ điều gì đặc biệt để tạo chức năng ràng buộc để sử dụng với
class Base {
constructor[...args] {
console.log[new.target === Base];
console.log[args];
}
}
const BoundBase = Base.bind[null, 1, 2];
new BoundBase[3, 4]; // true, [1, 2, 3, 4]
1. class Base {}
const BoundBase = Base.bind[null, 1, 2];
console.log[new Base[] instanceof BoundBase]; // true
7, this.x = 9; // 'this' refers to the global object [e.g. 'window'] in non-strict mode
const module = {
x: 81,
getX[] {
return this.x;
},
};
module.getX[];
// returns 81
const retrieveX = module.getX;
retrieveX[];
// returns 9; the function gets invoked at the global scope
// Create a new function with 'this' bound to module
// New programmers might confuse the
// global variable 'x' with module's property 'x'
const boundGetX = retrieveX.bind[module];
boundGetX[];
// returns 81
1, function log[...args] {
"use strict"; // prevent `this` from being boxed into the wrapper object
console.log[this, ...args];
};
const boundLog = log.bind["this value", 1, 2];
const boundLog2 = boundLog.bind["new this value", 3, 4];
boundLog2[5, 6]; // "this value", 1, 2, 3, 4, 5, 6
5, v.v ... Tất cả đều hoạt động như mong đợi, như thể hàm tạo không bao giờ bị ràng buộc. Sự khác biệt duy nhất là nó không còn có thể được sử dụng cho this.x = 9; // 'this' refers to the global object [e.g. 'window'] in non-strict mode
const module = {
x: 81,
getX[] {
return this.x;
},
};
module.getX[];
// returns 81
const retrieveX = module.getX;
retrieveX[];
// returns 9; the function gets invoked at the global scope
// Create a new function with 'this' bound to module
// New programmers might confuse the
// global variable 'x' with module's property 'x'
const boundGetX = retrieveX.bind[module];
boundGetX[];
// returns 81
0.Hệ quả là bạn không cần phải làm bất cứ điều gì đặc biệt để tạo chức năng ràng buộc để được gọi rõ ràng, ngay cả khi bạn muốn yêu cầu hàm ràng buộc chỉ được gọi bằng cách sử dụng
class Base {
constructor[...args] {
console.log[new.target === Base];
console.log[args];
}
}
const BoundBase = Base.bind[null, 1, 2];
new BoundBase[3, 4]; // true, [1, 2, 3, 4]
1. Nếu bạn gọi nó mà không có class Base {
constructor[...args] {
console.log[new.target === Base];
console.log[args];
}
}
const BoundBase = Base.bind[null, 1, 2];
new BoundBase[3, 4]; // true, [1, 2, 3, 4]
1, ràng buộc function log[...args] {
"use strict"; // prevent `this` from being boxed into the wrapper object
console.log[this, ...args];
};
const boundLog = log.bind["this value", 1, 2];
const boundLog2 = boundLog.bind["new this value", 3, 4];
boundLog2[5, 6]; // "this value", 1, 2, 3, 4, 5, 6
5 đột nhiên không bị bỏ qua.function log[...args] {
"use strict"; // prevent `this` from being boxed into the wrapper object
console.log[this, ...args];
};
const boundLog = log.bind["this value", 1, 2];
const boundLog2 = boundLog.bind["new this value", 3, 4];
boundLog2[5, 6]; // "this value", 1, 2, 3, 4, 5, 6
0Nếu bạn muốn hạn chế chức năng ràng buộc chỉ được gọi bằng
class Base {
constructor[...args] {
console.log[new.target === Base];
console.log[args];
}
}
const BoundBase = Base.bind[null, 1, 2];
new BoundBase[3, 4]; // true, [1, 2, 3, 4]
1 hoặc chỉ được gọi mà không có class Base {
constructor[...args] {
console.log[new.target === Base];
console.log[args];
}
}
const BoundBase = Base.bind[null, 1, 2];
new BoundBase[3, 4]; // true, [1, 2, 3, 4]
1, chức năng đích phải thực thi hạn chế đó, chẳng hạn như bằng cách kiểm tra function Point[x, y] {
this.x = x;
this.y = y;
}
Point.prototype.toString = function [] {
return `${this.x},${this.y}`;
};
const p = new Point[1, 2];
p.toString[];
// '1,2'
// The thisArg's value doesn't matter because it's ignored
const YAxisPoint = Point.bind[null, 0 /*x*/];
const axisPoint = new YAxisPoint[5];
axisPoint.toString[]; // '0,5'
axisPoint instanceof Point; // true
axisPoint instanceof YAxisPoint; // true
new YAxisPoint[17, 42] instanceof Point; // true
9 hoặc sử dụng lớp.Các lớp ràng buộc
Sử dụng
function log[...args] {
"use strict"; // prevent `this` from being boxed into the wrapper object
console.log[this, ...args];
};
const boundLog = log.bind["this value", 1, 2];
const boundLog2 = boundLog.bind["new this value", 3, 4];
boundLog2[5, 6]; // "this value", 1, 2, 3, 4, 5, 6
4 trên các lớp bảo tồn hầu hết các ngữ nghĩa của lớp, ngoại trừ tất cả các thuộc tính riêng của lớp hiện tại đều bị mất. Tuy nhiên, vì chuỗi nguyên mẫu được bảo tồn, bạn vẫn có thể truy cập các thuộc tính tĩnh được kế thừa từ lớp cha.function log[...args] {
"use strict"; // prevent `this` from being boxed into the wrapper object
console.log[this, ...args];
};
const boundLog = log.bind["this value", 1, 2];
const boundLog2 = boundLog.bind["new this value", 3, 4];
boundLog2[5, 6]; // "this value", 1, 2, 3, 4, 5, 6
1Chuyển đổi phương pháp thành các chức năng tiện ích
function log[...args] {
"use strict"; // prevent `this` from being boxed into the wrapper object
console.log[this, ...args];
};
const boundLog = log.bind["this value", 1, 2];
const boundLog2 = boundLog.bind["new this value", 3, 4];
boundLog2[5, 6]; // "this value", 1, 2, 3, 4, 5, 6
4 cũng hữu ích trong các trường hợp bạn muốn chuyển đổi một phương thức yêu cầu giá trị function log[...args] {
"use strict"; // prevent `this` from being boxed into the wrapper object
console.log[this, ...args];
};
const boundLog = log.bind["this value", 1, 2];
const boundLog2 = boundLog.bind["new this value", 3, 4];
boundLog2[5, 6]; // "this value", 1, 2, 3, 4, 5, 6
5 cụ thể thành hàm tiện ích đơn giản chấp nhận tham số function log[...args] {
"use strict"; // prevent `this` from being boxed into the wrapper object
console.log[this, ...args];
};
const boundLog = log.bind["this value", 1, 2];
const boundLog2 = boundLog.bind["new this value", 3, 4];
boundLog2[5, 6]; // "this value", 1, 2, 3, 4, 5, 6
5 trước đó là tham số bình thường.Lấy
function log[...args] {
"use strict"; // prevent `this` from being boxed into the wrapper object
console.log[this, ...args];
};
const boundLog = log.bind["this value", 1, 2];
const boundLog2 = boundLog.bind["new this value", 3, 4];
boundLog2[5, 6]; // "this value", 1, 2, 3, 4, 5, 6
04, ví dụ, mà bạn muốn sử dụng để chuyển đổi một đối tượng giống như mảng thành một mảng thực. Bạn có thể tạo một lối tắt như thế này:function log[...args] {
"use strict"; // prevent `this` from being boxed into the wrapper object
console.log[this, ...args];
};
const boundLog = log.bind["this value", 1, 2];
const boundLog2 = boundLog.bind["new this value", 3, 4];
boundLog2[5, 6]; // "this value", 1, 2, 3, 4, 5, 6
2Với
function log[...args] {
"use strict"; // prevent `this` from being boxed into the wrapper object
console.log[this, ...args];
};
const boundLog = log.bind["this value", 1, 2];
const boundLog2 = boundLog.bind["new this value", 3, 4];
boundLog2[5, 6]; // "this value", 1, 2, 3, 4, 5, 6
4, điều này có thể được đơn giản hóa.Trong phần sau của mã,
function log[...args] {
"use strict"; // prevent `this` from being boxed into the wrapper object
console.log[this, ...args];
};
const boundLog = log.bind["this value", 1, 2];
const boundLog2 = boundLog.bind["new this value", 3, 4];
boundLog2[5, 6]; // "this value", 1, 2, 3, 4, 5, 6
06 là hàm ràng buộc với function log[...args] {
"use strict"; // prevent `this` from being boxed into the wrapper object
console.log[this, ...args];
};
const boundLog = log.bind["this value", 1, 2];
const boundLog2 = boundLog.bind["new this value", 3, 4];
boundLog2[5, 6]; // "this value", 1, 2, 3, 4, 5, 6
07, với giá trị function log[...args] {
"use strict"; // prevent `this` from being boxed into the wrapper object
console.log[this, ...args];
};
const boundLog = log.bind["this value", 1, 2];
const boundLog2 = boundLog.bind["new this value", 3, 4];
boundLog2[5, 6]; // "this value", 1, 2, 3, 4, 5, 6
5 được đặt thành function log[...args] {
"use strict"; // prevent `this` from being boxed into the wrapper object
console.log[this, ...args];
};
const boundLog = log.bind["this value", 1, 2];
const boundLog2 = boundLog.bind["new this value", 3, 4];
boundLog2[5, 6]; // "this value", 1, 2, 3, 4, 5, 6
04. Điều này có nghĩa là các cuộc gọi function log[...args] {
"use strict"; // prevent `this` from being boxed into the wrapper object
console.log[this, ...args];
};
const boundLog = log.bind["this value", 1, 2];
const boundLog2 = boundLog.bind["new this value", 3, 4];
boundLog2[5, 6]; // "this value", 1, 2, 3, 4, 5, 6
10 bổ sung có thể được loại bỏ:function log[...args] {
"use strict"; // prevent `this` from being boxed into the wrapper object
console.log[this, ...args];
};
const boundLog = log.bind["this value", 1, 2];
const boundLog2 = boundLog.bind["new this value", 3, 4];
boundLog2[5, 6]; // "this value", 1, 2, 3, 4, 5, 6
3Thông số kỹ thuật
Đặc tả ngôn ngữ Ecmascript # sec-function.prototype.bind # sec-function.prototype.bind |
Tính tương thích của trình duyệt web
Bảng BCD chỉ tải trong trình duyệt