Menu
×

Được chứng nhận

Ghi lại kiến ​​thức của bạn

Đăng nhập Đăng ký

Tạo Tài khoản Example.com.vn miễn phí để cải thiện trải nghiệm học tập của bạn

Người tìm đường và việc học của tôi

Theo dõi tiến độ học tập của bạn tại Example.com.vn và thu thập phần thưởng

Nâng cấp

Trở thành người dùng PLUS và mở khóa các tính năng mạnh mẽ (không có quảng cáo, lưu trữ, hỗ trợ, ..)

Bắt đầu từ đâu

Bạn không chắc chắn muốn bắt đầu từ đâu? Đi theo con đường được hướng dẫn của chúng tôi

Trình chỉnh sửa mã (Dùng thử)

Với trình chỉnh sửa mã trực tuyến của chúng tôi, bạn có thể chỉnh sửa mã và xem kết quả trong trình duyệt của mình

Video

Tìm hiểu những điều cơ bản về HTML qua video hướng dẫn thú vị và hấp dẫn

Mẫu

Chúng tôi đã tạo một loạt mẫu trang web đáp ứng mà bạn có thể sử dụng - miễn phí!

Web hosting

Lưu trữ trang web của riêng bạn và chia sẻ nó với mọi người với Example.com.vn Spaces

Tạo một máy chủ

Tạo máy chủ của riêng bạn bằng Python, PHP, React.js, Node.js, Java, C#, v.v.

Làm thế nào để

Bộ sưu tập lớn các đoạn mã cho HTML, CSS và JavaScript

Khung CSS

Xây dựng các trang web nhanh và phản hồi bằng cách sử dụng khung W3.CSS miễn phí của chúng tôi

Thống kê trình duyệt

Đọc xu hướng dài hạn của việc sử dụng trình duyệt

Tốc độ gõ

Kiểm tra tốc độ đánh máy của bạn

Đào tạo AWS

Tìm hiểu dịch vụ web của Amazon

Bộ chọn màu

Sử dụng công cụ chọn màu của chúng tôi để tìm các màu RGB, HEX và HSL khác nhau. Bánh xe màu hình tròn thể hiện sự chuyển màu trong quang phổ

Trò chơi mã

Trò chơi mã hóa W3Schools! Giúp linh miêu thu thập nón thông Logo Lynx

Đặt mục tiêu

Nhận hành trình học tập được cá nhân hóa dựa trên các kỹ năng và mục tiêu hiện tại của bạn

Bản tin

Tham gia bản tin của chúng tôi và có quyền truy cập vào nội dung độc quyền mỗi tháng

Việc làm

Thuê những tài năng công nghệ hàng đầu. Hợp lý hóa quy trình tuyển dụng của bạn để có đội ngũ phù hợp hoàn hảo

Lớp học

Hãy liên hệ để sử dụng Example.com.vn Plus và các chứng chỉ với tư cách là một tổ chức giáo dục

×
HTML CSS JAVASCRIPT SQL PYTHON JAVA PHP CÁCH W3.CSS C C++ C# BOOTSTRAP REACT MYSQL JQUERY EXCEL XML DJANGO NUMPY PANDAS NODEJS R TYPESCRIPT ANGULAR GIT POSTGRESQL MONGODB ASP AI GO KOTLIN SASS VUE DSA GEN AI SCIPY AWS AN NINH MẠNG DỮ LIỆU KHOA HỌC

Hướng dẫn về JS

JS HOME Giới thiệu JS JS Nơi xuất ra JS Câu lệnh JS JS Cú pháp JS Nhận xét JS Biến JS Let JS Const Toán tử JS JS Số học Phép gán JS Kiểu dữ liệu JS 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 Số JS BigInt JS Phương thức số Thuộc tính số JS Mảng JS Phương thức mảng JS Tìm kiếm mảng JS Sắp xếp mảng JS Lặp lại JS Mảng Const JS Ngày tháng JS Định dạng ngày JS Ngày Nhận phương thức JS Phương thức đặt ngày JS Toán học JS ngẫu nhiên JS Booleans JS So sánh JS Nếu khác JS Switch Vòng lặp JS cho JS Vòng lặp cho trong JS Vòng lặp cho vòng lặp JS Trong khi JS Break JS Iterables JS Bộ JS Set Methods JS Maps JS Map Methods JS Typeof JS Type Chuyển đổi JS Bitwise JS RegExp JS Ưu tiên JS Lỗi JS Phạm vi JS Hoisting JS Chế độ nghiêm ngặt JS cái này Từ khóa JS Mũi tên Chức năng Các lớp JS Mô-đun JS JS JSON JS Gỡ lỗi Hướng dẫn về phong cách JS Các phương pháp hay nhất về JS Các sai lầm về JS Hiệu suất JS Các từ dành riêng cho JS

