Đối tượng JavaScript – js thêm dữ liệu vào đối tượng

Bạn đang xem : js thêm dữ liệu vào đối tượng

JavaScript

Đối tượng

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

Trong đời thự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ư phương pháp như bắt đầu và dừng:

Sự vật

Đặc tính

Phương pháp

car.name = Fiat

car.model = 500

car.weight = 850kg

car.color = trắng

car.start ()

car.drive ()

car.brake ()

car.stop ()

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

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

Đối tượng JavaScript

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

Mã này chỉ định một giá trị đơn giản (Fiat) cho
một biến ô tô được đặt tên:

let car = “Fiat”;

Hãy tự mình thử »

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

Mã này chỉ định nhiều giá trị (Fiat, 500, màu trắng) cho một
biến
xe được đặt tên:

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 name: value (tên và giá trị được phân tách bằng dấu
dấu hai chấm).

Một thông lệ 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 với một đối tượng là chữ:

Ví dụ

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

Hãy tự mình thử »

Dấu cách và dấu 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:

Ví dụ

const người = {
firstName: “John”,
lastName: “Doe”,
tuổi: 50,
eyeColor: “blue”
};

Hãy tự mình thử »

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

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

Xem Thêm  SQL FOREIGN KEY: Cách tạo trong SQL Server với ví dụ - sql tạo khóa ngoại

Tài sản
Giá trị tài sản

họ
John

họ
Doe

tuổi tác
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 thuộc tính đối tượng theo hai cách:

hoặc

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

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

Đối tượng cũng có thể có phương thức .

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

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

Tài sản
Giá trị tài sản

họ
John

họ
Doe

tuổi tác
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 thuộc tính.

Ví dụ

const người = {
firstName: “John”,
lastName: “Doe”,
id: 5566,
fullName: function () {
trả về this.firstName + “” + this.lastName;
}
};

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

I.E. this.firstName có nghĩa là thuộc tính firstName của this .

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

Đây là gì?

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

Đối tượng nào phụ thuộc vào cách này đang đượ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ục.
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, này không xác định .
Trong một sự kiện, this đề cập đến phần tử đã nhận 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 .

Lưu ý

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

Xem thêm:

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

Xem Thêm  Làm thế nào để triển khai Colspan HTML với các ví dụ? - colspan trong html là gì

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

Từ khóa this

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

Trong ví dụ trên, đây đố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 này về JavaScript .

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

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

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à các đối tượng!

Khi một biến JavaScript được khai báo với từ khóa “ new “, biến đó là
được tạo ra như
một đối tượng:

x = new String (); // Khai báo x là một đối tượng Chuỗi
y = new Number (); // Khai báo y như một đối tượng Number
z = new Boolean (); // Khai báo z là một đối tượng Boolean

Tránh String , Number Boolean đối tượng. 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 ở phần sau trong hướng dẫn này.

Tự kiểm tra 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 = {
  firstName: "John",
  lastName: "Doe"
};

báo động();

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


Xem thêm những thông tin liên quan đến chủ đề js thêm dữ liệu vào đối tượng

Tutor Javascript buổi 4

  • Tác giả: Thầy Long Web
  • Ngày đăng: 2022-04-03
  • Đánh giá: 4 ⭐ ( 7797 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Hướng dẫn về mô hình DOM, chọn node, sử dụng các hàm chọn node và thực hiện Assigment 2

Insert dữ liệu trên MongoDB bằng Node.js

  • Tác giả: toidicode.com
  • Đánh giá: 5 ⭐ ( 2074 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Phần trước, mình đã hướng dẫn mọi người tạo mới một collection trong MongoDB rồi. Thì sau khi đã tạo được collection rồi bài này chúng ta sẽ cùng nhau tìm hiểu về các cách thêm dữ liệu với vào trong MongoDB bằng Node.js.

Xử lý Object trong JavaScript

  • Tác giả: vi-magento.com
  • Đánh giá: 5 ⭐ ( 1417 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Trong bài viết này chúng ta sẽ tìm hiểu về cách xử lý Object trong JavaScript nhé. Kiểu Object là kiểu được sử dụng nhiều nhất vì tính linh...

[Tự học Javascript] Biến đổi đối tượng với Object.keys, values, entries(phần tử) trong Javascript

  • Tác giả: cafedev.vn
  • Đánh giá: 3 ⭐ ( 9696 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Hãy bước ra khỏi các cấu trúc dữ liệu riêng lẻ và nói về việc lặp qua chúng. Object.keys, values, entries(phần tử) trong Javascript

Object là gì? Object trong JavaScript

  • Tác giả: completejavascript.com
  • Đánh giá: 4 ⭐ ( 9450 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: JavaScript là ngôn ngữ dựa trên đối tượng, nên việc hiểu rõ về JavaScript Object sẽ là chìa khoá giúp bạn làm chủ JavaScript. Hãy tìm hiểu thật kỹ về Object trong JavaScript nhé!

Object trong Javascript (đọc hiểu trong 5 phút)

  • Tác giả: freetuts.net
  • Đánh giá: 3 ⭐ ( 6712 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Tìm hiểu object trong javascript, giúp bạn hiểu được khái niệm đối tượng object là gì? Cách khởi tạo và các thêm thuộc tính / phương thức vào đối tượng.

Đối tượng (Object) trong Javascript?

  • Tác giả: viblo.asia
  • Đánh giá: 5 ⭐ ( 4925 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Như các bạn đã biết, Javascript có 5 kiểu dữ liệu Number, String, Boolean, Undefined và Null và còn 1 kiểu khác nữa đó là Object (kiểu dữ liệu phức hợp). Kiểu Object là kiểu được sử dụng nhiều nhất...

Xem thêm các bài viết khác thuộc chuyên mục: Kiến thức lập trình