kiến thức Javascript cho người mới bắt đầu
- Thread starter Nanatu
- Start date
NoOneKnowMe
Junior Member
First-class functions: A programming language is said to have First-class functions when functions in that language are treated like any other variable.
Higher-order function: A function which takes a function as an argument and/or returns a function.
Pure function: A function is pure if the return value is only determined by its input values, and does not produce side effects. The function must always return the same result when given the same input.
Side-effects: A function or expression is said to have a side effect if apart from returning a value, it interacts with (reads from or writes to) external mutable state.
NoOneKnowMe
Junior Member
Toán tử logic trong js hoạt động khác xíu đó bạn, trong js có 1 list dữ liệu được gọi là falsy value
Toán tử && sẽ hoạt động theo cơ chế: true && true => true, false && true => false, true && false => false (vậy thì theo bảng ở trên 1 && 0 => 0 chứ không phải trả về bool, 1 && 2 => 2 tương tự, như trong react họ hay có cách viết là condition && <Component />). Đối với || thì ngược lại && nhưng phương pháp chạy cũng gần như vậy.
Ngoài ra đối với ! cũng có cách viết rất hay là !! explicit coercion thay vì để implicit coercion/Boolean(value)
bi ban khong ly do v2
Senior Member
1 vote cho chủ thớt chia sẻ kiến thức nhé
Nhưng nên định nghĩa cho chuẩn nhé. Const là hằng số chứ k phải biến số. Sự khác nhau giữa hằng và biến ntn thì xin mời đọc lại về số học đại cương.
Những khái niệm cơ bản ntn rất quan trọng. Có những bạn sv ra trường đi làm mình training, hỏi câu phân biệt giữa biến và hằng, khi nào dùng biến, khi nào dùng hằng mà k phân biệt đc
via theNEXTvoz for iPhone
Nhưng nên định nghĩa cho chuẩn nhé. Const là hằng số chứ k phải biến số. Sự khác nhau giữa hằng và biến ntn thì xin mời đọc lại về số học đại cương.
Những khái niệm cơ bản ntn rất quan trọng. Có những bạn sv ra trường đi làm mình training, hỏi câu phân biệt giữa biến và hằng, khi nào dùng biến, khi nào dùng hằng mà k phân biệt đc
via theNEXTvoz for iPhone
Nanatu
Senior Member
1 vote cho chủ thớt chia sẻ kiến thức nhé
Nhưng nên định nghĩa cho chuẩn nhé. Const là hằng số chứ k phải biến số. Sự khác nhau giữa hằng và biến ntn thì xin mời đọc lại về số học đại cương.
Những khái niệm cơ bản ntn rất quan trọng. Có những bạn sv ra trường đi làm mình training, hỏi câu phân biệt giữa biến và hằng, khi nào dùng biến, khi nào dùng hằng mà k phân biệt đc
via theNEXTvoz for iPhone
Vâng ạ, e check lại thì thấy nói sau mất câu"khai báo biến''.
Sắp tới trong khi bác lướt voz thì có thể bỏ 1 chút time ghé qua thread của e đc k ạ? Chỗ nào e có nói sai bác góp ý giúp e với
Viemlanang1234
Senior Member
Em đặt gạch hóng thớt 
hikaruu
Senior Member
- First-class functions , function co the truyen vao nhu 1 bien
- Higher-order function, function tra ve 1 function khac
- Pure functions , ket qua cua function chi phu thuoc vao input cua function
- Side-effects, bien nam ngoai function tac dong den cac gia tri khai bao ben trong function
)
changtraihomqua_123
Senior Member
Bác ko bỏ vài cái project vào thì mấy cty nó ko có gọi đâu
Nanatu
Senior Member
5. Array và Object
5.1 Array(mảng)
Không để mất time chứng ta vào ngay bài học, đầu tiên là array(mảng):
Hồi e học e có tìm hiểu rất nhiều về: mảng là gì, tại sao phải sử dụng mảng nhưng e nhận ra chỉ có cách giải thích trên w3s là ngắn gọn và dễ hiểu nhất. Trước khi đi vào giải thích, e nên nói về 1 kiến thức mà chắc ít bác mới học để ý đến. Ở trên có bác nói, kiến thức basic rất là quan trọng. Đúng vậy, nó là tiền đề để ta có thể tiếp thu kiến thức khác 1 cách nhanh chóng và dễ hiểu hơn. Như ta đã biết. Biến lưu trữ giá trị, khi học về biến các bác đã thử lưu từ 2 giá trị trở lên cho cùng 1 biến trong cùng 1 thời gian chưa?
Ta nhận đc cảnh báo lỗi đều là không mong muốn, vậy điều này có nghĩa là k thể gán 2 giá trị cho 1 biến cùng 1 lúc hoặc cú pháp khai báo của e là sai.
Một lớp học thêm mới mở có 3 học sinh, nếu dùng biến đơn(Biến đơn là biến chỉ lưu trữ 1 giá trị, ví dụ như let a= 2, let name = 'son') để lưu tên các học sinh thì ta sẽ phải dùng 3 biến đơn. Nếu sau 1 time, hs join vào lớp và số lượng hs tăng lên thành 30, để lưu tên thì chẳng lẽ ta dùng 30 biến đơn hay sao. Có cách nào chỉ dùng 1 biến mà lưu trữ hết 30 tên hs đó hay k? Từ đó, ta có khái niệm về mảng.
Mảng có thể dùng để lưu trữ nhiều giá trị cùng 1 lúc
Cũng như khai báo các các kiểu dữ liệu number, string,... array cũng có 2 cách khai báo.
- Khai báo thông thường, sử dụng []
- Khai báo use từ khóa new
Khi kháo báo ta có thể nhập giá trị ban đầu hoặc để rỗng.
Nói thêm 1 chút, như hồi e học C++ nó sẽ có cấp phát bộ nhớ, nhất là khi làm việc với mảng sẽ rất tốn thêm time để xử lí bộ nhớ. Nhưng ở js, sẽ tự động tạo và giải phóng khi k sử dụng. Tự động thì tự động , các bác phải quan tâm và quản lí đc bộ nhớ của mình mỗi khi code
Tiếp theo ta sẽ học về cách truy cập các phần tử trong .
Ảnh trên nói lên tất cả, array đánh số từ 0 đến hết, suy ra nếu mảng có n phần tử thì index của phần tử cuối sẽ là n-1.
Để truy cập vào phần tử trong mảng ta chỉ cần sử dụng cú pháp: Array[n-1]
Hoặc ta có thể thêm phần tử vào mảng bằng cách sử dụng
Các bác vào trình duyệt hiển thị file HTMl của mình, bấm vào mũi tên, ta sẽ hiện đc bảng thể hiện thuộc tính và phương thức của mảng.
View attachment 1430696
Về thuộc tính chỉ hiện 1 thuộc tính duy nhất là length( độ dài). Như string, để truy cập độ dài của mảng ta sử dụng cú pháp Array.length
Ở đoạn code trên, e thay đổi length = 10 nhưng chỉ gán value cho 3 phần tử đầu. Vậy 7 phần tử sau sẽ có value như thế nào? Quay lại bài các kiểu dữ liệu, khi khai báo biến mà k gắn giá trị thì biến nó sẽ có value và type( giá trị và kiểu dữ liệu) là undefined. Array cũng như vậy, value 7 phần đó sẽ là undefined. Hiểu đơn giản hơn, ta có 10 ghế trống, cho 3 người ngồi 3 ghế đầu, còn 7 ghế sau trống, 7 ghế đó cứ để đó, nào có hs đến thì ta lại sắp xếp ngồi trong 7 ghế đó. Nhưng nếu ta lỡ sắp xếp vào 1 trong 3 ghế đầu thì sẽ như nào? Thì sẽ có 1 trong 3 e đến trc bị đuổi nhường chỗ cho e đến sau, array cũng vậy khi cố tình thì nó sẽ ghi đè lại giá trị ta đã có(đây là 1 cáh thay đổi giá trị trong array). Tương tự, các bác thử gán value cho phần tử thứ 6 rồi log ra để xem kết quả như nào.
Nói về length như thế e nghĩ có vẻ là ổn, ta sang tiếp phần prototype(phương thức). Phần này là trung tâm cốt lỗi của mảng, dùng để thao tác xử lí mảng( cắt, thêm, sắp xếp,...) E chỉ liệt kê vài phương thức mà e nghĩ là hay dùng đủ cho việc học, những phương thức còn lại sẽ các bác sẽ tiếp dần khi ta đi làm.
unshift(): Thêm phần tử vào đầu mảng
push(): Thêm phần tử vào cuối mảng
shift(): Xóa phần tử đầu mảng
pop(): Xóa phần tử cuối mảng
splice(): xóa các phần từ. Vì sao e nói là "các", nếu muốn xóa 4 phần tử đầu thì dùng nó
join():Chuyển array thành chuỗi với khoảng cách giữa các element tùy chỉnh. Bác nào code js thuần thì làm việc với cái này như cơm
concat(): Nối mảng
toString(): Chuyển array thành chuỗi nhưng khoảng cách giữa các element có dấu phẩy ngăn
filter(): Lọc mảng và trả về 1 mang mới gồm các phần tử thỏa mãn điều
find(): Tìm kiếm phần tử thỏa mãn yêu cầu xuất hiện đầu tiên trong array. Khi tìm xong thì sẽ trả về và kết thúc tìm kiếm
forEach()
map()
Rất nhiều bác dễ nhầm lẫn và không biết use forEach() hay map() trong từng case. Vì 2 cái này công dụng như nhau, nhưng cách thức hoạt động và hàm trả về lại khác nhau hoàn toàn. forEach() và map() đều làm thay đổi giá trị trong mảng theo đúng yêu cầu của mình, nhưng forEach() nó sẽ không trả lại giá trị nào trong khi map thì lại có. Và 1 điều hết sức qtrong là forEach() nó hoạt động bằng cách dùng hàm callback và thay đổi giá trị ban đầu của mảng, tức là ta sẽ mất đi mảng cũ. Trong khi đó map() nó sẽ trả về 1 mảng mới bằng với số lượng mảng cũ, và không thay đổi giá trị mảng cũ.
Em nghĩ bài này nên end ở đây, còn object thì để xuống bài sau vì còn dành time cho các bác code lại nhất là phần các phương thức xử lí mảng. 14 phương thức đó tất nhiên k phải tất cả, nhưng e nghĩ các bác nên code ví dụ từng cái rồi xem cách thức hoạt động và nó return ra cái gì thì mới nhớ lâu đc. Hồi e học lập trình rất hay code linh tinh xem nó đúng hay sai, ở trên e có nói về biến đơn, hồi đó e code biến đơn gán 2 giá trị( thử từng cái với từ khóa khai báo biến). Và tất nhiên nó báo error , e coppy cái error đó lên mạng tìm hiểu xem vì sao lại sai.
5.1 Array(mảng)
Không để mất time chứng ta vào ngay bài học, đầu tiên là array(mảng):
Hồi e học e có tìm hiểu rất nhiều về: mảng là gì, tại sao phải sử dụng mảng nhưng e nhận ra chỉ có cách giải thích trên w3s là ngắn gọn và dễ hiểu nhất. Trước khi đi vào giải thích, e nên nói về 1 kiến thức mà chắc ít bác mới học để ý đến. Ở trên có bác nói, kiến thức basic rất là quan trọng. Đúng vậy, nó là tiền đề để ta có thể tiếp thu kiến thức khác 1 cách nhanh chóng và dễ hiểu hơn. Như ta đã biết. Biến lưu trữ giá trị, khi học về biến các bác đã thử lưu từ 2 giá trị trở lên cho cùng 1 biến trong cùng 1 thời gian chưa?
Ta nhận đc cảnh báo lỗi đều là không mong muốn, vậy điều này có nghĩa là k thể gán 2 giá trị cho 1 biến cùng 1 lúc hoặc cú pháp khai báo của e là sai.
Một lớp học thêm mới mở có 3 học sinh, nếu dùng biến đơn(Biến đơn là biến chỉ lưu trữ 1 giá trị, ví dụ như let a= 2, let name = 'son') để lưu tên các học sinh thì ta sẽ phải dùng 3 biến đơn. Nếu sau 1 time, hs join vào lớp và số lượng hs tăng lên thành 30, để lưu tên thì chẳng lẽ ta dùng 30 biến đơn hay sao. Có cách nào chỉ dùng 1 biến mà lưu trữ hết 30 tên hs đó hay k? Từ đó, ta có khái niệm về mảng.
Mảng có thể dùng để lưu trữ nhiều giá trị cùng 1 lúc
Cũng như khai báo các các kiểu dữ liệu number, string,... array cũng có 2 cách khai báo.
- Khai báo thông thường, sử dụng []
- Khai báo use từ khóa new
Khi kháo báo ta có thể nhập giá trị ban đầu hoặc để rỗng.
Nói thêm 1 chút, như hồi e học C++ nó sẽ có cấp phát bộ nhớ, nhất là khi làm việc với mảng sẽ rất tốn thêm time để xử lí bộ nhớ. Nhưng ở js, sẽ tự động tạo và giải phóng khi k sử dụng. Tự động thì tự động , các bác phải quan tâm và quản lí đc bộ nhớ của mình mỗi khi code
Tiếp theo ta sẽ học về cách truy cập các phần tử trong .
Ảnh trên nói lên tất cả, array đánh số từ 0 đến hết, suy ra nếu mảng có n phần tử thì index của phần tử cuối sẽ là n-1.
Để truy cập vào phần tử trong mảng ta chỉ cần sử dụng cú pháp: Array[n-1]
Hoặc ta có thể thêm phần tử vào mảng bằng cách sử dụng
Các bác vào trình duyệt hiển thị file HTMl của mình, bấm vào mũi tên, ta sẽ hiện đc bảng thể hiện thuộc tính và phương thức của mảng.
View attachment 1430696
Về thuộc tính chỉ hiện 1 thuộc tính duy nhất là length( độ dài). Như string, để truy cập độ dài của mảng ta sử dụng cú pháp Array.length
Ở đoạn code trên, e thay đổi length = 10 nhưng chỉ gán value cho 3 phần tử đầu. Vậy 7 phần tử sau sẽ có value như thế nào? Quay lại bài các kiểu dữ liệu, khi khai báo biến mà k gắn giá trị thì biến nó sẽ có value và type( giá trị và kiểu dữ liệu) là undefined. Array cũng như vậy, value 7 phần đó sẽ là undefined. Hiểu đơn giản hơn, ta có 10 ghế trống, cho 3 người ngồi 3 ghế đầu, còn 7 ghế sau trống, 7 ghế đó cứ để đó, nào có hs đến thì ta lại sắp xếp ngồi trong 7 ghế đó. Nhưng nếu ta lỡ sắp xếp vào 1 trong 3 ghế đầu thì sẽ như nào? Thì sẽ có 1 trong 3 e đến trc bị đuổi nhường chỗ cho e đến sau, array cũng vậy khi cố tình thì nó sẽ ghi đè lại giá trị ta đã có(đây là 1 cáh thay đổi giá trị trong array). Tương tự, các bác thử gán value cho phần tử thứ 6 rồi log ra để xem kết quả như nào.
Nói về length như thế e nghĩ có vẻ là ổn, ta sang tiếp phần prototype(phương thức). Phần này là trung tâm cốt lỗi của mảng, dùng để thao tác xử lí mảng( cắt, thêm, sắp xếp,...) E chỉ liệt kê vài phương thức mà e nghĩ là hay dùng đủ cho việc học, những phương thức còn lại sẽ các bác sẽ tiếp dần khi ta đi làm.
unshift(): Thêm phần tử vào đầu mảng
push(): Thêm phần tử vào cuối mảng
shift(): Xóa phần tử đầu mảng
pop(): Xóa phần tử cuối mảng
splice(): xóa các phần từ. Vì sao e nói là "các", nếu muốn xóa 4 phần tử đầu thì dùng nó
join():Chuyển array thành chuỗi với khoảng cách giữa các element tùy chỉnh. Bác nào code js thuần thì làm việc với cái này như cơm
concat(): Nối mảng
toString(): Chuyển array thành chuỗi nhưng khoảng cách giữa các element có dấu phẩy ngăn
filter(): Lọc mảng và trả về 1 mang mới gồm các phần tử thỏa mãn điều
find(): Tìm kiếm phần tử thỏa mãn yêu cầu xuất hiện đầu tiên trong array. Khi tìm xong thì sẽ trả về và kết thúc tìm kiếm
forEach()
map()
Rất nhiều bác dễ nhầm lẫn và không biết use forEach() hay map() trong từng case. Vì 2 cái này công dụng như nhau, nhưng cách thức hoạt động và hàm trả về lại khác nhau hoàn toàn. forEach() và map() đều làm thay đổi giá trị trong mảng theo đúng yêu cầu của mình, nhưng forEach() nó sẽ không trả lại giá trị nào trong khi map thì lại có. Và 1 điều hết sức qtrong là forEach() nó hoạt động bằng cách dùng hàm callback và thay đổi giá trị ban đầu của mảng, tức là ta sẽ mất đi mảng cũ. Trong khi đó map() nó sẽ trả về 1 mảng mới bằng với số lượng mảng cũ, và không thay đổi giá trị mảng cũ.
Em nghĩ bài này nên end ở đây, còn object thì để xuống bài sau vì còn dành time cho các bác code lại nhất là phần các phương thức xử lí mảng. 14 phương thức đó tất nhiên k phải tất cả, nhưng e nghĩ các bác nên code ví dụ từng cái rồi xem cách thức hoạt động và nó return ra cái gì thì mới nhớ lâu đc. Hồi e học lập trình rất hay code linh tinh xem nó đúng hay sai, ở trên e có nói về biến đơn, hồi đó e code biến đơn gán 2 giá trị( thử từng cái với từ khóa khai báo biến). Và tất nhiên nó báo error , e coppy cái error đó lên mạng tìm hiểu xem vì sao lại sai.
HutCanPheLam
Member
. Cái lâu lâu vào ôn lý thuyết, code angular rùi ít động lại
kiwi725
Senior Member
trong js có toán tử bitwise k bác
NoOneKnowMe
Junior Member
có nghen bạn
digiaodo
Senior Member
Mình bổ sung thêm cái khẩu quyết mình dùng để học toán tử logic trong javascript:
- Tất cả đều quy về truly và falsy. Toán tử && sẽ trả về giá trị gốc của cái falsy đầu tiên, nếu không có falsy thì trả về giá trị gốc của cái cuối cùng => Ví dụ: (1 && "abc" && true && 3) sẽ trả về 3 vì cả dãy ko có giá trị nào falsy cả nên trả về giá trị gốc của cái cuối cùng, tức là 3.
- || thì ngược lại.
regnickcungla2caitoisao
Senior Member
Ủng hộ thớt, mình kỹ sư phần mềm lớp dev chính hiệu cơ mà ra làm trái ngành mấy năm ko còn nhớ cái gì, định học react làm lại cái web cá nhân
Dev cùi
Senior Member
Mình đóng góp như này
Quá trình compile code của javascript như sau.
1. Call stack: Call Stack là một cấu trúc dữ liệu dạng ngăn xếp (stack) dùng để chứa thông tin về hoạt động của chương trình máy tính trong lúc thực thi. Khi xảy ra lỗi sẽ nhìn thấy ở log, ví dụ như stack trace, stack overflow(xảy ra 1 vòng lặp quá kích thước tối đa của stack)
2. JavaScript Runtime: JS Runtime là browser's JS runtime environment. Và nó bao gồm những thành phần sau đây: Event loop, Web APIs, Callback Queue
3. Cơ chế event loop: Khi các dòng lệnh chuẩn bị thực thi thực thi. JS runtime sinh ra 1 sự kiện tên là Event Loop, sự kiện này được chạy trong suốt quá trình runtime. Sự kiện này đưa các dòng lệnh vào call stack, web APIs, Callback Queue
4. Cơ chế bất đồng bộ: Từ cơ chế event loop, Js run time có 1 bộ đếm timer(), hàm này giúp đếm thời gian thực thi của stack, nếu stack nào có sử dụng web APIs (setTimeout, xhr, connection, http request v.v.v) => bộ đếm timer sẽ lớn. event loop sẽ đưa stack đó vào Queue để thực thi và stack tiếp theo được thực hiện, sau khi stack có timer lớn thực hiện xong thì sẽ trả về kết quả ==> nguyên nhân vì sao xảy ra tình trạng bất đồng bộ.
Có gì sai xót các fen góp ý giúp
banhmisg9509
Senior Member
mấy cái khái niệm cơ bản + nâng cao về JS các bác có thể tìm đọc ở đây.
https://github.com/leonardomso/33-js-concepts
Đặc biệt phần callstack mình thấy có series 4 bài viết này giải thích rất dễ hiểu và sâu về callstack, hoisting, closure, scope và scope chain, this, thông qua 1 khái niệm gọi là Execution-Context https://cabulous.medium.com/javascr...rt-1-from-compiling-to-execution-84c11c0660f5
https://github.com/leonardomso/33-js-concepts
Đặc biệt phần callstack mình thấy có series 4 bài viết này giải thích rất dễ hiểu và sâu về callstack, hoisting, closure, scope và scope chain, this, thông qua 1 khái niệm gọi là Execution-Context https://cabulous.medium.com/javascr...rt-1-from-compiling-to-execution-84c11c0660f5
digiaodo
Senior Member
4. Tất cả các async callback gọi bởi Web APIs (setInterval(), setTimeout()...) sẽ được cho vào callback queue. Có nghĩa là kể cả khi bạn dùng cái setTimeOut và truyền cho nó 1 callback kèm thời gian chờ bằng 0 thì callback đó vẫn được cho vào callback queue chứ ko phải là dự vào thời gian thực thi để đưa vào.
Có thể test thử đoạn code này để thấy:
JavaScript:
console.log(1);
setTimeout(() => console.log(2), 0);
console.log(3);
console.log(4);
console.log(5);
console.log(6);
console.log(7);
console.log(8);
console.log(9);
console.log(10);
Last edited:
Similar threads
