Gọi áp dụng thông tin liên kết javascript

Theo truyền thống trong JavaScript, bạn có thể có các đối tượng có thuộc tính và phương thức riêng. Ví dụ:

add.call(obj, 3);

1 không thể sử dụng các phương thức của

add.call(obj, 3);

2 và ngược lại

Nội dung chính Show

Sử dụng Gọi () với Nhiều đối số
Sử dụng Call() để xâu chuỗi các hàm tạo đối tượng
Sử dụng Call() để gọi một hàm ẩn danh
Sử dụng Call() để chạy một hàm với một đối tượng
Sử dụng Apply() để nối một mảng vào một mảng khác
Sử dụng Apply() để xây dựng chuỗi đối tượng
Tạo các chức năng ràng buộc với Bind()
Sử dụng Bind() để SetTimeout hoạt động
Làm cách nào để gọi() apply() và bind() trong JavaScript?
Cuộc gọi áp dụng và ràng buộc trong các câu hỏi phỏng vấn JavaScript là gì?
Đặc điểm chung của call() apply() và bind() là gì?
Làm cách nào để liên kết dữ liệu trong JavaScript?

Two separate JS objects illustrated

Hình ảnh của tác giả

Nhưng có một cách để khắc phục hạn chế này

Bạn có thể sử dụng các phương thức

add.call(obj, 3);

add.call(obj, 3);

4 và

add.call(obj, 3);

5 để buộc một hàm vào một đối tượng và gọi hàm như thể nó thuộc về đối tượng đó

call, bind, and apply can be called to use methods separated from an object

Hình ảnh của tác giả

Chúng ta hãy lần lượt đi qua ba phương pháp này và xem một số trường hợp sử dụng

Phương thức gọi () trong JavaScript

Phương thức

add.call(obj, 3);

3 gọi một hàm với ngữ cảnh được chỉ định. Nói cách khác, bạn có thể gắn một chức năng vào một đối tượng như thể nó thuộc về đối tượng đó.

Thí dụ

Hãy tạo một đối tượng

add.call(obj, 3);

7 và một hàm

add.call(obj, 3);

8 để cộng một số với một số khác

________số 8_______

Bây giờ, có vấn đề với

add.call(obj, 3);

8. Nó đang cố trả về

0 + một số giá trị. Nhưng không có thuộc tính

1 bên trong hàm. Do đó, việc gọi

0 không thành công

Nhưng như bạn có thể thấy, đối tượng

add.call(obj, 3);

7 có thuộc tính

1. Điều gì sẽ xảy ra nếu bạn có thể gọi hàm

add.call(obj, 3);

8 trên đối tượng đó như thể nó thuộc về đối tượng đó?

Điều này thực sự có thể. Để thực hiện việc này, hãy sử dụng phương thức

add.call(obj, 3);

3 để buộc tạm thời chức năng

add.call(obj, 3);

8 với đối tượng

add.call(obj, 3);

add.call(obj, 3);

Bây giờ, hàm
```
add.call(obj, 3);
```
8 nhận
```
10
```
0 của nó từ
```
add.call(obj, 3);
```
7 nơi nó bị ràng buộc với
Khi hàm
```
add.call(obj, 3);
```
8 được gọi là
```
10
```
0 đề cập đến
```
10
```
1 của
```
add.call(obj, 3);
```
7
Do đó, cuộc gọi trả về
```
10
```
6 vì
```
10
```
7

Sử dụng Gọi () với Nhiều đối số

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

add.call(obj, 3);

3 với các hàm chấp nhận nhiều đối số

Ví dụ

đầu ra

Phương thức Apply() trong JavaScript

Phương pháp

add.call(obj, 3);

4 thực hiện chính xác như phương pháp

add.call(obj, 3);

3. Sự khác biệt là

add.call(obj, 3);

3 chấp nhận một danh sách đối số, nhưng

add.call(obj, 3);

4 chấp nhận một mảng đối số

Ví dụ

đầu ra

Phương thức Bind() trong JavaScript

Trước đây bạn đã học về tác dụng của các phương thức

