Làm cách nào để chuyển đổi một đối tượng thành một chuỗi trong JavaScript?

Đúng, đó là những gì chúng tôi sẽ trình bày trong hướng dẫn này – Đọc tiếp để biết thêm ví dụ

ⓘ Tôi đã bao gồm một tệp zip chứa tất cả mã nguồn ví dụ khi bắt đầu hướng dẫn này, vì vậy bạn không cần phải sao chép-dán mọi thứ… Hoặc nếu bạn chỉ muốn đi sâu vào

TRANG TRÌNH BÀY NHANH

TẢI XUỐNG & LƯU Ý

Đầu tiên, đây là liên kết tải xuống mã ví dụ như đã hứa

GHI CHÚ NHANH

Nếu bạn phát hiện ra một lỗi, hãy bình luận bên dưới. Tôi cũng cố gắng trả lời các câu hỏi ngắn, nhưng đó là một người so với cả thế giới… Nếu bạn cần câu trả lời gấp, vui lòng xem danh sách các trang web của tôi để được trợ giúp về lập trình

MÃ VÍ DỤ TẢI XUỐNG

Nhấp vào đây để tải xuống mã nguồn, tôi đã phát hành mã nguồn này theo giấy phép của MIT, vì vậy, vui lòng xây dựng trên mã nguồn đó hoặc sử dụng mã nguồn đó trong dự án của riêng bạn.

ĐỐI TƯỢNG ĐẾN CHUỖI

Được rồi, bây giờ chúng ta hãy tìm hiểu các cách khác nhau mà chúng ta có thể tạo các hàm (hoặc quy trình) để biến một đối tượng thành một chuỗi

1) MÃ HÓA JSON

1-json. html

// (A) THE OBJECT
var theobj = {
  name : "John Doe",
  email : "[email protected]",
  address : "123 Doe Street"
};
 
// (B) JSON ENCODE TO STRING
var thestring = JSON.stringify(theobj);
// {"name":"John Doe","email":"[email protected]","address":"123 Doe Street"}
console.log(thestring);

Đây là hàm Javascript gốc duy nhất biến đối tượng thành chuỗi và JSON là gì? . Đối với những người mới bắt đầu chưa nghe về nó, nó chỉ đơn giản là một cách để biểu diễn mảng và đối tượng ở định dạng chuỗi… Sử dụng JSON.stringify(OBJECT) để biến một mảng hoặc đối tượng thành .

// (A) THE OBJECT
var theobj = {
  name : "John Doe",
  email : "[email protected]",
  address : "123 Doe Street"
};
 
// (B) MANUAL FOR LOOP
var thestring = "";
for (let i in theobj) {
  thestring += i + ":" + theobj[i] + ", ";
}
thestring = thestring.substring(0, thestring.length -2);
 
// name:John Doe, email:[email protected], address:123 Doe Street
console.log(thestring);

2) VÒNG ĐẶT & CHUYỂN ĐỔI THỦ CÔNG

2-cho. html

// (A) THE OBJECT
var theobj = {
  name : "John Doe",
  email : "[email protected]",
  address : "123 Doe Street"
};
 
// (B) MANUAL FOR LOOP
var thestring = "";
for (let i in theobj) {
  thestring += i + ":" + theobj[i] + ", ";
}
thestring = thestring.substring(0, thestring.length -2);
 
// name:John Doe, email:[email protected], address:123 Doe Street
console.log(thestring);

Cái này phải đơn giản và “thân thiện với người mới”. Chúng ta chỉ đơn giản chạy qua đối tượng bằng cách sử dụng vòng lặp

// (A) THE OBJECT
var theobj = {
  name : "John Doe",
  email : "[email protected]",
  address : "123 Doe Street"
};
 
// (B) MANUAL FOR LOOP
var thestring = "";
for (let i in theobj) {
  thestring += i + ":" + theobj[i] + ", ";
}
thestring = thestring.substring(0, thestring.length -2);
 
// name:John Doe, email:[email protected], address:123 Doe Street
console.log(thestring);

3) CHỨC NĂNG TÙY CHỈNH

3-xâu chuỗi. html

// (A) CREATE OBJECT WITH CUSTOM STRINGIFY FUNCTION
var theobj = {
  name : "John Doe",
  email : "[email protected]",
  address : "123 Doe Street",
  stringify : function () {
    let thestring = "";
    thestring += "name: " + this.name + ", ";
    thestring += "email: " + this.email + ", ";
    thestring += "address: " + this.address;
    return thestring;
  }
};

// (B) CALL THE STRINGIFY() FUNCTION
var thestring = theobj.stringify();
// name: John Doe, email: [email protected], address: 123 Doe Street
console.log(thestring);

// (C) THE CONVENIENCE - CHANGING PROPERTIES
theobj.name = "Jane Doe";
theobj.email = "jane@doe,com";
thestring = theobj.stringify();
// name: Jane Doe, email: jane@doe,com, address: 123 Doe Street
console.log(thestring);

Nói về hàm trong đối tượng – Vâng, đối với người mới bắt đầu chưa biết, chúng ta có thể đưa hàm vào đối tượng. Vì vậy, trong trường hợp này, chúng tôi tạo hàm

// (A) THE OBJECT
var theobj = {
  name : "John Doe",
  email : "[email protected]",
  address : "123 Doe Street"
};
 
// (B) MANUAL FOR LOOP
var thestring = "";
for (let i in theobj) {
  thestring += i + ":" + theobj[i] + ", ";
}
thestring = thestring.substring(0, thestring.length -2);
 
