Hướng dẫn JS

JS TRANG CHỦ Giới thiệu JS JS Đến đâu Đầu ra JS Tuyên bố JS Cú pháp JS Bình luận JS Biến JS JS Hãy JS Const Toán tử JS Số học JS Chuyển nhượng JS Các loại dữ liệu JS Các hàm JS Đối tượng JS Sự kiện JS Chuỗi JS Phương thức chuỗi JS Tìm kiếm chuỗi JS Mẫu chuỗi JS Số JS Phương thức số JS Mảng JS Phương thức mảng JS Sắp xếp mảng JS Lặp lại mảng JS JS Array Const JS ngày Định dạng ngày JS Ngày lấy phương thức JS Phương pháp đặt ngày JS Toán JS JS ngẫu nhiên JS Booleans So sánh JS Điều kiện JS Chuyển đổi JS JS Loop cho JS Loop For In JS Loop For Of JS lặp trong khi JS Break JS lặp lại Bộ JS Bản đồ JS JS Typeof Chuyển đổi loại JS JS Bitwise JS RegExp Lỗi JS Phạm vi JS JS Hoists Chế độ nghiêm ngặt JS JS từ khóa này Hàm mũi tên JS Lớp JS JS JSON Gỡ lỗi JS Hướng dẫn kiểu JS Các phương pháp hay nhất về JS JS sai lầm Hiệu suất JS JS dành riêng từ

Phiên bản JS

Phiên bản JS JS 2009 (ES5) JS 2015 (ES6) JS 2016 JS 2017 JS 2018 JS IE / Edge Lịch sử JS

Đối tượng JS

Định nghĩa đối tượng Thuộc tính đối tượng Phương thức đối tượng Hiển thị đối tượng Người truy cập đối tượng Trình tạo đối tượng Nguyên mẫu đối tượng Đối tượng lặp lại Bộ đối tượng Bản đồ đối tượng Tham chiếu đối tượng

Các hàm JS

Định nghĩa hàm Tham số chức năng Lời mời hàm Gọi hàm Áp dụng chức năng Chức năng đóng cửa

Lớp JS

Giới thiệu Lớp học Kế thừa giai cấp Lớp tĩnh

JS Async

Gọi lại JS JS không đồng bộ JS hứa JS Async / Await

JS HTML DOM

Giới thiệu DOM Phương thức DOM Tài liệu DOM Phần tử DOM DOM HTML Các biểu mẫu DOM DOM CSS Hoạt ảnh DOM Sự kiện DOM Trình xử lý sự kiện DOM Điều hướng DOM Nút DOM Bộ sưu tập DOM Danh sách nút DOM

BOM trình duyệt JS

Cửa sổ JS Màn hình JS Vị trí JS Lịch sử JS JS Navigator JS Popup Alert Thời gian JS JS Cookies

API web JS

Giới thiệu API Web API biểu mẫu web API lịch sử web API lưu trữ web API công nhân web API tìm nạp web API vị trí địa lý web

JS AJAX

Giới thiệu về AJAX AJAX XMLHttp Yêu cầu AJAX Phản hồi AJAX Tệp XML AJAX AJAX PHP AJAX ASP Cơ sở dữ liệu AJAX Ứng dụng AJAX Ví dụ về AJAX

JS JSON

Giới thiệu JSON Cú pháp JSON JSON so với XML Các loại dữ liệu JSON Phân tích cú pháp JSON JSON Stringify Đối tượng JSON Mảng JSON Máy chủ JSON JSON PHP HTML JSON JSON JSONP

JS so với jQuery

Bộ chọn jQuery jQuery HTML jQuery CSS jQuery DOM

Đồ họa JS

Đồ họa JS JS Canvas JS Plotly JS Chart.js JS Google Chart JS D3.js

Ví dụ về JS

Ví dụ về JS JS HTML DOM Đầu vào HTML JS Đối tượng HTML JS Sự kiện HTML JS Trình duyệt JS Trình chỉnh sửa JS Bài tập JS JS Quiz Chứng chỉ JS

Tham khảo JS

Đối tượng JavaScript Đối tượng DOM HTML


Đối tượng JavaScript


Trong JavaScript, các đối tượng là vua. Nếu bạn hiểu các đối tượng, bạn hiểu JavaScript.


Trong JavaScript, gần như "mọi thứ" là một đối tượng.

  • Boolean có thể là các đối tượng (nếu được định nghĩa bằng newtừ khóa)
  • Các số có thể là các đối tượng (nếu được định nghĩa bằng newtừ khóa)
  • Các chuỗi có thể là các đối tượng (nếu được định nghĩa bằng newtừ khóa)
  • Ngày luôn luôn là đối tượng
  • Toán học luôn luôn là đối tượng
  • Biểu thức chính quy luôn là đối tượng
  • Mảng luôn là đối tượng
  • Các hàm luôn là đối tượng
  • Đối tượng luôn là đối tượng

Tất cả các giá trị JavaScript, ngoại trừ các giá trị nguyên thủy, đều là các đối tượng.


Nguyên thủy JavaScript

Giá trị nguyên thủy là giá trị không có thuộc tính hoặc phương thức.

Kiểu dữ liệu nguyên thủydữ liệu có giá trị nguyên thủy.

JavaScript định nghĩa 5 kiểu kiểu dữ liệu nguyên thủy:

  • string
  • number
  • boolean
  • null
  • undefined

Các giá trị nguyên thủy là bất biến (chúng được mã hóa cứng và do đó không thể thay đổi).

