Asked Dec 20th, 2018 4:27 AM 182 1 3
  • 182 1 3
+1

Sự khác nhau khi gọi hàm thực thi trong ComponentWillMount và hàm setState()

Share
  • 182 1 3

Em có thắc mắc thế này, trong ví dụ này của e : https://codesandbox.io/s/j4n1ojpr1w

Tại sao trong componentWillMount() khi gọi hàm printCount phải có dấu (), còn khi gọi trong call back của hàm setState mình lại không cần ạ. Mọi người giải thích giùm e với.

E xin cảm ơn nhiều ạ !

3 ANSWERS


Answered Dec 20th, 2018 6:08 AM
Accepted
+11

Có một vài điểm em cần nắm rõ, thì sẽ hiểu được bản chất của vấn đề hơn 😃

Một function trong Javascript thực tế cũng chỉ là một object, nên em có thể thực hiện các phép gán, hay pass các object đó vào trong một hàm khác. Ví dụ

function test() {
    console.log('Hello');
}

a = test;
a(); // gọi hàm, in ra Hello

Việc em dùng () thì là một lời gọi hàm, còn không có, thì nó chỉ như một biến (object) bình thường mà thôi.

Như vậy this.printCount(); thì là lời gọi để chạy hàm printCount, còn this.setState({ count: this.state.count + 1 }, this.printCount); thì tức là em truyền this.printCount như là một biến vào trong hàm this.setState(). Khi đó người ta gọi this.printCount là một callback, và nó chưa được gọi (chưa được chạy) ngay. Việc gọi hàm đó được thực hiện ở đâu đó trong phần logic bên trong hàm setState.

Share
Avatar Hoang vn @wiliamfeng
Dec 20th, 2018 6:53 AM

tks anh rất nhiều ạ !

+1
| Reply
Share
Dec 20th, 2018 9:07 AM
+1
| Reply
Share
Answered Dec 20th, 2018 4:41 AM
+2

khi gọi hàm printCount phải có dấu () vì ở đây đang thực thi hàm khi gọi trong call back của hàm setState mình lại không cần vì đang truyền hàm làm tham số

Share
Avatar Hoang vn @wiliamfeng
Dec 20th, 2018 4:52 AM

==> ý bạn nghĩa là khi ta truyền tham số là một hàm thì sẽ không cần sử dụng dấu () nữa .

Mình có thử thêm () vào sau hàm printCount () ở hàm setState thì nó vẫn chạy, nhưng hình như nó lại chạy trước cả hàm setState(), bạn có thể giải thích thêm chỗ này cho mình với được không?

0
| Reply
Share
Avatar Kieu Quoc Hung @KieuQuocHung
Dec 20th, 2018 5:58 AM

@wiliamfeng Hàm setState có thể có dạng như này

function setState(data, callback) {
  state = data;
  callback();
}
+1
| Reply
Share
Answered Dec 20th, 2018 4:34 AM
+1

Dấu () tức để để thực hiện luôn cái funciton đấy. Vì cái argument thứ 2 của setState nó nhận một function callback, callback này được chạy trong setState. Chính vì thế lúc này mình không có dấu () để callback không chạy trước khi setState chạy.

Share
Avatar Hoang vn @wiliamfeng
Dec 20th, 2018 4:37 AM
cái argument thứ 2 của setState nó nhận một function callback, callback này được chạy trong setState.
====>  Chính vì thế lúc này mình không có dấu ()

Trời !!!!!!!! Sao giải thích kì vậy anh ? cái argument thứ 2 của setState nó nhận một function callback, callback này được chạy trong setState ==> cái này thì ai nhìn vào chả biết thế ạ.

setState nó nhận một function callback xong lại callback này được chạy trong setState. Ủa hai câu này là một mà

0
| Reply
Share
Dec 20th, 2018 9:03 AM

@wiliamfeng Ừ nhỉ, đọc lại mới thấy mình giải thích hơi kỳ. Đúng ra phải nói rõ bản chất thì e mới hiểu được. Srr em nhé. Em đọc answer của anh Thang Tran Duc bên trên để hiểu rõ bản chất của nó nhé. Nếu không hiểu được bản chất thì đọc answer của anh đúng là hơi khó hiểu thật.

+1
| Reply
Share
Viblo
Let's register a Viblo Account to get more interesting posts.