// name:John Doe, email:[email protected], address:123 Doe Street
console.log(thestring);

4) GHI ĐỔI CHỨC NĂNG NGUYÊN MÔ CHUỖI

4 nguyên mẫu. html

// (A) THE OBJECT
var theobj = {
  name: "John Doe",
  email: "[email protected]",
  address: "123 Doe Street"
};
 
// (B) JAVASCRIPT HAS A NATIVE "TO STRING" FUNCTION
// BUT IT DOES NOTHING ON OBJECTS...
console.log(theobj.toString);
// [object Object]
console.log(theobj.toString());

// (C) AS SUGGESTED BY SOME OTHER TUTORIALS...
// WE CAN OVERRIDE THE PROTOTYPE TO STRING FUNCTION
Object.prototype.toString = function () {
  let thestring = "Name: " + this.name;
  thestring += "Email: " + this.email;
  thestring += "Address: " + this.address;
  return thestring;
};
 
// Name: John DoeEmail: [email protected]: 123 Doe Street
console.log(theobj.toString());

Đây là cái tôi tìm thấy ở đâu đó trên Internet. Đúng, Javascript thực sự có chức năng

// (A) THE OBJECT
var theobj = {
  name : "John Doe",
  email : "[email protected]",
  address : "123 Doe Street"
};
 
// (B) MANUAL FOR LOOP
var thestring = "";
for (let i in theobj) {
  thestring += i + ":" + theobj[i] + ", ";
}
thestring = thestring.substring(0, thestring.length -2);
 
// name:John Doe, email:[email protected], address:123 Doe Street
console.log(thestring);

// (A) THE OBJECT
var theobj = {
  name : "John Doe",
  email : "[email protected]",
  address : "123 Doe Street"
};
 
// (B) MANUAL FOR LOOP
var thestring = "";
for (let i in theobj) {
  thestring += i + ":" + theobj[i] + ", ";
}
thestring = thestring.substring(0, thestring.length -2);
 
// name:John Doe, email:[email protected], address:123 Doe Street
console.log(thestring);

5) LỚP JAVASCRIPT

5 lớp. html

// (A) PERSON CLASS
class person {
  constructor (name, email, address) {
    this.name = name;
    this.email = email;
    this.address = address;
  }
 
  stringify () {
    let thestring = "Name: " + this.name;
    thestring += "Email: " + this.email;
    thestring += "Address: " + this.address;
    return thestring;
  }
}

// (B) CREATE OBJECT
var theobj = new person(
  "John Doe",
  "[email protected]",
  "123 Doe Street"
);

// (C) CALL STRINGIFY() FUNCTION
var thestring = theobj.stringify();
console.log(thestring);

Nếu việc ghi đè hàm

// (A) THE OBJECT
var theobj = {
  name : "John Doe",
  email : "[email protected]",
  address : "123 Doe Street"
};
 
// (B) MANUAL FOR LOOP
var thestring = "";
for (let i in theobj) {
  thestring += i + ":" + theobj[i] + ", ";
}
thestring = thestring.substring(0, thestring.length -2);
 
// name:John Doe, email:[email protected], address:123 Doe Street
console.log(thestring);

Các bạn đã từng sử dụng các ngôn ngữ OOP khác sẽ quen thuộc với ngôn ngữ này. Chỉ cần thêm một hàm ______12 vào lớp và tất cả các đối tượng tương ứng sẽ kế thừa nó.

BIT & LIÊN KẾT HỮU ÍCH

Đó là tất cả cho hướng dẫn này và đây là một phần nhỏ về một số tính năng bổ sung và liên kết có thể hữu ích cho bạn

NÀO ĐỂ SỬ DỤNG?

Vâng, nó phụ thuộc vào những gì bạn đang cố gắng làm

• Nếu bạn có ý định biến đối tượng thành một chuỗi với mục đích truyền dữ liệu (ví dụ: gửi biểu mẫu đến máy chủ) – thì JSON có ý nghĩa hơn
• Nhưng nếu bạn có ý định hiển thị dữ liệu đối tượng cho người dùng – Tạo chức năng “dữ liệu đối tượng định dạng thành một chuỗi đẹp” tùy chỉnh sẽ có ý nghĩa hơn

TÓM LƯỢC

// (A) THE OBJECT
var theobj = {
  name : "John Doe",
  email : "[email protected]",
  address : "123 Doe Street"
};
 
// (B) MANUAL FOR LOOP
var thestring = "";
for (let i in theobj) {
  thestring += i + ":" + theobj[i] + ", ";
}
thestring = thestring.substring(0, thestring.length -2);
 
// name:John Doe, email:[email protected], address:123 Doe Street
console.log(thestring);

LIÊN KẾT và THAM KHẢO

• Cách chuyển đối tượng thành chuỗi – W3docs

BẢNG CHEAT INFOGRAPHIC

Cảm ơn bạn đã đọc, và chúng tôi đã đi đến phần cuối của hướng dẫn này. Tôi hy vọng rằng nó đã giúp bạn với dự án của bạn và nếu bạn muốn chia sẻ bất cứ điều gì với hướng dẫn này, xin vui lòng bình luận bên dưới. Chúc may mắn và mã hóa hạnh phúc

Bạn có thể biến một đối tượng thành một chuỗi không?

Làm cách nào để chuyển đổi giá trị đối tượng thành chuỗi?

Làm cách nào để in đối tượng dưới dạng chuỗi trong JavaScript?

Làm cách nào để chuyển đổi mảng đối tượng thành chuỗi trong JavaScript?