Trong JavaScript, chúng ta không thể so sánh trực tiếp hai đối tượng bằng toán tử đẳng thức [nhân đôi bằng == hoặc nhân ba bằng ===] để xem chúng có bằng nhau hay không. So sánh hai đối tượng như thế này dẫn đến sai ngay cả khi chúng có cùng dữ liệu. Đó là bởi vì đó là hai thể hiện đối tượng khác nhau, chúng đang đề cập đến hai đối tượng khác nhau
Như bạn có thể thấy ví dụ trên, cả name và fullName đều giống hệt nhau. Tuy nhiên, đối tượng không bằng với == hoặc ===
Có hai điều bạn có thể kiểm tra trong khi thực hiện đẳng thức đối tượng
1️⃣ Các đối tượng có cùng thể hiện
2️⃣ Các đối tượng có cùng giá trị
1️. Các đối tượng có cùng thể hiệnJavaScript có hai cách tiếp cận để khớp các giá trị
- Đối với Loại nguyên thủy [chuỗi, số], nó so sánh theo giá trị của chúng
- Đối với Loại không nguyên thủy [đối tượng, mảng, ngày], nó so sánh theo tham chiếu của chúng
So sánh theo tham chiếu có nghĩa là đối tượng đề cập đến cùng một vị trí trong bộ nhớ
thí dụ
let name = {
firstName: "suprabha",
lastName: "supi"
}let fullName = {
firstName: "suprabha",
lastName: "supi"
}let copyName = fullNameconsole.log[name === fullName] // false
console.log[copyName == fullName] // true
Ở đây, copyName và fullName đang đề cập đến cùng một trường hợp bộ nhớ và do đó trả về true
Để kiểm tra instance bạn có thể dùng đẳng thức ===, nhưng để khớp với giá trị thì bạn cần thao tác thêm 😂
let name = {
firstName: "suprabha",
lastName: "supi"
}let fullName = {
firstName: "suprabha",
lastName: "supi"
}function isEqual[obj1, obj2] {
var props1 = Object.getOwnPropertyNames[obj1];
var props2 = Object.getOwnPropertyNames[obj2]; if [props1.length != props2.length] {
return false;
} for [var i = 0; i < props1.length; i++] {
let val1 = obj1[props1[i]];
let val2 = obj2[props1[i]];
let isObjects = isObject[val1] && isObject[val2]; if [isObjects && !isEqual[val1, val2] || !isObjects && val1 !== val2] {
return false;
}
}
return true;
}function isObject[object] {
return object != null && typeof object === 'object';
}console.log[isEqual[name, fullName]]; // true
Có một vài plugin giúp bạn về điều kiện trên, nơi bạn chỉ cần sử dụng
let name = {1 để kiểm tra các giá trị đối tượng
firstName: "suprabha",
lastName: "supi"
}let fullName = {
firstName: "suprabha",
lastName: "supi"
}let copyName = fullNameconsole.log[name === fullName] // false
console.log[copyName == fullName] // true
- UnderScore
- Lodash
- nút isDeepStrictEqual[object1, object2]
let name = {Tóm tắt ⅀
firstName: "suprabha",
lastName: "supi"
}let fullName = {
firstName: "suprabha",
lastName: "supi"
}console.log[_.isEqual[name, fullName]]; // true
Trong đối tượng, nếu bạn thực hiện kiểm tra đối tượng cho hai đối tượng thì bạn có thể sử dụng ==, === và
let name = {4
firstName: "suprabha",
lastName: "supi"
}let fullName = {
firstName: "suprabha",
lastName: "supi"
}let copyName = fullNameconsole.log[name === fullName] // false
console.log[copyName == fullName] // true
Hôm nay, tôi sẽ chỉ cho các bạn một cách cơ bản để viết một hàm so sánh hai đối tượng và cũng truy xuất các thuộc tính phù hợp của chúng
so sánhObject[]Chức năng này như tên trạng thái sẽ được sử dụng để so sánh 2 đối tượng và nó hoạt động đối với các đối tượng chứa các thuộc tính đơn giản nhưng không phức tạp
Giới thiệu về các đối tượngTrong trường hợp này, một thuộc tính phức tạp có thể được xem như một thuộc tính mà giá trị của chúng chứa các mảng hoặc các đối tượng khác bên trong chúng
Trước khi bắt đầu, hãy để chúng tôi làm mới bộ nhớ của mình trên Đối tượng JavaScript
Nói, chúng ta có đối tượng bên dưới
Để truy cập giá trị của bất kỳ thuộc tính nào, chúng tôi sẽ sử dụng khóa
Để liệt kê tất cả các khóa có trong Đối tượng này, chúng ta sẽ làm như thế này;
Bây giờ, tùy thuộc vào thuộc tính chúng tôi muốn truy cập, chúng tôi sẽ sử dụng các khóa tương ứng để truy cập chúng
Hãy truy cập vào
let name = {4 [user_id],
firstName: "suprabha",
lastName: "supi"
}let fullName = {
firstName: "suprabha",
lastName: "supi"
}function isEqual[obj1, obj2] {
var props1 = Object.getOwnPropertyNames[obj1];
var props2 = Object.getOwnPropertyNames[obj2]; if [props1.length != props2.length] {
return false;
} for [var i = 0; i < props1.length; i++] {
let val1 = obj1[props1[i]];
let val2 = obj2[props1[i]];
let isObjects = isObject[val1] && isObject[val2]; if [isObjects && !isEqual[val1, val2] || !isObjects && val1 !== val2] {
return false;
}
}
return true;
}function isObject[object] {
return object != null && typeof object === 'object';
}console.log[isEqual[name, fullName]]; // true
name và let name = {6 của người dùng
firstName: "suprabha",
lastName: "supi"
}let fullName = {
firstName: "suprabha",
lastName: "supi"
}function isEqual[obj1, obj2] {
var props1 = Object.getOwnPropertyNames[obj1];
var props2 = Object.getOwnPropertyNames[obj2]; if [props1.length != props2.length] {
return false;
} for [var i = 0; i < props1.length; i++] {
let val1 = obj1[props1[i]];
let val2 = obj2[props1[i]];
let isObjects = isObject[val1] && isObject[val2]; if [isObjects && !isEqual[val1, val2] || !isObjects && val1 !== val2] {
return false;
}
}
return true;
}function isObject[object] {
return object != null && typeof object === 'object';
}console.log[isEqual[name, fullName]]; // true
Vì chúng ta không thể trực tiếp sử dụng phương thức độ dài để tìm xem có bao nhiêu thuộc tính được chứa trong đối tượng, nên trước tiên chúng ta phải liệt kê các khóa và sau đó tìm xem có bao nhiêu khóa đã được liệt kê. Bằng cách này, chúng ta có tổng các thuộc tính chứa trong đối tượng
Có kiến thức cơ bản về các đối tượng, hãy viết hàm so sánh hai đối tượng và trả về true nếu chúng bằng nhau và trả về false nếu chúng không bằng nhau
Chúng tôi sẽ bắt đầu bằng cách kiểm tra xem các tham số được cung cấp có phải là Đối tượng không
Hàm mũi tên bên dưới trả về true nếu nó là một đối tượng hoặc false nếu không
Sau đó, chúng tôi kiểm tra xem chiều dài của đối tượng đầu tiên có bằng chiều dài của đối tượng thứ hai không
Điều này là do khi so sánh hai đối tượng, trong trường hợp này là Đối tượng, chúng phải có độ dài và thuộc tính bằng nhau
Bây giờ, chúng ta sẽ lặp qua đối tượng đầu tiên, để so sánh từng thuộc tính của nó [khóa và giá trị] với đối tượng thứ hai
Chúng tôi cũng sẽ tạo một biến lưu trữ số lượng thuộc tính phù hợp và sau đó chúng tôi sẽ kiểm tra xem số lượng thuộc tính phù hợp có bằng độ dài của đối tượng hay không. Nếu chúng bằng nhau, chúng ta sẽ trả về true nghĩa là hai đối tượng được cung cấp bằng nhau
Kiểm tra chức năng so sánh đối tượng của chúng tôiMặt khác để test chức năng này chúng ta sẽ tạo 4 Object. Hai đối tượng sẽ chứa các thuộc tính giống nhau [a và d] và hai đối tượng còn lại sẽ chứa các thuộc tính không bằng nhau [b và c]. Sau đó, chúng ta sẽ gọi hàm và truyền vào các biến
Đây là kịch bản đầy đủ
Hãy gọi hàm
So sánh b và c
So sánh a và d
Chúng ta đã hoàn thành chức năng kiểm tra xem hai đối tượng có bằng nhau không. Nó trả về true nếu bằng và false nếu không bằng. Chúng ta có thể mở rộng hàm để liệt kê các thuộc tính có trong cả hai đối tượng
Chúng ta có thể sử dụng điều này để liệt kê các thuộc tính phù hợp có trong các đối tượng
Hãy để chúng tôi chỉnh sửa chức năng của chúng tôi
Chúng ta sẽ tạo một biến kiểu đối tượng, biến này sẽ lưu trữ các thuộc tính phù hợp [nghĩa là. thuộc tính chứa trong đối tượng đầu tiên và trong đối tượng thứ hai]
Sau đó, bên trong khối xác nhận xem cả hai thuộc tính có bằng nhau hay không, chúng tôi sẽ nối thêm khóa và giá trị của thuộc tính phù hợp
Bây giờ chúng ta hãy kiểm tra lại chức năng bằng cách so sánh các đối tượng không bằng nhau trước đó. Hàm sẽ liệt kê các thuộc tính phù hợp của hai đối tượng và trả về false vì chúng không bằng nhau
so sánh đối tượng b và c
nó hoạt động
kết thúcNếu thuộc tính Đối tượng của bạn chứa một giá trị là đối tượng hoặc mảng [thuộc tính phức hợp trong trường hợp này], toán tử so sánh [===] sẽ trả về false vì chúng ta không thể so sánh trực tiếp 2 đối tượng hoặc mảng bằng toán tử
Trong trường hợp này, bạn sẽ phải kiểm tra xem giá trị là một mảng hay một đối tượng, sau đó lặp qua các giá trị của nó để đưa nó xuống mức so sánh. Hoặc bạn có thể chuyển đổi hai cấu trúc dữ liệu thành chuỗi JSON bằng JSON. stringify[] và sau đó so sánh chúng
CHỈNH SỬAHướng dẫn sử dụng JSON. xâu chuỗi lại
Hàm ở trên hoạt động hoàn hảo cho các đối tượng nông và điều này có nghĩa là các thuộc tính trong đối tượng phải chứa một khóa và một giá trị là một chuỗi hoặc một số. Nhưng nếu thuộc tính đối tượng chứa một khóa và một giá trị là một mảng hoặc một đối tượng, thì hàm ở trên sẽ không giúp được gì
Sử dụng chức năng bên dưới, bạn có thể so sánh bất kỳ loại đối tượng nào, miễn là bạn không cần truy xuất các thuộc tính phù hợp của nó [nội dung cho một ngày khác]
Logic đằng sau chức năng bên dưới về cơ bản chỉ là sử dụng JSON. stringify để chuyển đổi đối tượng thành chuỗi JSON, lưu kết quả vào một biến, sau đó lặp qua từng ký tự và kiểm tra xem nó có tồn tại trong đối tượng khác hay không bằng cách sử dụng phương thức
let name = {7
firstName: "suprabha",
lastName: "supi"
}let fullName = {
firstName: "suprabha",
lastName: "supi"
}function isEqual[obj1, obj2] {
var props1 = Object.getOwnPropertyNames[obj1];
var props2 = Object.getOwnPropertyNames[obj2]; if [props1.length != props2.length] {
return false;
} for [var i = 0; i < props1.length; i++] {
let val1 = obj1[props1[i]];
let val2 = obj2[props1[i]];
let isObjects = isObject[val1] && isObject[val2]; if [isObjects && !isEqual[val1, val2] || !isObjects && val1 !== val2] {
return false;
}
}
return true;
}function isObject[object] {
return object != null && typeof object === 'object';
}console.log[isEqual[name, fullName]]; // true
Tôi nhận được gợi ý này từ Sunil và tôi rất vui vì nó giải quyết được vấn đề
Hãy bắt đầu nào
- Đầu tiên, chúng ta cần kiểm tra xem biến được cung cấp có phải là một đối tượng không
- Sau đó, chúng tôi kiểm tra xem độ dài của đối tượng đầu tiên có bằng đối tượng thứ hai không
Tiếp theo, chúng ta sẽ tạo một biến
let name = {8 sẽ lưu trữ số lượng ký tự được khớp và sau đó là một biến
firstName: "suprabha",
lastName: "supi"
}let fullName = {
firstName: "suprabha",
lastName: "supi"
}function isEqual[obj1, obj2] {
var props1 = Object.getOwnPropertyNames[obj1];
var props2 = Object.getOwnPropertyNames[obj2]; if [props1.length != props2.length] {
return false;
} for [var i = 0; i < props1.length; i++] {
let val1 = obj1[props1[i]];
let val2 = obj2[props1[i]];
let isObjects = isObject[val1] && isObject[val2]; if [isObjects && !isEqual[val1, val2] || !isObjects && val1 !== val2] {
return false;
}
}
return true;
}function isObject[object] {
return object != null && typeof object === 'object';
}console.log[isEqual[name, fullName]]; // true
let name = {9 sẽ lưu trữ kết quả chuyển đổi đối tượng đầu tiên thành chuỗi JSON bằng JSON. xâu chuỗi lại
firstName: "suprabha",
lastName: "supi"
}let fullName = {
firstName: "suprabha",
lastName: "supi"
}function isEqual[obj1, obj2] {
var props1 = Object.getOwnPropertyNames[obj1];
var props2 = Object.getOwnPropertyNames[obj2]; if [props1.length != props2.length] {
return false;
} for [var i = 0; i < props1.length; i++] {
let val1 = obj1[props1[i]];
let val2 = obj2[props1[i]];
let isObjects = isObject[val1] && isObject[val2]; if [isObjects && !isEqual[val1, val2] || !isObjects && val1 !== val2] {
return false;
}
}
return true;
}function isObject[object] {
return object != null && typeof object === 'object';
}console.log[isEqual[name, fullName]]; // true
Bây giờ, chúng ta phải lặp qua biến
let name = {9 và kiểm tra xem mỗi ký tự có được chứa trong đối tượng thứ hai được xâu chuỗi không. Nếu tìm thấy khớp, chúng tôi sẽ tăng biến
firstName: "suprabha",
lastName: "supi"
}let fullName = {
firstName: "suprabha",
lastName: "supi"
}function isEqual[obj1, obj2] {
var props1 = Object.getOwnPropertyNames[obj1];
var props2 = Object.getOwnPropertyNames[obj2]; if [props1.length != props2.length] {
return false;
} for [var i = 0; i < props1.length; i++] {
let val1 = obj1[props1[i]];
let val2 = obj2[props1[i]];
let isObjects = isObject[val1] && isObject[val2]; if [isObjects && !isEqual[val1, val2] || !isObjects && val1 !== val2] {
return false;
}
}
return true;
}function isObject[object] {
return object != null && typeof object === 'object';
}console.log[isEqual[name, fullName]]; // true
let name = {8 và sau vòng lặp, chúng tôi sẽ kiểm tra xem biến khớp có bằng độ dài của đối tượng được xâu chuỗi không
firstName: "suprabha",
lastName: "supi"
}let fullName = {
firstName: "suprabha",
lastName: "supi"
}function isEqual[obj1, obj2] {
var props1 = Object.getOwnPropertyNames[obj1];
var props2 = Object.getOwnPropertyNames[obj2]; if [props1.length != props2.length] {
return false;
} for [var i = 0; i < props1.length; i++] {
let val1 = obj1[props1[i]];
let val2 = obj2[props1[i]];
let isObjects = isObject[val1] && isObject[val2]; if [isObjects && !isEqual[val1, val2] || !isObjects && val1 !== val2] {
return false;
}
}
return true;
}function isObject[object] {
return object != null && typeof object === 'object';
}console.log[isEqual[name, fullName]]; // true
Lý do tôi chọn sử dụng phương thức bao gồm chứ không phải toán tử so sánh để kiểm tra điều này là vì hai đối tượng bằng nhau như thế này;
hai đối tượng bằng nhau
Cả hai đối tượng trên đều bằng nhau, nhưng giá trị thuộc tính của đối tượng thứ hai là một mảng chứa các giá trị giống như đối tượng thứ nhất nhưng theo cách ngược lại. Vì vậy, nếu một toán tử so sánh được sử dụng để so sánh điều này, kết quả sẽ là sai
Đó là lý do tại sao tôi chọn sử dụng phương pháp
let name = {7 để kiểm tra xem ký tự có được bao gồm trong đối tượng thứ hai được xâu chuỗi hay không
firstName: "suprabha",
lastName: "supi"
}let fullName = {
firstName: "suprabha",
lastName: "supi"
}function isEqual[obj1, obj2] {
var props1 = Object.getOwnPropertyNames[obj1];
var props2 = Object.getOwnPropertyNames[obj2]; if [props1.length != props2.length] {
return false;
} for [var i = 0; i < props1.length; i++] {
let val1 = obj1[props1[i]];
let val2 = obj2[props1[i]];
let isObjects = isObject[val1] && isObject[val2]; if [isObjects && !isEqual[val1, val2] || !isObjects && val1 !== val2] {
return false;
}
}
return true;
}function isObject[object] {
return object != null && typeof object === 'object';
}console.log[isEqual[name, fullName]]; // true
KIỂM TRA
Sử dụng chức năng mới của chúng tôi, Chúng tôi sẽ bắt đầu bằng cách so sánh ví dụ trên, sau đó chúng tôi sẽ so sánh một đối tượng có chứa một thuộc tính phức tạp [đó là lý do chính cho bài viết này]
So sánh ví dụ trên
So sánh một đối tượng với một thuộc tính phức tạp
so sánh chức năng đối tượng
Nhìn vào kết quả trong hình trên, chúng ta có thể nói rằng các đối tượng
let name = {3 và
firstName: "suprabha",
lastName: "supi"
}let fullName = {
firstName: "suprabha",
lastName: "supi"
}let copyName = fullNameconsole.log[name === fullName] // false
console.log[copyName == fullName] // true
name0 bằng nhauTôi hy vọng bạn đã tìm thấy điều này hữu ích. Vui lòng gửi câu hỏi, chỉnh sửa hoặc đề xuất của bạn bằng cách sử dụng hộp bình luận bên dưới
Cảm ơn bạn
Xây dựng các ứng dụng web có thể kết hợp
Đừng xây dựng web nguyên khối. Sử dụng Bit để tạo và soạn các thành phần phần mềm tách rời — trong các khung yêu thích của bạn như React hoặc Node. Xây dựng các ứng dụng mô-đun và có thể mở rộng với trải nghiệm nhà phát triển mạnh mẽ và thú vị
Đưa nhóm của bạn đến Bit Cloud để lưu trữ và cộng tác trên các thành phần cùng nhau, đồng thời tăng tốc, mở rộng quy mô và chuẩn hóa đáng kể quá trình phát triển theo nhóm. Bắt đầu với các giao diện người dùng có thể kết hợp như Hệ thống thiết kế hoặc Giao diện vi mô hoặc khám phá phần phụ trợ có thể kết hợp. Hãy thử nó →