nếu x = 3,14, bạn có thể thay đổi giá trị của x. Nhưng bạn không thể thay đổi giá trị của 3,14.

Giá trịLoạiNhận xét
"Xin chào"chuỗi"Xin chào" luôn luôn là "Xin chào"
3,14số3,14 luôn là 3,14
đúng vậybooleansự thật luôn luôn đúng
saibooleansai luôn luôn sai
vô giá trịnull (đối tượng)null luôn là null
chưa xác địnhchưa xác địnhkhông xác định luôn luôn không xác định

Đối tượng là các biến

Các biến JavaScript có thể chứa các giá trị đơn:

Thí dụ

let person = "John Doe";

Các biến JavaScript cũng có thể chứa nhiều giá trị.

Đối tượng cũng là biến. Nhưng các đối tượng có thể chứa nhiều giá trị.

Các giá trị đối tượng được viết dưới dạng cặp tên: giá trị (tên và giá trị cách nhau bằng dấu hai chấm).

Thí dụ

let person = {firstName:"John", lastName:"Doe", age:50, eyeColor:"blue"};

Một đối tượng JavaScript là một tập hợp các giá trị được đặt tên

Một thực tế phổ biến là khai báo các đối tượng với consttừ khóa.

Thí dụ

const person = {firstName:"John", lastName:"Doe", age:50, eyeColor:"blue"};


Thuộc tính đối tượng

Các giá trị được đặt tên, trong các đối tượng JavaScript, được gọi là thuộc tính .

Bất động sản Giá trị
họ John
họ Doe
già đi 50
màu mắt màu xanh lam

Các đối tượng được viết dưới dạng cặp giá trị tên tương tự như:

  • Mảng liên kết trong PHP
  • Từ điển bằng Python
  • Bảng băm trong C
  • Bản đồ băm trong Java
  • Hàm băm trong Ruby và Perl

Phương thức đối tượng

Phương thức là các hành động có thể được thực hiện trên các đối tượng.

Thuộc tính đối tượng có thể là cả giá trị nguyên thủy, các đối tượng khác và các hàm.

Một phương thức đối tượng là một thuộc tính đối tượng chứa một định nghĩa hàm .

Bất động sản Giá trị
họ John
họ Doe
già đi 50
màu mắt màu xanh lam
Họ và tên function () {return this.firstName + "" + this.lastName;}

Các đối tượng JavaScript là vùng chứa các giá trị được đặt tên, được gọi là thuộc tính và phương thức.

Bạn sẽ tìm hiểu thêm về các phương pháp trong các chương tiếp theo.


Tạo một đối tượng JavaScript

Với JavaScript, bạn có thể xác định và tạo các đối tượng của riêng mình.

Có nhiều cách khác nhau để tạo các đối tượng mới:

  • Tạo một đối tượng duy nhất, sử dụng một đối tượng theo nghĩa đen.
  • Tạo một đối tượng duy nhất, với từ khóa new.
  • Xác định một phương thức khởi tạo đối tượng, sau đó tạo các đối tượng của kiểu được xây dựng.
  • Tạo một đối tượng bằng cách sử dụng Object.create().

Sử dụng một Object Literal

Đây là cách dễ nhất để tạo một Đối tượng JavaScript.

Sử dụng một đối tượng theo nghĩa đen, bạn vừa định nghĩa và tạo một đối tượng trong một câu lệnh.

Một đối tượng là một danh sách các cặp name: value (như age: 50) bên trong dấu ngoặc nhọn {}.

Ví dụ sau tạo một đối tượng JavaScript mới với bốn thuộc tính:

Thí dụ

const person = {firstName:"John", lastName:"Doe", age:50, eyeColor:"blue"};

Dấu cách và ngắt dòng không quan trọng. Một định nghĩa đối tượng có thể kéo dài nhiều dòng:

Thí dụ

const person = {
  firstName: "John",
  lastName: "Doe",
  age: 50,
  eyeColor: "blue"
};

Ví dụ này tạo một đối tượng JavaScript trống, sau đó thêm 4 thuộc tính:

Thí dụ

const person = {};
person.firstName = "John";
person.lastName = "Doe";
person.age = 50;
person.eyeColor = "blue";

Sử dụng từ khóa JavaScript mới

Ví dụ sau tạo một đối tượng JavaScript mới bằng cách sử dụng new Object(), sau đó thêm 4 thuộc tính:

Thí dụ

const person = new Object();
person.firstName = "John";
person.lastName = "Doe";
person.age = 50;
person.eyeColor = "blue";

Các ví dụ trên làm hoàn toàn tương tự.

Nhưng không có nhu cầu sử dụng new Object().

Để có thể đọc được, tính đơn giản và tốc độ thực thi, hãy sử dụng phương thức đối tượng theo nghĩa đen.


Các đối tượng JavaScript có thể thay đổi

Các đối tượng có thể thay đổi: Chúng được giải quyết bằng tham chiếu, không phải theo giá trị.

Nếu người là một đối tượng, câu lệnh sau sẽ không tạo bản sao của người:

const x = person;  // Will not create a copy of person.

Đối tượng x không phải là bản sao của người. người. Cả x và người đều là cùng một đối tượng.

Bất kỳ thay đổi nào đối với x cũng sẽ thay đổi người, bởi vì x và người là cùng một đối tượng.

Thí dụ

const person = {
  firstName:"John",
  lastName:"Doe",
  age:50, eyeColor:"blue"
}

const x = person;
x.age = 10;      // Will change both x.age and person.age