1. Các toán tử
1.1. gán - assignment
1.1.1. = ; += ; -= ; *= ; /= ; %= ; **=
1.2. số học - Arithmetic
1.2.1. + - * / % ++ -- **
1.2.1.1. Prefix - Tiền tố ++a : thực hiện xong,trả về giá trị sau thực hiện
1.2.1.2. Postfix - Hậu tố a++: trả về giá trị trước khi thực hiện
1.3. so sánh - Comparison
1.3.1. == ; ===; != ; !==;
1.4. logic - Logical
1.4.1. && ; || ; !
2. var width = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth;
3. phương thức : v.D: var person = { lastName: "cuong", firstName: "tv" age: 18, getName = function() { return this.lastName + " " + this.firstName; } }
4. scrollbars=yes|no|1|0: có hiển thị thanh cuộn hay không?
5. Cơ bản
5.1. Định nghĩa
5.1.1. -Là ngôn ngữ lập trình của website,đc tích hợp vào HTML giúp web sống động hơn -Hoạt động trên nhiều trình duyệt,nhanh hơn, nhẹ hơn các ngôn ngữ lập trình khác
5.2. 3 hàm Built-in cơ bản
5.2.1. ngoài ra còn console,setTimeOut, setInterval
5.2.1.1. setTimeOut(function, timedelay) - Chạy 1 lần - dừng dùng: clearTimeOut
5.2.1.2. setInterval(function, time) tương tự setTimeOut
5.2.1.3. console: .log .error .clear .table .info...
5.2.2. alert(): thông báo 1 popup
5.2.3. confirm(): thông báo một pop và người dùng chọn Y/N return T/F
5.2.4. prompt(): thông báo một pop và người dùng input
5.3. Khai báo biến - Variables tính chất Scope và Hoisting
5.3.1. var
5.3.1.1. Scope: Global ( nếu trong 1 function thì là function/locally scoped - Có thể khai báo lại - Có Hoisting, được khai báo vs giá trị undefined
5.3.2. let
5.3.2.1. Scope: Block scope - phạm vi khối, biến đc khai báo trong khối không thể sử dụng ngoài khối - Chỉ được phép cập nhật biến,không được khai báo lại - Có Hoisting: không khởi tạo giá trị nào, nếu không khai báo trước sẽ gặp lỗi tham chiếu Reference Error!
5.3.3. const
5.3.3.1. Scope: Block - Không khai báo lại,không cập nhật ( chỉ có thể cập nhật giá trị của 1 thuộc tính) - Hoisting giống let - khai báo phải có giá trị
5.4. Các trường hợp false: - false - số không - "" rỗng -null -undefined -NaN V.D: console.log(Boolean(NaN))// false
5.5. Kiểu dữ liệu
5.5.1. Primitive Data Dữ liệu nguyên thủy
5.5.1.1. Number
5.5.1.2. String
5.5.1.3. Boolean
5.5.1.3.1. Truthy : true
5.5.1.3.2. Falsy : false
5.5.1.4. undefined
5.5.1.5. null
5.5.1.5.1. dùng isNull
5.5.1.6. symbol
5.5.2. Complex Data Dữ liệu phức tạp
5.5.2.1. function
5.5.2.1.1. Khai báo
5.5.2.1.2. Phạm vi (Scope)
5.5.2.2. Objects
5.5.2.2.1. Array
5.5.2.2.2. Object
6. BOM
6.1. Định nghĩa
6.1.1. Browser Object Model, hay còn gọi là các đối tượng liên quan đến trình duyệt browser.
6.1.2. Window
6.1.3. Screen
6.1.4. Location
6.1.5. History
6.1.6. Navigator
6.1.7. Popup
6.1.8. Timing
6.1.9. Cookies
6.2. Window
6.2.1. Kích thước của trình duyệt
6.2.1.1. var height = window.innerHeight || ocument.documentElement.clientHeight || document.body.clientHeight;
6.2.2. Mở một cửa sổ lên
6.2.2.1. window.open(url, name, options)
6.2.2.1.1. url : là đường dẫn website bạn muốn mở
6.2.2.1.2. name: là tên bạn đặt cho cửa sổ này
6.2.2.1.3. options: là một chuỗi các thông số được cách nhau bởi dấu phẩy,
6.2.3. Đóng một cửa sổ
6.2.3.1. windowObj.close()
6.2.4. Di chuyển cửa sổ
6.2.4.1. windowObj.moveTo(top, left)
6.2.4.1.1. top: là số pixels so với lề trên
6.2.4.1.2. left: là số pixels so với lề trái
6.2.5. Resize cửa sổ
6.2.5.1. windowObj.resizeTo(width, height)
6.3. Location
6.3.1. Tải lại trang web
6.3.1.1. window.location.reload(url)
6.3.2. Ghi đè trang web
6.3.2.1. window.location.replace(urr)
6.3.2.1.1. replace() thì trình duyệt sẽ KHÔNG đưa vào lịch sử.
6.3.2.1.2. location.href thì trình duyệt sẽ CÓ đưa vào lịch sử
6.3.3. Load một trang mới
6.3.3.1. window.location.assign(url)
6.3.4. Các attribute của Location
6.3.4.1. hash: thiết lập hoặc lấy phần sau dấu # của URL
6.3.4.2. host: thiết lập hoặc lấy hostname và port number của URL
6.3.4.3. hostname: thiết lập hoặc lấy hostname
6.3.4.4. href: thiết lập hoặc lấy URL
6.3.4.5. origin: trả về protocal, hostname và port number của URL
6.3.4.6. pathname: thiết lập hoặc lấy path name của URL
6.3.4.7. port: thiết lập hoặc lấy port của URL
6.3.4.8. search: lấy phần query string của URL
6.4. History
6.4.1. Đếm tổng số trang đã lưu trong history là
6.4.1.1. var totalPage = window.history.length;
6.4.2. Đi tới một trang nào đó trong history
6.4.2.1. history.back() : trở lại trang trước
6.4.2.2. history.forward() : đi tới trang kế tiếp
6.4.2.3. history.go(number): đi tới một trang:
6.4.2.3.1. nếu number âm thì tính từ trang hiện tại trừ đi number
6.4.2.3.2. nếu number dương thì tính từ trang hiện tại cộng với number
6.5. Cookie
6.5.1. Định nghĩa
6.5.1.1. Là một đối tượng không thể thiếu trong các trình duyệt vì hầu hết các website đều có sử dụng cookie để lưu trữ dữ liệu.
6.5.2. Tạo cookie
6.5.2.1. name=value
6.5.2.1.1. document.cookie = 'website=freetuts.net';
6.5.2.1.2. document.cookie = 'email=thehalfheart@gmail.com';
6.5.3. Lấy giá trị của cookie
6.5.3.1. var giatri = document.cookie;
6.5.4. Đổi giá trị cho cookie
6.5.4.1. document.cookie = "domain=freetuts.net";
6.5.5. Xóa cookie
6.5.5.1. Không có hàm xóa mà phải sử dụng từ khóa expires để thiết lập thời gian sống cho cookie
6.6. Navigator
6.6.1. Định nghĩa
6.6.1.1. Dùng để kiểm tra các thông tin về người dùng như trình duyệt đang sử dụng, hệ điều hành đang sử dụng, có bật cookie hay không
6.6.2. navigator.cookieEnabled navigator.appName và navigator.appCodeName navigator.product navigator.appVersion và navigator.userAgent navigator.platform navigator.language
6.7. Screen
6.7.1. screen.width screen.height screen.availWidth screen.availHeight screen.colorDepth screen.pixelDepth
6.7.2. Định nghĩa
6.7.2.1. Là đối tượng chứa thông tin về màn hình của trình duyệt người dùng.
7. Datatype
7.1. String
7.1.1. .toString()
7.1.1.1. Xem độ dài chuỗi: string.length
7.1.2. Method
7.1.2.1. Tìm kiếm chuỗi con
7.1.2.1.1. Trả về kết quả là vị trí xuất hiện đầu tiên của chuối: indexOf()
7.1.2.1.2. Trả về kết quả vị trí xuất hiện cuối cùng của chuỗi: lastIndexOf()
7.1.2.1.3. search() tương tự như hàm indexOf()
7.1.2.2. Cắt chuỗi con
7.1.2.2.1. slice(start, end) cắt chuỗi
7.1.2.2.2. substring(start, end) tương tự slice nhưng không nhận index âm
7.1.2.2.3. substr(start, length): cắt từ vị trí start và lấy length ký tự
7.1.2.2.4. .charAt() lấy ra 1 kí tự từ 1 vị trí
7.1.2.3. Tìm kiếm và thay thế
7.1.2.3.1. replace(str_find, str_replace) tên cũ : /giá trị đầu/g
7.1.2.4. Chuyển thành chữ hoa và chữ thường
7.1.2.4.1. toUpperCase()
7.1.2.4.2. toLowerCase()
7.1.2.5. Nối thêm chuỗi
7.1.2.5.1. Sử dụng toán tử + hoặc `${ }`
7.1.2.6. Chuyển chuỗi thành mảng
7.1.2.6.1. Sử dụng split() dựa vào điểm chung để cắt
7.1.2.7. Xóa khoảng trắng 2 đầu
7.1.2.7.1. .trim()
7.2. Array
7.2.1. Khai báo mảng
7.2.1.1. var name_array = new Array();
7.2.1.2. var name_array = [];
7.2.2. Methods
7.2.2.1. array.join(', ') array.toString
7.2.2.1.1. Chuyển mảng thành chuỗi cách nhau dấu phẩy
7.2.2.2. array.push()
7.2.2.2.1. Thêm một phần tử vào cuối mảng.
7.2.2.3. array.pop()
7.2.2.3.1. Xóa đi phần tử cuối cùng trong mảng,trả về phần tử đã xóa
7.2.2.4. array.shift()
7.2.2.4.1. Xóa phần tử đầu tiên của mảng, trả về phần tử đã xóa
7.2.2.5. array.unshift()
7.2.2.5.1. Thêm một phần tử vào vị trí đầu tiên của mảng, đồng thời đẩy các phẩn từ phía sau lên một bậc.
7.2.2.6. SPLICING array.splice(position_add, num_element_remove, value1, value2, ...). Xóa và chèn 1 hay nhiều phần tử
7.2.2.6.1. position_add là vị trí sẽ xóa (vị trí đầu tiên là 0)
7.2.2.6.2. num_element_remove là số phần tử sẽ xóa (bắt đầu từ position_add)
7.2.2.6.3. value1, value2, .. là danh sách các phần tử sẽ được thêm vào sau vị trí position_add
7.2.2.7. SLICING array.slice(start, end)
7.2.2.7.1. Lấy một số phần tử con trong mảng
7.2.2.7.2. Phải cộng thêm 1 ở end thì mới lấy đúng phần tử mong muốn
7.2.2.8. array.sort()
7.2.2.8.1. Sắp xếp các phần tử trong mảng theo thứ tự chữ cái alpha
7.2.2.9. array.reverse()
7.2.2.9.1. Đảo ngược các phẩn tử lại.
7.2.2.10. array.concat()
7.2.2.10.1. Nối hai mảng với nhau và trả về một mảng gồm tổng số phần tử của hai mảng đó.
7.2.2.11. array.filter
7.2.2.11.1. lọc ra 1 mảng, thỏa mãn điều kiện nào đó không làm thay đổi mảng cũ
7.2.2.12. array.find
7.2.2.12.1. tìm trong mảng theo 1 tiêu chí (xuất ra 1 giá trị duy nhất)
7.2.2.13. array.map .join("")
7.2.2.13.1. render các phần tử của mảng chuyển sang chuỗi
7.2.2.14. .reduce
7.2.2.14.1. thực thi 1 hàm lên các phần tử của mảng vs 1 giá trị khởi tạo ban đầu
7.2.2.14.2. var newArray = array.reduce(myFunction, giá trị ban đầu khởi tạo) function myFunction(accumulator, currentValue, currentIndex, originArray), - accumulator: biến tích lũy / biến lưu trữ - currentValue: giá trị hiện tại trong mảng - currentIndex: chỉ mục - originArray : mảng ban đầu
7.3. Number
7.3.1. Chia thành dấu chấm động và không có dấu chấm động
7.3.2. Chuyển từ kiểu number sang kiểu string sử dụng number.toString(type)
7.3.3. Số Infinity
7.3.3.1. Là một kiểu dữ liệu Number và khi một biến có giá trị là Infinity
7.3.4. NaN
7.3.4.1. Nếu thực hiện một phép toán nhưng vi phạm quy tắc tính toán thì kết quả sẽ trả về giá trị gọi là NaN
7.3.4.1.1. Sử dụng isNaN() hoặc Number.isNaN() để kiểm tra NaN không NaN không bằng bất kì giá trị nào và cả chính nó
7.3.5. Method
7.3.5.1. Number()
7.3.5.1.1. Dùng để chuyển đổi một biến hoặc một giá trị nào đấy sang number
7.3.5.1.2. Nếu không thể chuyển sang thì sẽ trở thành NaN
7.3.5.1.3. Thao tác với Number.
7.3.5.2. parseInt()
7.3.5.2.1. Trả về 1 số nguyên. Nếu như chuỗi muốn chuyển sang có số ở đầu thì nó sẽ lấy phần số ở đầu.
7.3.5.3. parseFloat()
7.3.5.3.1. tương tự như parseInt() Trả về cả chữ số sau dấu phẩy
7.3.5.4. toString()
7.3.5.4.1. Chuyển kiểu Number sang kiểu String
7.3.5.5. toFixed(n)
7.3.5.5.1. Làm tròn sau dấu thập phân n chữ số
7.3.5.6. toPrecision(n)
7.3.5.6.1. Chuyển một số thành số có chiều dài là n,đếm bắt đầu từ 1
7.3.5.7. valueOf()
7.3.5.7.1. Lấy giá trị của một biến hoặc một giá trị khác
7.3.5.8. Math
7.3.5.8.1. Math.floor(): Làm tròn số dưới Math.ceil(): Làm tròn số trên
7.3.5.8.2. Math.abs() : giá trị tuyệt đối
7.3.5.8.3. Math.round(): Làm tròn số nguyên gần nhất
7.3.5.8.4. Math.min Math.max : trả về số nhỏ - lớn nhất
7.3.5.8.5. Math.trunc() : loại bỏ thập phân, trả về số nguyên
7.4. Date
7.4.1. Khởi tạo đối tượng date
7.4.1.1. var timeObj = new Date();
7.4.2. Format Date
7.4.2.1. ISO
7.4.2.1.1. Định dạng chuẩn của ISO 8601 là (YYYY-MM-DD) hoặc (YYYY-MM) hoặc (YYYY).
7.4.2.2. Long
7.4.2.2.1. var LONG_1 = new Date("Mar 25 2015");
7.4.2.3. Short
7.4.2.3.1. Định dạng Short được lưu trữ dưới dạng MM/DD/YYYY hoặc YYYY/MM/DD hoặc MM-DD-YYYY hoặc YYYY-MM-DD/
7.4.2.4. Đầy đủ
7.4.2.4.1. var d = new Date("Wed Mar 25 2015 09:56:24 GMT+0100 (W. Europe Standard Time)");
7.4.3. Method
7.4.3.1. getDate()
7.4.3.1.1. lấy ra ngày (1 - 31)
7.4.3.2. getFullYear()
7.4.3.2.1. lấy ranăm đầy đủ (YYYY)
7.4.3.3. getYear()
7.4.3.3.1. lấy ra 2 số cuối của năm (YY)
7.4.3.4. getHours()
7.4.3.4.1. lấy ra số giờ (0 - 23)
7.4.3.5. getMiliSeconds()
7.4.3.5.1. lấy ra số mili giây (0 - 999)
7.4.3.6. getMinutes()
7.4.3.6.1. lấy ra số phút (0 - 59)
7.4.3.7. getMonth()
7.4.3.7.1. lấy ra tháng (0 - 11)
7.4.3.8. getSeconds()
7.4.3.8.1. số giây (0 - 59)
7.4.3.9. getTime()
7.4.3.9.1. thời gian đã được convert sang dạng miliseconds.
7.4.3.10. Chuyển đổi giữa các định dạng ngày tháng
7.4.3.10.1. .toUTCString() V.D: Tue, 28 Sep 2021 10:17:42 GMT
7.4.3.10.2. .toISOString() V.D: 2021-09-28T10:20:18.227Z
7.4.3.10.3. .toDateString() V.D: Tue Sep 28 2021
7.5. Object
7.5.1. Định nghĩa:
7.5.1.1. Là một đối tượng tập hợp các thuộc tính Các thuộc tính bao gồm key và value
7.5.1.1.1. Thuộc tính (name,age,add... V.D: var person = { name: "Cuong", age: 18, address: "hai phong" }
7.5.2. Khai báo:
7.5.2.1. var obj = { }
7.5.2.2. var obj = new object()
7.5.2.3. Object.create()
7.5.3. Nối 2 Object
7.5.3.1. var mergedObj = {...obj1,...obj2}
7.5.3.2. var newObj = Object.assign(obj1,obj2);
7.5.3.3. Nếu trùng key, thì value sau sẽ thay thế cho value trước
7.5.4. chiều dài object
7.5.4.1. Object.keys(objName).length
7.5.5. this
7.5.5.1. Object: đề cập đến đối tượng chủ sở hữu (owner object)
7.5.5.2. đứng 1 mình: đề cập đến window ( global object)
7.5.5.3. trong 1 function: đề cập đến global object
7.5.5.4. trong use trict ( chế độ nghiêm ngặt) : undefined
7.5.5.5. trong 1 sự kiện: đề cập đến phần tử nhận sự kiện
7.5.6. Object Constructors
7.5.6.1. Ngoài việc tạo object riêng lẻ,chúng ta có thể tạo ra 1 "bản thiết kế" chung cho nhiều object
7.5.6.2. tên hàm luôn viết hoa chữ cái đầu để phân biệt
7.5.6.3. V.D: // Constructor function for Person objects function Person(first, last, age, eye) { this.firstName = first; this.lastName = last; this.age = age; this.eyeColor = eye; } // Create two Person objects const myFather = new Person("John", "Doe", 50, "blue"); const myMother = new Person("Sally", "Rally", 48, "green"); // Display age document.getElementById("demo").innerHTML = "My father is " + myFather.age + ". My mother is " + myMother.age + ".";
7.5.6.3.1. sinh ra prototype để add 1 thuộc tính (property), 1 phương thức (method/function) bên ngoài obj constructors
7.6. Typeof
7.6.1. Dùng để kiểm tra một biến nào đó (hoặc một giá trị nào đó) có kiểu dữ liệu là gì
7.6.1.1. console.log(typeof Number); // function console.log(typeof NaN); // number console.log(typeof null); // object console.log(typeof undefined); undefined console.log(typeof ""); // string console.log(typeof true) // Boolean console.log(typeof {}) // object
8. Library
8.1. JQUERY
8.1.1. Mục đích
8.1.1.1. Làm cho việc sử dụng JS trở nên dễ dàng hơn
8.1.1.2. Thực hiện được nhiều tác vụ trong 1 dòng mã
8.1.2. Bao gồm
8.1.2.1. Thao tác HTML / DOM
8.1.2.1.1. Get and Set
8.1.2.1.2. Add
8.1.2.1.3. Remove
8.1.2.1.4. Class
8.1.2.1.5. Dimensions
8.1.2.2. CSS
8.1.2.2.1. .css("propertyname","value");
8.1.2.2.2. .css({"propertyname":"value","propertyname":"value",...});
8.1.2.3. Events
8.1.2.3.1. click, dblclick
8.1.2.3.2. hover - mouseenter - mouseleave
8.1.2.3.3. mousedown - mouseup
8.1.2.3.4. focus - blur
8.1.2.3.5. on
8.1.2.4. Hiệu ứng và ảnh động
8.1.2.4.1. Ẩn hiện
8.1.2.4.2. Mờ
8.1.2.4.3. Trượt
8.1.2.4.4. animate
8.1.2.4.5. Có thể xâu chuỗi các hành động trên cùng 1 phần tử
8.1.2.5. AJAX
8.1.2.6. Traversing
8.1.2.6.1. Ancestors - Tổ tiên
8.1.2.6.2. Descendants - Hậu duệ
8.1.2.6.3. Siblings - Anh chị em
8.1.2.6.4. Filtering - Bộ lọc
8.1.3. Cú pháp
8.1.3.1. Ngăn mã chạy trước khi tải xong tài liệu
8.1.3.1.1. $(document).ready(funtion() { }
8.1.3.1.2. $(funtion() { }
8.1.3.2. $(selector).action()
9. Đồng bộ và Bất đồng bộ
9.1. Đồng bộ
9.1.1. Code chạy theo thứ tự, in ra theo thứ tự,dễ kiểm soát những tốn nhiều thời gian hơn
9.2. Bất đồng bộ
9.2.1. lệnh chạy cùng 1 lúc,ít thời gian hơn nhưng giá trị gửi về k theo thứ tự, khó kiểm soát
9.2.1.1. Xử lý Câu chuyện xử lý bất đồng bộ trong Javascript (phần 2)
9.2.1.1.1. Callback
9.2.1.1.2. Promise
9.2.1.1.3. Async / Await
10. JSON
10.1. Định nghĩa
10.1.1. Javascript Object Notation Là một định dạng văn bản để lưu trữ và vẫn chuyển dữ liệu
10.1.2. chỉ chứa các thuộc tính, không chứa phương thức
10.1.3. luôn sử dụng nháy kép
10.2. JSON luôn là 1 chuỗi
10.2.1. ' "key": "value" '
10.2.1.1. Datatype
10.2.1.1.1. string
10.2.1.1.2. boolean
10.2.1.1.3. array
10.2.1.1.4. JS Object
10.2.1.1.5. number
10.2.1.1.6. null
10.2.1.2. key không nhận
10.2.1.2.1. date
10.2.1.2.2. function
10.2.1.2.3. undefined
10.3. So sánh XML
10.3.1. Giống
10.3.1.1. -Tự mô tả ( con người có thể đọc được) - Phân cấp (giá trị trong giá trị) - Được sử dụng trong nhiều ngôn ngữ lập trình - Có thể được tìm nạp bằng XMLHttpRequest
10.3.2. Khác
10.3.2.1. JSON không sử dụng end tag
10.3.2.2. JSON ngắn hơn,dễ hiểu hơn,đọc nhanh hơn
10.3.2.3. JSON sử dụng mảng
10.3.2.4. XML phải phân tích bằng trình phân tích của XML JSON thì dùng JS
10.4. Hoạt động
10.4.1. Trao đổi dữ liệu đến và đi từ máy chủ
10.4.1.1. JSON.parse(): chuyển chuỗi JSON -> JS Object
10.4.1.2. JSON.stringify() : chuuyển JS Object -> chuỗi JSON
10.4.1.3. PHP
10.4.1.3.1. JSON.decode : chuyển chuỗi JSON -> JS Object
10.4.1.3.2. JSON.encode : chuuyển JS Object -> chuỗi JSON
11. Cú pháp: elementObject.addEventListener('eventName', function(e){ // do something });
11.1. eventName là tên của sự kiện bỏ chữ on, ví dục "click", "change",
12. Events
12.1. Định nghĩa: là những hành động tác động lên đối tượng HTML
12.2. Các sự kiện xảy ra
12.2.1. Khi 1 trang web đã tải xong
12.2.1.1. window.onload
12.2.2. Khi trường nhập đã thay đổi
12.2.2.1. onchange : thay đổi gì đó onblur : chuột rời input
12.2.2.2. onkeypress: gõ 1 phím vào input onkeyup: nhả phím
12.2.3. Khi một nút được click
12.2.3.1. The MouseEvent
12.2.3.1.1. onclick ondbclick
12.2.3.1.2. onmouseover onmouseout
12.2.3.1.3. onmouseup onmousedown
12.2.3.1.4. onmouseenter onmouseleave
12.3. Return True/ False
12.3.1. Ví dụ như để validate input
12.3.1.1. Hiểu rõ Return TRUE/FALSE trong Javascript - Freetuts
12.3.2. true: cho phép xảy ra false: không xảy ra
12.4. Event Onload
12.4.1. Những event nằm trong onload sẽ chạy sau cùng khi mà js đã biên dịch một lần
12.4.1.1. window.onload = function() { // code } xảy ra sau khi trang tải xong
12.5. addEventListener()
12.5.1. removeEventListener()
12.5.1.1. sử dụng để xóa event
13. Conditions
13.1. Câu lệnh điều kiện
13.1.1. if else
13.1.1.1. toán tử 3 ngôi: variable = (condition) ? value-true : value-false
13.1.2. else if
13.1.2.1. sử dụng khi đk trong if sai
13.1.3. switch
13.1.3.1. sử dụng khi có nhiều case để chọn
13.1.3.1.1. đánh giá biểu thức chuyển đổi 1 lần
13.1.3.1.2. so sánh với giá trị case,nếu trùng thực thi khối mã trong case
13.1.3.1.3. nếu không khớp case nào, giá trị default sẽ được khớp
13.1.3.1.4. nếu nhiều case khớp sẽ chọn case đầu tiên
13.2. Vòng lặp
13.2.1. while
13.2.1.1. sử dụng khi không biết chính xác điều kiện để dừng hoặc điều kiện phức tạp
13.2.2. do - while
13.2.2.1. sử dụng khi không biết chính xác điều kiện để dừng hoặc điều kiện phức tạp chạy trong do, xét điều kiện while, false thì dừng vòng lặp
13.2.3. for
13.2.3.1. for ( khởi tạo biến;điều kiện; bước nhảy)
13.2.3.1.1. for in for ( var key in name) { }
13.2.3.1.2. for of for ( var value of name)
13.2.3.2. for : biết số lần lăpj, tức là số lần lặp có giới hạn while: không biết chính xác số lần lặp
13.2.4. forEach
13.2.4.1. Lặp qua từng phần tử của mảng
14. DOM
14.1. Định nghĩa
14.1.1. Document Object Model - Mô hình các đối tượng trong tài liệu HTML.
14.1.2. Để thấy rõ hơn
14.1.2.1. Nhiệm vụ DOM JAVASCRIPT
14.1.2.1.1. Cho phép truy xuất vào các element
14.1.2.1.2. Thay đổi thuộc tính của thẻ html
14.1.2.1.3. Thay đổi CSS, thêm, xóa các thẻ trong html
14.2. DOM Element
14.2.1. ID
14.2.1.1. var element = document.getElementById('IDname');
14.2.2. Tag Name
14.2.2.1. var element = document.getElementsByTagName('tagname');
14.2.3. Class
14.2.3.1. var element = document.getElementsByClassName('ClassName');
14.2.4. Cú pháp selector CSS
14.2.4.1. var element = document.querySelectorAll("div input.website");
14.3. DOM HTML
14.3.1. Nội dung bên trong thẻ HTML
14.3.1.1. document.getElementById("content").innerHTML
14.3.2. Thuộc tính thẻ HTML
14.3.2.1. document.getElementById("element").attributeName
14.4. DOM CSS
14.4.1. Thay đổi CSS bằng JS
14.4.1.1. document.getElementById("object").style.cssName
14.5. DOM Nodes
14.5.1. Khi truy vấn tới một đối tượng HTML thì kết quả trả về sẽ là một object,, và object đó là DOM Nodes
14.5.2. Tạo node không liên quan đến HTML
14.5.2.1. var p = document.createElement("p");
14.5.2.2. p.innerHTML = "Nội dung gì đó"
14.5.2.3. document.getElementsByTagName('body')[0].appendChild(p);
14.5.3. document.createTextNode()
14.5.3.1. Là một node đặc biệt, không phải thẻ HTML thông thường mà là một chuỗi String, thường dùng để thay thế gán
14.5.3.2. node.innerHTML
14.5.4. Các method
14.5.4.1. Dùng để bổ sung vào cuối cùng của đối tượng một thẻ HTML nào đó
14.5.4.1.1. appendChild()
14.5.4.2. Dùng để thêm một node vào đằng trước một node con nào đó.
14.5.4.2.1. insertBefore(node_insert, node_child)
14.5.4.3. Dùng để xóa một node con ra khỏi node hiện tại
14.5.4.3.1. removeChild()
14.5.4.4. Dùng để thay thế một node con nào đó bằng một node khác mới hoàn toàn
14.5.4.4.1. replaceChild()
15. Bổ sung
15.1. Hoisting
15.1.1. Liên quan đến việc trong Javascript bạn có thể sử dụng một biến mà không cần phải định nghĩa trước.
15.1.2. Chỉ tồn tại khi bạn khai báo biến chứ không tồn tại khi gán giá trị ban đầu cho biến
15.2. Use Strict
15.2.1. Là chế độ nghiêm ngặt trong JS
15.2.1.1. Phải khai báo trước khi sử dụng
15.2.1.2. Không chấp nhận delete biến
15.2.1.3. Không được định nghĩa thuộc tính 2 lần
15.2.1.4. Không được khai báo tham số trùng
15.2.1.5. Không được sử dụng literals và escape với kiểu number.
15.2.1.6. Không thể khai báo tên của biến trùng với key
15.2.1.7. this không còn là đối tượng window
15.3. HTML5 Local Storage
15.3.1. Có công dụng tương tự như cookie, có nghĩa là nó sẽ lưu trữ thông tin tạm thời trên browser
15.3.2. window.localStorage: Lưu trữ dữ liệu vô thời hạn, dữ liệu sẽ được lưu trữ cho tới khi người dùng clear history.
15.3.3. window.sessionStorage: Lưu trữ dữ liệu cho một phiên làm việc, có nghĩa dữ liệu sẽ bị mất khi bạn tắt browser.
16. JS AJAX
16.1. Định nghĩa
16.1.1. AJAX = Asynchronous JavaScript And XML - Bất đồng bộ JS vs XML
16.1.2. AJAX không phải là ngôn ngữ lập trình
16.2. Mục đích
16.2.1. Đọc dữ liệu từ máy chủ, sau khi trang tải xong
16.2.2. Cập nhật dữ liệu mà không cần tải lại trang
16.2.3. Gửi dữ liệu đến máy chủ ngay trong nền website
16.3. Cách hoạt động
16.3.1. Một sự kiện xảy ra trong trang ( click nút, tải trang)
16.3.2. Gọi ra đối tượng XMLHttpRequest được tích hợp sẵn bằng JS
16.3.2.1. var xhttp = new XMLHttpRequest();
16.3.3. Đối tượng XMLHttpRequest gửi yêu cầu đến máy chủ
16.3.3.1. https://www.w3schools.com/js/pic_ajax.gif
16.3.3.2. Xác định chức năng gọi lại xhttp.onload = function() { // What do do when the response is ready }
16.3.3.3. Gửi yêu cầu: xhttp.open(method, URL, async); xhttp.send();
16.3.3.3.1. method: POST || GET
16.3.3.3.2. async: true || false mặc định : true Không đồng hộ,đúng hay sai
16.3.4. Máy chủ xử lí yêu cầu và phản hồi trở lại trang web
16.3.4.1. responseText trả về 1 chuỗi
16.3.4.2. responseXML: trả về 1 Object XML
16.3.5. JS đọc phản hồi và hành động