add.call(obj, 3);

3 và

add.call(obj, 3);

4. Như bạn đã thấy, chúng thực thi hàm ngay lập tức khi được gọi (và trả về một giá trị)

Phương pháp

add.call(obj, 3);

5 gợi nhớ đến

add.call(obj, 3);

3 và

add.call(obj, 3);

4. Nhưng thay vì thực thi một chức năng ngay lập tức,

add.call(obj, 3);

5 trả về một chức năng có thể được thực hiện sau này

Hãy sửa đổi ví dụ trước để sử dụng

add.call(obj, 3);

Vì vậy, gọi

Position 0: Matt
Position 1: Jack

0 trả về một chức năng. Trong trường hợp này, bạn gán nó cho một hằng số có tên là

Position 0: Matt
Position 1: Jack

1 rồi chạy nó

Gọi

Position 0: Matt
Position 1: Jack

2 ở đây có nghĩa là gọi hàm

add.call(obj, 3);

8 trên đối tượng

add.call(obj, 3);

7 với đối số là

Position 0: Matt
Position 1: Jack

Bây giờ bạn đã hiểu

add.call(obj, 3);

add.call(obj, 3);

4 và

add.call(obj, 3);

5 là gì và chúng hoạt động như thế nào. Dưới đây là tóm tắt về cách bạn có thể sử dụng từng cái với cùng một thiết lập chức năng đối tượng mà bạn đã thấy trước đó

đầu ra

10 10 10

Khi sử dụng Call() trong JavaScript

Chúng ta hãy xem các ví dụ về cách có thể muốn sử dụng phương pháp

add.call(obj, 3);

3 trong cuộc sống thực

Sử dụng Call() để xâu chuỗi các hàm tạo đối tượng

Ví dụ: hãy tạo một đối tượng

const numbers = [1, 2, 3];
const moreNumbers = [4, 5, 6];numbers.push.apply(numbers, moreNumbers);
console.log(numbers);

0. Hàm tạo của

const numbers = [1, 2, 3];
const moreNumbers = [4, 5, 6];numbers.push.apply(numbers, moreNumbers);
console.log(numbers);

0 được xác định bằng

const numbers = [1, 2, 3];
const moreNumbers = [4, 5, 6];numbers.push.apply(numbers, moreNumbers);
console.log(numbers);

2 và

const numbers = [1, 2, 3];
const moreNumbers = [4, 5, 6];numbers.push.apply(numbers, moreNumbers);
console.log(numbers);

Hãy cũng tạo các đối tượng

const numbers = [1, 2, 3];
const moreNumbers = [4, 5, 6];numbers.push.apply(numbers, moreNumbers);
console.log(numbers);

4 và

const numbers = [1, 2, 3];
const moreNumbers = [4, 5, 6];numbers.push.apply(numbers, moreNumbers);
console.log(numbers);

5 là

const numbers = [1, 2, 3];
const moreNumbers = [4, 5, 6];numbers.push.apply(numbers, moreNumbers);
console.log(numbers);

6. Bây giờ, thay vì khởi tạo những thứ này theo cách giống như

const numbers = [1, 2, 3];
const moreNumbers = [4, 5, 6];numbers.push.apply(numbers, moreNumbers);
console.log(numbers);

0, bạn có thể sử dụng đối tượng

const numbers = [1, 2, 3];
const moreNumbers = [4, 5, 6];numbers.push.apply(numbers, moreNumbers);
console.log(numbers);

0 để khởi tạo chúng. Điều này xảy ra thông qua phương thức

add.call(obj, 3);

Sử dụng Call() để gọi một hàm ẩn danh

Hãy tạo một hàm ẩn danh và sử dụng

add.call(obj, 3);

3 để gọi nó cho từng đối tượng của một mảng

Hàm ẩn danh thêm hàm

[1,2,3,4,5,6]

1 cho mỗi đối tượng mảng. Điều này là để làm cho nó in đúng vị trí của từng người trong hàng đợi

đầu ra

Position 0: Matt
Position 1: Jack