Phiên bản JS

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

Đố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 Trình truy cập đối tượng Trình tạo đối tượng Nguyên mẫu đối tượng Quản lý đối tượng Bảo vệ đối tượng

Hàm JS

Định nghĩa hàm Tham số hàm Chức năng Gọi hàm Gọi hàm Áp dụng hàm Liên kết hàm Đóng

Các lớp JS

Lớp Giới thiệu Lớp Kế thừa Lớp Tĩnh

JS không đồng bộ

Lệnh gọi lại JS JS không đồng bộ JS hứa hẹn JS Async/Await

DOM HTML

Giới thiệu DOM Các phương thức DOM Tài liệu DOM Phần tử DOM DOM HTML Biểu mẫu DOM DOM CSS DOM Ảnh động DOM Sự kiện DOM Trình nghe sự kiện Đ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 Điều hướng JS Cảnh báo bật lên JS Thời gian JS Cookies JS

API Web JS

API Web Giới thiệu 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 định vị địa lý web

JS AJAX

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

JSON JSON

Giới thiệu JSON Cú pháp JSON JSON và XML Các kiểu dữ liệu JSON Phân tích cú pháp JSON JSON xâu chuỗi các đối tượng JSON Mảng JSON Máy chủ JSON JSON PHP JSON HTML JSON JSONP

JS và jQuery

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

Đồ họa JS

JS Graphics JS Canvas JS Plotly JS Chart.js JS Google Chart JS D3.js

Ví dụ về JS

Ví dụ về JS JS HTML DOM JS Đầu vào HTML JS Đối tượng HTML JS Sự kiện HTML Trình duyệt JS Trình soạn thảo JS Bài tập JS Câu đố JS Trang web JS Chuẩn bị phỏng vấn JS Bootcamp Chứng chỉ JS

Tài liệu tham khảo JS

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


Đối tượng JavaScript


Đối tượng, thuộc tính và phương thức trong đời thực

Trong cuộc sống thực, một chiếc ô tô là một vật thể .

Một chiếc ô tô có các đặc tính như trọng lượng và màu sắc cũng như các phương thức như khởi động và dừng:

Sự vật Của cải phương pháp

xe.name = Fiat

xe.model = 500

xe.trọng lượng = 850kg

xe.màu = trắng

xe.start()

xe.drive()

xe.brake()

xe.stop()

Tất cả các ô tô đều có cùng thuộc tính , nhưng giá trị thuộc tính khác nhau giữa các ô tô.

Tất cả các ô tô đều có những phương pháp giống nhau, nhưng các phương pháp này được thực hiện vào những thời điểm khác nhau .


Đối tượng JavaScript

Bạn đã biết rằng các biến JavaScript là nơi chứa các giá trị dữ liệu.

Mã này gán một giá trị đơn giản (Fiat) cho một biến có tên car:

let car = "Fiat";
Hãy tự mình thử »

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

Mã này gán nhiều giá trị (Fiat, 500, màu trắng) cho một biến có tên car:

const car = {type:"Fiat", model:"500", color:"white"};
Hãy tự mình thử »

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

Thực tế phổ biến là khai báo các đối tượng bằng từ khóa const .

Tìm hiểu thêm về cách sử dụng const với các đối tượng trong chương: JS Const .



Định nghĩa đối tượng

Bạn xác định (và tạo) một đối tượng JavaScript bằng một đối tượng bằng chữ:

Ví dụ

const person = {firstName:"John", lastName:"Doe", age:50, eyeColor:"blue"};
Hãy tự mình thử »

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

Ví dụ

const person = {
  firstName: "John",
  lastName: "Doe",
  age: 50,
  eyeColor: "blue"
};
Hãy tự mình thử »

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

Các cặp name:values ​​trong đối tượng JavaScript được gọi là thuộc tính :

Tài sản Giá trị tài sản
tên đầu tiên John
họ Nai
tuổi 50
màu mắt màu xanh da trời

Truy cập thuộc tính đối tượng

Bạn có thể truy cập các thuộc tính đối tượng theo hai cách:

objectName.propertyName

hoặc

objectName["propertyName"]

Ví dụ 1

person.lastName;
Hãy tự mình thử »

Ví dụ2

person["lastName"];
Hãy tự mình thử »

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


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

Các đối tượng cũng có thể có các phương thức .

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

