Dạo gần đây mình có mày mò để học Reactjs. Đang định ăn xổi bắt đầu đọc tài liệu React luôn thì nhận ra không được vì thực sự cú pháp quá mới so với Javascript thân thuộc
Vậy nên mình quyết định phải học từ những thứ cơ bản nhất là ES6.
Sau đây là những gì mình đang và cố gắng tìm hiểu nếu có phần nào sai, hoặc hiểu chưa đúng mọng mọi người góp ý với ạ
Let and Const
Let về cơ bản thì giống var nhưng nó có scope, các bạn cũng xem ví dụ sau đây:
1 2 3 4 5 6 7 8 9 10 11 12 |
<span class="token keyword">let</span> a <span class="token operator">=</span> <span class="token number">50</span><span class="token punctuation">;</span> <span class="token keyword">let</span> b <span class="token operator">=</span> <span class="token number">100</span><span class="token punctuation">;</span> <span class="token keyword">var</span> c <span class="token operator">=</span> <span class="token number">20</span><span class="token punctuation">;</span> <span class="token keyword">if</span> <span class="token punctuation">(</span><span class="token boolean">true</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token keyword">let</span> a <span class="token operator">=</span> <span class="token number">60</span><span class="token punctuation">;</span> <span class="token keyword">var</span> c <span class="token operator">=</span> <span class="token number">10</span><span class="token punctuation">;</span> console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>a<span class="token operator">/</span>c<span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token comment">// 6</span> console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>b<span class="token operator">/</span>c<span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token comment">// 10</span> <span class="token punctuation">}</span> console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>c<span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token comment">// 10</span> console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>a<span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token comment">// 50</span> |
Qua ví dụ trên thì ta chú ý thấy những điểm sau:
- giá trị của
a
được khai báo trong if hoàn toàn không ghi đè được giá trị ngoài if b
vẫn có thể sử dụng được trong if- giá trị của
c
đã bị thay đổi sau khi đi qua if
Const thì cũng không thay đổi mấy nó vẫn để khai báo hằng số thôi. Nhưng hãy vẫn lấy 1 vài ví dụ nhé:
1 2 3 4 5 6 7 8 |
<span class="token keyword">const</span> a <span class="token operator">=</span> <span class="token number">50</span><span class="token punctuation">;</span> a <span class="token operator">=</span> <span class="token number">60</span><span class="token punctuation">;</span> <span class="token operator">=></span> sẽ thông báo lỗi thì hằng không được thay đổi giá trị <span class="token keyword">const</span> a <span class="token operator">=</span> <span class="token number">20</span><span class="token punctuation">;</span> <span class="token keyword">var</span> a <span class="token operator">=</span> <span class="token number">20</span><span class="token punctuation">;</span> <span class="token keyword">let</span> a <span class="token operator">=</span> <span class="token number">20</span><span class="token punctuation">;</span> <span class="token constant">C</span>ả <span class="token number">3</span> câu lệnh trên đều xảy ra lỗi vì hằng số a đã được định nghĩa |
Nhưng const là array hay object thì sao
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 |
<span class="token keyword">const</span> <span class="token constant">MY_OBJECT</span> <span class="token operator">=</span> <span class="token punctuation">{</span><span class="token string">"key_obj"</span><span class="token operator">:</span> <span class="token string">"value_obj"</span><span class="token punctuation">}</span><span class="token punctuation">;</span> Việc gán <span class="token constant">MY_OBJECT</span> bằng <span class="token number">1</span> giá trị khác như sau<span class="token operator">:</span> <span class="token constant">MY_OBJECT</span> <span class="token operator">=</span> <span class="token punctuation">{</span><span class="token string">"abc"</span><span class="token punctuation">,</span> <span class="token string">"def"</span><span class="token punctuation">}</span> <span class="token operator">=></span> Thông báo lỗi Nhưng chúng ta hoàn toàn có thể cập nhật giá trị cho <span class="token constant">MY_OBJECT</span> <span class="token constant">MY_OBJECT</span><span class="token punctuation">.</span>key_obj <span class="token operator">=</span> <span class="token string">"value_changed"</span> <span class="token operator">=></span> <span class="token punctuation">{</span><span class="token string">"key_obj"</span><span class="token operator">:</span> <span class="token string">"value_changed"</span><span class="token punctuation">}</span> <span class="token constant">MY_OBJECT</span><span class="token punctuation">[</span><span class="token string">"new_key"</span><span class="token punctuation">]</span> <span class="token operator">=</span> <span class="token string">"new value"</span> <span class="token operator">=></span> <span class="token punctuation">{</span><span class="token string">"key_obj"</span><span class="token operator">:</span> <span class="token string">"value_changed"</span><span class="token punctuation">,</span> <span class="token string">"new_key"</span><span class="token operator">:</span> <span class="token string">"new value"</span><span class="token punctuation">}</span> <span class="token constant">T</span>ương tự với array <span class="token keyword">const</span> <span class="token constant">MY_ARRAY</span> <span class="token operator">=</span> <span class="token punctuation">[</span><span class="token number">1</span><span class="token punctuation">,</span><span class="token number">2</span><span class="token punctuation">,</span><span class="token number">3</span><span class="token punctuation">]</span> <span class="token constant">MY_ARRAY</span> <span class="token operator">=</span> <span class="token punctuation">[</span><span class="token number">4</span><span class="token punctuation">,</span><span class="token number">5</span><span class="token punctuation">,</span><span class="token number">6</span><span class="token punctuation">]</span> <span class="token operator">=></span> Thông báo lỗi My_ARRAY<span class="token punctuation">.</span><span class="token function">push</span><span class="token punctuation">(</span><span class="token parameter"><span class="token number">6</span></span><span class="token punctuation">)</span> <span class="token operator">=></span> <span class="token punctuation">[</span><span class="token number">1</span><span class="token punctuation">,</span><span class="token number">2</span><span class="token punctuation">,</span><span class="token number">3</span><span class="token punctuation">,</span><span class="token number">6</span><span class="token punctuation">]</span> |
Arrow Function
Qua ví dụ sau chúng ta sẽ thấy nó thay đổi như thế nào:
1 2 3 4 5 6 7 8 9 10 |
<span class="token comment">// Old Syntax</span> <span class="token keyword">function</span> <span class="token function">oldOne</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span><span class="token string">"Hello World..!"</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token punctuation">}</span> <span class="token comment">// New Syntax</span> <span class="token keyword">var</span> <span class="token function-variable function">newOne</span> <span class="token operator">=</span> <span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">=></span> <span class="token punctuation">{</span> console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span><span class="token string">"Hello World..!"</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token punctuation">}</span> |
Cú pháp mới cơ bản là có 2 phần:
var newOne = ()
Phầnvar newOne
như là giấy khai sinh ấy, kiểu nói cho mọi người biết “tao đã được đẻ ra rồi nhé, tên tao là newOne đấy nhé”. Còn nó làm nghề gì thì đây, phần= ()
này nói nó là 1 function chứ không phải bác sỹ hay kỹ sư.=> {}
Còn phần này thì kiểu kể về cuộc đời làm function của nó, làm những cái gì, làm như nào kết cục trả về ra sao thì viết vào trong đây.
Default Parameters
Cái này mình nghĩ thực sự nó quá quen thuộc rồi nhất là với các bạn học Ruby như mình.
Hiểu cơ bản là những params nếu không truyền vào thì không sao, nó sẽ lấy giá trị mặc định, ví dụ:
1 2 3 4 5 6 |
<span class="token keyword">let</span> <span class="token function-variable function">Func</span> <span class="token operator">=</span> <span class="token punctuation">(</span><span class="token parameter">a<span class="token punctuation">,</span> b <span class="token operator">=</span> <span class="token number">10</span></span><span class="token punctuation">)</span> <span class="token operator">=></span> <span class="token punctuation">{</span> <span class="token keyword">return</span> a <span class="token operator">+</span> b<span class="token punctuation">;</span> <span class="token punctuation">}</span> <span class="token function">Func</span><span class="token punctuation">(</span><span class="token number">20</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token comment">// 20 + 10 = 30</span> <span class="token function">Func</span><span class="token punctuation">(</span><span class="token number">20</span><span class="token punctuation">,</span> <span class="token number">20</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token comment">// 20 + 20 = 40</span> |
À nhưng mà mọi người chú ý các default parameter nên để ở cuối nhé vì nếu để như này thì sẽ không hoạt động đâu:
1 2 3 4 5 |
<span class="token keyword">let</span> <span class="token function-variable function">Func</span> <span class="token operator">=</span> <span class="token punctuation">(</span><span class="token parameter">b <span class="token operator">=</span> <span class="token number">10</span><span class="token punctuation">,</span> a</span><span class="token punctuation">)</span> <span class="token operator">=></span> <span class="token punctuation">{</span> <span class="token keyword">return</span> a <span class="token operator">+</span> b<span class="token punctuation">;</span> <span class="token punctuation">}</span> <span class="token function">Func</span><span class="token punctuation">(</span><span class="token number">20</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token operator">=></span> <span class="token number">NaN</span> |
For of loop
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 |
<span class="token keyword">let</span> string <span class="token operator">=</span> <span class="token string">"Javascript"</span><span class="token punctuation">;</span> <span class="token keyword">for</span> <span class="token punctuation">(</span><span class="token keyword">let</span> char <span class="token keyword">of</span> string<span class="token punctuation">)</span> <span class="token punctuation">{</span> console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>char<span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token punctuation">}</span> Output<span class="token operator">:</span> <span class="token constant">J</span> a v a s c r i p t |
Nhìn nhanh qua ví dụ trên chúng ta thấy ngay string[index]
sẽ là là output của mỗi vòng lặp chứ không phải index
. Cũng giống bên Ruby thôi.
Spread attributes
Theo như mình hiểu thì nó sẽ biến 1 danh sách các phần tử thành 1 mảng các phần tử.
Cùng xem ví dụ sau để hiểu hơn nhé:
Thông thường chúng ta sẽ viết
1 2 3 4 5 6 7 8 9 10 |
<span class="token keyword">let</span> <span class="token function-variable function">SumElements</span> <span class="token operator">=</span> <span class="token punctuation">(</span><span class="token parameter">arr</span><span class="token punctuation">)</span> <span class="token operator">=></span> <span class="token punctuation">{</span> console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>arr<span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token comment">// [10, 20, 40, 60, 90]</span> <span class="token keyword">let</span> sum <span class="token operator">=</span> <span class="token number">0</span><span class="token punctuation">;</span> <span class="token keyword">for</span> <span class="token punctuation">(</span><span class="token keyword">let</span> element <span class="token keyword">of</span> arr<span class="token punctuation">)</span> <span class="token punctuation">{</span> sum <span class="token operator">+=</span> element<span class="token punctuation">;</span> <span class="token punctuation">}</span> console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>sum<span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token comment">// 220. </span> <span class="token punctuation">}</span> <span class="token function">SumElements</span><span class="token punctuation">(</span><span class="token punctuation">[</span><span class="token number">10</span><span class="token punctuation">,</span> <span class="token number">20</span><span class="token punctuation">,</span> <span class="token number">40</span><span class="token punctuation">,</span> <span class="token number">60</span><span class="token punctuation">,</span> <span class="token number">90</span><span class="token punctuation">]</span><span class="token punctuation">)</span><span class="token punctuation">;</span> |
Cái chúng ta truyền vào khi gọi SumElements phải là 1 mảng, thì chúng ta có thể viết cách khác như sau:
1 2 3 4 5 6 7 8 9 10 |
<span class="token keyword">let</span> <span class="token function-variable function">SumElements</span> <span class="token operator">=</span> <span class="token punctuation">(</span><span class="token parameter"><span class="token operator">...</span>arr</span><span class="token punctuation">)</span> <span class="token operator">=></span> <span class="token punctuation">{</span> console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>arr<span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token comment">// [10, 20, 40, 60, 90]</span> <span class="token keyword">let</span> sum <span class="token operator">=</span> <span class="token number">0</span><span class="token punctuation">;</span> <span class="token keyword">for</span> <span class="token punctuation">(</span><span class="token keyword">let</span> element <span class="token keyword">of</span> arr<span class="token punctuation">)</span> <span class="token punctuation">{</span> sum <span class="token operator">+=</span> element<span class="token punctuation">;</span> <span class="token punctuation">}</span> console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>sum<span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token comment">// 220. </span> <span class="token punctuation">}</span> <span class="token function">SumElements</span><span class="token punctuation">(</span><span class="token number">10</span><span class="token punctuation">,</span> <span class="token number">20</span><span class="token punctuation">,</span> <span class="token number">40</span><span class="token punctuation">,</span> <span class="token number">60</span><span class="token punctuation">,</span> <span class="token number">90</span><span class="token punctuation">)</span><span class="token punctuation">;</span> |
Khi đó chúng ta không cần truyền vào 1 mảng nữa mà là 1 danh sách các phần tử.
Maps
Khá giống hash của Ruby nhưng chúng ta phải dùng phương thức set
và get
để thêm phần tử và lấy phần tử và mỗi 1 phần tử trong Maps gắn liền với 1 cặp [key, value]
chứ không phải {key: value}
, và các key trong 1 Maps là unique, đồng nghĩa với việc nếu bạn set 2 giá trị có cùng key thì giá trị được set sau sẽ ghi đè lên giá trị trước đó. Cùng xem ví dụ:
1 2 3 4 5 6 7 8 9 |
<span class="token keyword">var</span> map <span class="token operator">=</span> <span class="token keyword">new</span> <span class="token class-name">Map</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span> map<span class="token punctuation">.</span><span class="token function">set</span><span class="token punctuation">(</span><span class="token string">'name'</span><span class="token punctuation">,</span> <span class="token string">'John'</span><span class="token punctuation">)</span><span class="token punctuation">;</span> map<span class="token punctuation">.</span><span class="token function">set</span><span class="token punctuation">(</span><span class="token string">'name'</span><span class="token punctuation">,</span> <span class="token string">'Andy'</span><span class="token punctuation">)</span><span class="token punctuation">;</span> map<span class="token punctuation">.</span><span class="token function">set</span><span class="token punctuation">(</span><span class="token number">1</span><span class="token punctuation">,</span> <span class="token string">'number one'</span><span class="token punctuation">)</span><span class="token punctuation">;</span> map<span class="token punctuation">.</span><span class="token function">set</span><span class="token punctuation">(</span><span class="token number">NaN</span><span class="token punctuation">,</span> <span class="token string">'No value'</span><span class="token punctuation">)</span><span class="token punctuation">;</span> map<span class="token punctuation">.</span><span class="token function">get</span><span class="token punctuation">(</span><span class="token string">'name'</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token comment">// Andy. Note John is replaced by Andy.</span> map<span class="token punctuation">.</span><span class="token function">get</span><span class="token punctuation">(</span><span class="token number">1</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token comment">// number one</span> map<span class="token punctuation">.</span><span class="token function">get</span><span class="token punctuation">(</span><span class="token number">NaN</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token comment">// No value</span> |
Một số methods có sẵn sẽ thường xuyên sử dụng của Maps như:
1 2 3 4 |
map<span class="token punctuation">.</span>size<span class="token punctuation">;</span> <span class="token comment">// Trả về số phần tử</span> map<span class="token punctuation">.</span><span class="token function">keys</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token comment">// Lấy ra danh sách keys </span> map<span class="token punctuation">.</span><span class="token function">values</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token comment">// Lấy ra danh sách values.</span> |
Vì phía trên mình có bảo mỗi phần tử của Maps sẽ được lưu trữ dưới dạng [key, value]
nên khi lặp chúng ta hoàn toàn có thể thử như sau:
1 2 3 4 5 6 7 8 |
<span class="token keyword">var</span> map <span class="token operator">=</span> <span class="token keyword">new</span> <span class="token class-name">Map</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token keyword">for</span> <span class="token punctuation">(</span><span class="token keyword">let</span> <span class="token punctuation">[</span>key<span class="token punctuation">,</span> value<span class="token punctuation">]</span> <span class="token keyword">of</span> map<span class="token punctuation">)</span> <span class="token punctuation">{</span> console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>key<span class="token operator">+</span><span class="token string">" - "</span><span class="token operator">+</span>value<span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token punctuation">}</span> Output<span class="token operator">:</span> name <span class="token operator">-</span> John id <span class="token operator">-</span> <span class="token number">10</span> |
Sets
Lưu lại 1 mảng các giá trị unique
1 2 3 4 5 6 7 |
<span class="token keyword">var</span> sets <span class="token operator">=</span> <span class="token keyword">new</span> <span class="token class-name">Set</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span> sets<span class="token punctuation">.</span><span class="token function">add</span><span class="token punctuation">(</span><span class="token string">'a'</span><span class="token punctuation">)</span><span class="token punctuation">;</span> sets<span class="token punctuation">.</span><span class="token function">add</span><span class="token punctuation">(</span><span class="token string">'b'</span><span class="token punctuation">)</span><span class="token punctuation">;</span> sets<span class="token punctuation">.</span><span class="token function">add</span><span class="token punctuation">(</span><span class="token string">'a'</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token parameter">sets</span> <span class="token operator">=></span> <span class="token punctuation">[</span><span class="token string">"a"</span><span class="token punctuation">,</span> <span class="token string">"b"</span><span class="token punctuation">]</span> |
Dù thêm 2 lần "a"
nhưng trong sets chỉ có 1 giá trị "a"
.
Một số methods hữu dụng của Sets:
1 2 3 4 5 |
<span class="token keyword">var</span> sets <span class="token operator">=</span> New <span class="token function">Set</span><span class="token punctuation">(</span><span class="token punctuation">[</span><span class="token number">1</span><span class="token punctuation">,</span><span class="token number">5</span><span class="token punctuation">,</span><span class="token number">6</span><span class="token punctuation">,</span><span class="token number">8</span><span class="token punctuation">,</span><span class="token number">9</span><span class="token punctuation">]</span><span class="token punctuation">)</span><span class="token punctuation">;</span> sets<span class="token punctuation">.</span>size<span class="token punctuation">;</span> <span class="token comment">// returns 5. Size of the size.</span> sets<span class="token punctuation">.</span><span class="token function">has</span><span class="token punctuation">(</span><span class="token number">1</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token comment">// returns true. </span> sets<span class="token punctuation">.</span><span class="token function">has</span><span class="token punctuation">(</span><span class="token number">10</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token comment">// returns false.</span> |
Static methods
Không biết mình hiểu có đúng không nhưng mình nghĩ nó giống 1 dạng class methods tương tự như của Ruby: Định nghĩa bên trong class và chỉ được gọi trực tiếp thông qua class.
1 2 3 4 5 6 7 8 9 |
<span class="token keyword">class</span> <span class="token class-name">Example</span> <span class="token punctuation">{</span> <span class="token keyword">static</span> <span class="token function">Callme</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span><span class="token string">"Static method"</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token punctuation">}</span> <span class="token punctuation">}</span> Example<span class="token punctuation">.</span><span class="token function">Callme</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span> Output<span class="token operator">:</span> Static method |
Getters and Setters
Quá quen với anh em lập trình rồi, nếu bạn đã học qua về lập trình Java, Asp.NET trên trường thì cũng không lạ gì cú pháp như này rồi:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 |
<span class="token keyword">class</span> <span class="token class-name">People</span> <span class="token punctuation">{</span> <span class="token function">constructor</span><span class="token punctuation">(</span><span class="token parameter">name</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token keyword">this</span><span class="token punctuation">.</span>name <span class="token operator">=</span> name<span class="token punctuation">;</span> <span class="token punctuation">}</span> <span class="token function">getName</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token keyword">return</span> <span class="token keyword">this</span><span class="token punctuation">.</span>name<span class="token punctuation">;</span> <span class="token punctuation">}</span> <span class="token function">setName</span><span class="token punctuation">(</span><span class="token parameter">name</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token keyword">this</span><span class="token punctuation">.</span>name <span class="token operator">=</span> name<span class="token punctuation">;</span> <span class="token punctuation">}</span> <span class="token punctuation">}</span> <span class="token keyword">let</span> person <span class="token operator">=</span> <span class="token keyword">new</span> <span class="token class-name">People</span><span class="token punctuation">(</span><span class="token string">"Jon Snow"</span><span class="token punctuation">)</span><span class="token punctuation">;</span> console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>person<span class="token punctuation">.</span><span class="token function">getName</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">)</span><span class="token punctuation">;</span> person<span class="token punctuation">.</span><span class="token function">setName</span><span class="token punctuation">(</span><span class="token string">"Dany"</span><span class="token punctuation">)</span><span class="token punctuation">;</span> console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>person<span class="token punctuation">.</span><span class="token function">getName</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">)</span><span class="token punctuation">;</span> Output<span class="token operator">:</span> Jon Snow Dany |
Nếu mọi người quên hoặc chưa biết thì mình xin giải thích ngắn gọn như sau:
Contructor là hàm khởi tạo khi bạn let person = new People("Jon Snow");
thì hiểu nôm na là thực ra bạn đang gọi đến hàm constructor này và this
trong hàm này chính là đối tượng person
vừa được khởi tạo. Và nó sẽ gán thuộc tính name của đối tượng person
= giá trị chúng ta truyền vào ở new People("Jon Snow");
. Khi bạn gọi person.setName("Dany");
thì this
trong hàm này cũng chính là đối tượng gọi hàm (là person
), nói đến đây chắc mọi người cũng hiểu rồi ạ
Tài liệu tham khảo
https://codeburst.io/es6-tutorial-for-beginners-5f3c4e7960be
https://github.com/lukehoban/es6features#let–const