Sử dụng Call() để chạy một hàm với một đối tượng

Bạn đã thấy một ví dụ về điều này khi định nghĩa

add.call(obj, 3);

Bạn có thể buộc một chức năng vào một đối tượng thông qua phương thức

add.call(obj, 3);

3. Bằng cách này, bạn có thể gọi hàm như thể nó thuộc về đối tượng

Khi sử dụng Apply() trong JavaScript

Sử dụng Apply() để nối một mảng vào một mảng khác

Bạn có thể sử dụng phương thức

[1,2,3,4,5,6]

4 để nối các phần tử vào một mảng

Nếu bạn truyền một mảng cho phương thức

[1,2,3,4,5,6]

4, nó sẽ thêm toàn bộ mảng dưới dạng một phần tử vào mảng. Điều này có nghĩa là bạn có một mảng bên trong một mảng. Ở đây bạn có thể sử dụng

[1,2,3,4,5,6]

6 nhưng nó tạo ra một mảng mới

Nếu bạn muốn nối toàn bộ một mảng vào một mảng hiện có, hãy sử dụng

add.call(obj, 3);

Ví dụ

const numbers = [1, 2, 3];
const moreNumbers = [4, 5, 6];numbers.push.apply(numbers, moreNumbers);
console.log(numbers);

đầu ra

[1,2,3,4,5,6]

Sử dụng Apply() để xây dựng chuỗi đối tượng

Tương tự như việc sử dụng

add.call(obj, 3);

3 cho chuỗi hàm tạo, bạn có thể xâu chuỗi hàm tạo đối tượng bằng

add.call(obj, 3);

4. Lần này bạn chuyển một mảng chi tiết vào hàm tạo đối tượng để khởi tạo đối tượng

Khi sử dụng liên kết trong JavaScript

Tạo các chức năng ràng buộc với Bind()

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

add.call(obj, 3);

5 để tạo một hàm liên kết với một đối tượng. Bằng cách này, bất kể nó được gọi khi nào và như thế nào, nó được gọi với đối tượng mà nó được gắn với

Một ví dụ từ trước đó thực hiện chính xác điều này

Sử dụng Bind() để SetTimeout hoạt động

Đoạn mã này có vấn đề

Nó không in tên

let func = person.getName;
window.setTimeout(func, 1000);

1. Thay vào đó, nó in

let func = person.getName;
window.setTimeout(func, 1000);

Để hiểu tại sao điều này lại xảy ra, hãy viết lại dòng cuối cùng theo một cách tương đương khác

let func = person.getName;
window.setTimeout(func, 1000);

Khi

let func = person.getName;
window.setTimeout(func, 1000);

3 gọi phương thức

let func = person.getName;
window.setTimeout(func, 1000);

4 của nó, đối tượng

let func = person.getName;
window.setTimeout(func, 1000);

5 của nó là đối tượng

let func = person.getName;
window.setTimeout(func, 1000);

3. Do đó, khi

let func = person.getName;
window.setTimeout(func, 1000);

4 gọi cho

Position 0: Matt
Position 1: Jack

1, ám chỉ đến

let func = person.getName;
window.setTimeout(func, 1000);

9, nó không biết tên của người đó là gì. Để khắc phục điều này, hãy liên kết hàm với đối tượng người bằng phương thức

add.call(obj, 3);

5. Bằng cách này, bất kể bạn gọi hàm ở đâu, nó vẫn có quyền truy cập vào

const numbers = [1, 2, 3];
const moreNumbers = [4, 5, 6];numbers.push.apply(numbers, moreNumbers);
console.log(numbers);

2 của

let func = person.getName.bind(person);
setTimeout(func, 1000);

let func = person.getName.bind(person);
setTimeout(func, 1000);

đầu ra

add.call(obj, 3);

Điều này hoạt động bởi vì bây giờ

Phương thức

let func = person.getName.bind(person);
setTimeout(func, 1000);

3 được gán cho một hàm

Position 0: Matt
Position 1: Jack

1 được liên kết với đối tượng