Các phương thức được lưu trữ trong các thuộc tính dưới dạng định nghĩa hàm .

Tài sản Giá trị tài sản
tên đầu tiên John
họ Nai
tuổi 50
màu mắt màu xanh da trời
Họ và tên function() {return this.firstName + " " + this.lastName;}

Phương thức là một hàm được lưu trữ dưới dạng một thuộc tính.


Ví dụ

const person = {
  firstName: "John",
  lastName : "Doe",
  id       : 5566,
  fullName : function() {
    return this.firstName + " " + this.lastName;
  }
};

Trong ví dụ trên, this đề cập đến đối tượng người :

this.firstName có nghĩa là thuộc tính firstName của người .

this.lastName có nghĩa là thuộc tính LastName của người .


Cái này là cái gì ?

Trong JavaScript, từ khóa this đề cập đến một đối tượng .

Đối tượng nào phụ thuộc vào cách this được gọi (được sử dụng hoặc được gọi).

Từ khóa this đề cập đến các đối tượng khác nhau tùy thuộc vào cách nó được sử dụng:

Trong một phương thức đối tượng, this đề cập đến đối tượng .
Một mình, this đề cập đến đối tượng toàn cầu .
Trong một hàm, this đề cập đến đối tượng toàn cục .
Trong một hàm, ở chế độ nghiêm ngặt, thisundefined .
Trong một sự kiện, this đề cập đến phần tử đã nhận được sự kiện.
Các phương thức như call() , apply()bind() có thể tham chiếu this tới bất kỳ đối tượng nào .

Ghi chú

this không phải là một biến. Đó là một từ khóa. Bạn không thể thay đổi giá trị của this .

Xem thêm:

Hướng dẫn về JavaScript này


Từ khóa này

Trong định nghĩa hàm, this đề cập đến "chủ sở hữu" của hàm.

Trong ví dụ trên, thisđối tượng người "sở hữu" hàm fullName .

Nói cách khác, this.firstName có nghĩa là thuộc tính firstName của đối tượng này .

Tìm hiểu thêm về this trong Hướng dẫn về JavaScript này .


Truy cập các phương thức đối tượng

Bạn truy cập một phương thức đối tượng với cú pháp sau:

objectName.methodName()

Ví dụ

name = person.fullName();
Hãy tự mình thử »

Nếu bạn truy cập một phương thức không có dấu ngoặc đơn (), nó sẽ trả về định nghĩa hàm :

Ví dụ

name = person.fullName;
Hãy tự mình thử »

Không khai báo chuỗi, số và Boolean làm đối tượng!

Khi một biến JavaScript được khai báo bằng từ khóa " new ", biến đó được tạo dưới dạng một đối tượng:

x = new String();        // Declares x as a String object
y = new Number();        // Declares y as a Number object
z = new Boolean();       // Declares z as a Boolean object

Tránh các đối tượng String , NumberBoolean . Chúng làm phức tạp mã của bạn và làm chậm tốc độ thực thi.

Bạn sẽ tìm hiểu thêm về các đối tượng sau trong hướng dẫn này.


Kiểm tra bản thân bằng các bài tập

Bài tập:

Cảnh báo "John" bằng cách trích xuất thông tin từ đối tượng person .

const người = {
  Tên đầu tiên: "John",
  Họ: "Doe"
};

báo động( );

Bắt đầu bài tập


×

Liên hệ bán hàng

Nếu bạn muốn sử dụng dịch vụ của Example.com.vn với tư cách là một tổ chức giáo dục, nhóm hoặc doanh nghiệp, hãy gửi email cho chúng tôi:
[email được bảo vệ]

Báo cáo lỗi

Nếu bạn muốn báo cáo lỗi hoặc nếu bạn muốn đưa ra đề xuất, hãy gửi email cho chúng tôi:
[email được bảo vệ]

Example.com.vn được tối ưu hóa cho việc học tập và đào tạo. Các ví dụ có thể được đơn giản hóa để cải thiện khả năng đọc và học. Các hướng dẫn, tài liệu tham khảo và ví dụ liên tục được xem xét để tránh sai sót, nhưng chúng tôi không thể đảm bảo tính chính xác hoàn toàn của mọi nội dung. Khi sử dụng W3Schools, bạn đồng ý đã đọc và chấp nhận các điều khoản sử dụng , chính sách cookie và quyền riêng tư của chúng tôi.

Bản quyền 1999-2024 của Refsnes Data. Đã đăng ký Bản quyền. Example.com.vn được cung cấp bởi W3.CSS .