let func = person.getName.bind(person);
setTimeout(func, 1000);

Position 0: Matt
Position 1: Jack

1 bây giờ nó là

let func = person.getName;
window.setTimeout(func, 1000);

5 chỉ vào đối tượng

let func = person.getName.bind(person);
setTimeout(func, 1000);

2. Khi bạn chuyển chức năng bị ràng buộc vào

let func = person.getName;
window.setTimeout(func, 1000);

Position 0: Matt
Position 1: Jack

1 vẫn biết cách lấy

const numbers = [1, 2, 3];
const moreNumbers = [4, 5, 6];numbers.push.apply(numbers, moreNumbers);
console.log(numbers);

2 của

let func = person.getName.bind(person);
setTimeout(func, 1000);

Phần kết luận

Trong JavaScript, bạn có thể sử dụng các phương thức

add.call(obj, 3);

add.call(obj, 3);

4 và

add.call(obj, 3);

5 để ghép một hàm với một đối tượng. Bằng cách này, bạn có thể gọi hàm trên đối tượng như thể nó thuộc về nó

```
add.call(obj, 3);
```
3 và
```
add.call(obj, 3);
```
4 là những phương pháp rất giống nhau. Cả hai đều thực thi chức năng ràng buộc trên đối tượng ngay lập tức
Phương thức
```
add.call(obj, 3);
```
5 không thực thi chức năng ngay lập tức. Thay vào đó, nó tạo và trả về một hàm liên kết có thể được thực thi sau này

Ví dụ này tóm tắt bằng cách sử dụng các phương pháp này

Cảm ơn vì đã đọc. tôi hy vọng bạn thích nó. Mã hóa vui vẻ

P. S. Đảm bảo nhận bài viết mới của tôi trong hộp thư đến của bạn. làm điều đó ở đây. Ngoài ra, để đọc thêm những câu chuyện đẳng cấp thế giới trên Medium, hãy cân nhắc trở thành thành viên. Nó chỉ tốn $5 mỗi tháng. Ngoài ra, có thể kiếm tiền bằng văn bản của bạn nữa. Khi tôi bắt đầu, tôi đã kiếm được 5.000 đô la trong 6 tháng đầu tiên với các bài viết về lập trình. Bằng cách đăng ký bằng liên kết này, bạn sẽ hỗ trợ tôi bằng một phần phí của bạn mà bạn không phải trả thêm phí. nếu được thì cám ơn nhiều

Làm cách nào để gọi() apply() và bind() trong JavaScript?

Sử dụng. gọi() hoặc. apply() khi bạn muốn gọi hàm ngay lập tức và sửa đổi ngữ cảnh. Gọi/áp dụng gọi hàm ngay lập tức, trong khi liên kết trả về một hàm mà khi được thực thi sau đó, sẽ có ngữ cảnh chính xác được đặt để gọi hàm ban đầu .

Cuộc gọi áp dụng và ràng buộc trong các câu hỏi phỏng vấn JavaScript là gì?

Giải thích các phương thức call(), apply() và bind(). Đó là một phương thức được xác định trước trong javascript . Phương thức này gọi một phương thức (hàm) bằng cách chỉ định đối tượng chủ sở hữu.

Đặc điểm chung của call() apply() và bind() là gì?

Các phương thức gọi, liên kết và áp dụng có thể được sử dụng để đặt từ khóa this độc lập với cách gọi hàm . Phương thức bind tạo một bản sao của hàm và thiết lập từ khóa this, trong khi phương thức call và apply thiết lập từ khóa this và gọi hàm ngay lập tức.

Làm cách nào để liên kết dữ liệu trong JavaScript?

Ràng buộc dữ liệu trong khái niệm khá đơn giản. Một mặt, bạn có mô hình dữ liệu và mặt khác, bạn có giao diện, thường được gọi là dạng xem. Ý tưởng là bạn muốn "liên kết" một số phần dữ liệu với thứ gì đó trên dạng xem để khi dữ liệu thay đổi, dạng xem sẽ thay đổi. Đây là điển hình cho dữ liệu chỉ đọc