Làm thế nào để bạn xác định một tài liệu tham khảo trong javascript?

Sự khác biệt chính giữa hai loại này là việc truyền theo giá trị xảy ra khi gán nguyên hàm trong khi truyền theo tham chiếu khi gán đối tượng

Hãy thảo luận về các giá trị và tài liệu tham khảo chi tiết hơn trong bài đăng này

1. Hiểu nguyên thủy và các đối tượng

JavaScript cung cấp 2 loại kiểu dữ liệu. nguyên thủy và đối tượng

Các số nguyên thủy là số, boolean, chuỗi, ký hiệu và giá trị đặc biệt

javascript
// Objects
const plainObject = {
  prop: 'Value'
};
const array = [1, 5, 6];
const functionObject = (n1, n2) => {
  return n1 + n2;
};

javascript
// Objects
const plainObject = {
  prop: 'Value'
};
const array = [1, 5, 6];
const functionObject = (n1, n2) => {
  return n1 + n2;
};

javascript
// Primitives
const number = 10;
const bool = false;
const str = 'Hello!';
const missingObject = null;
const nothing = undefined;

Loại thứ hai là đồ vật. Riêng đối tượng đơn giản, mảng, hàm, v.v. — đều là đối tượng

javascript
// Objects
const plainObject = {
  prop: 'Value'
};
const array = [1, 5, 6];
const functionObject = (n1, n2) => {
  return n1 + n2;
};

Nói cách khác, bất cứ thứ gì không phải là giá trị nguyên thủy đều là một đối tượng

2. giá trị

Quy tắc truyền theo giá trị đơn giản là tất cả các giá trị nguyên thủy trong JavaScript đều được truyền theo giá trị. Đơn giản như thế

Truyền theo giá trị có nghĩa là mỗi khi bạn gán một giá trị cho một biến, một bản sao của giá trị đó sẽ được tạo. Mỗi lần

Để tôi chỉ cho bạn cách vượt qua giá trị thể hiện chính nó

Giả sử bạn có 2 biến

javascript
// Objects
const plainObject = {
  prop: 'Value'
};
const array = [1, 5, 6];
const functionObject = (n1, n2) => {
  return n1 + n2;
};

javascript
// Objects
const plainObject = {
  prop: 'Value'
};
const array = [1, 5, 6];
const functionObject = (n1, n2) => {
  return n1 + n2;
};

javascript
let a = 1;
let b = a;
b = b + 2;
console.log(a); // 1
console.log(b); // 3

Câu lệnh đầu tiên

javascript
// Objects
const plainObject = {
  prop: 'Value'
};
const array = [1, 5, 6];
const functionObject = (n1, n2) => {
  return n1 + n2;
};

javascript
// Objects
const plainObject = {
  prop: 'Value'
};
const array = [1, 5, 6];
const functionObject = (n1, n2) => {
  return n1 + n2;
};

javascript
// Objects
const plainObject = {
  prop: 'Value'
};
const array = [1, 5, 6];
const functionObject = (n1, n2) => {
  return n1 + n2;
};

Câu lệnh thứ hai

javascript
// Objects
const plainObject = {
  prop: 'Value'
};
const array = [1, 5, 6];
const functionObject = (n1, n2) => {
  return n1 + n2;
};

javascript
// Objects
const plainObject = {
  prop: 'Value'
};
const array = [1, 5, 6];
const functionObject = (n1, n2) => {
  return n1 + n2;
};

javascript
// Objects
const plainObject = {
  prop: 'Value'
};
const array = [1, 5, 6];
const functionObject = (n1, n2) => {
  return n1 + n2;
};

javascript
// Objects
const plainObject = {
  prop: 'Value'
};
const array = [1, 5, 6];
const functionObject = (n1, n2) => {
  return n1 + n2;
};

javascript
// Objects
const plainObject = {
  prop: 'Value'
};
const array = [1, 5, 6];
const functionObject = (n1, n2) => {
  return n1 + n2;
};

Sau đó,

javascript
// Objects
const plainObject = {
  prop: 'Value'
};
const array = [1, 5, 6];
const functionObject = (n1, n2) => {
  return n1 + n2;
};

javascript
// Objects
const plainObject = {
  prop: 'Value'
};
const array = [1, 5, 6];
const functionObject = (n1, n2) => {
  return n1 + n2;
};

javascript
let a = 1;
let b = a;
b = b + 2;
console.log(a); // 1
console.log(b); // 3

javascript
// Objects
const plainObject = {
  prop: 'Value'
};
const array = [1, 5, 6];
const functionObject = (n1, n2) => {
  return n1 + n2;
};

javascript
// Objects
const plainObject = {
  prop: 'Value'
};
const array = [1, 5, 6];
const functionObject = (n1, n2) => {
  return n1 + n2;
};

3. Người giới thiệu

Tuy nhiên, việc vượt qua tham chiếu thể hiện theo cách khác

Khi tạo một đối tượng, bạn được cung cấp một tham chiếu đến đối tượng đó. Nếu 2 biến giữ cùng một tham chiếu thì việc thay đổi đối tượng phản ánh ở cả 2 biến

Hãy kiểm tra mẫu mã sau

javascript
// Objects
const plainObject = {
  prop: 'Value'
};
const array = [1, 5, 6];
const functionObject = (n1, n2) => {
  return n1 + n2;
};

Câu lệnh đầu tiên

javascript
let a = 1;
let b = a;
b = b + 2;
console.log(a); // 1
console.log(b); // 3

javascript
let a = 1;
let b = a;
b = b + 2;
console.log(a); // 1
console.log(b); // 3

Sau đó,

javascript
let a = 1;
let b = a;
b = b + 2;
console.log(a); // 1
console.log(b); // 3

javascript
let a = 1;
let b = a;
b = b + 2;
console.log(a); // 1
console.log(b); // 3

javascript
let a = 1;
let b = a;
b = b + 2;
console.log(a); // 1
console.log(b); // 3

javascript
let a = 1;
let b = a;
b = b + 2;
console.log(a); // 1
console.log(b); // 3

javascript
let a = 1;
let b = a;
b = b + 2;
console.log(a); // 1
console.log(b); // 3

javascript
// Objects
const plainObject = {
  prop: 'Value'
};
const array = [1, 5, 6];
const functionObject = (n1, n2) => {
  return n1 + n2;
};

javascript
let a = 1;
let b = a;
b = b + 2;
console.log(a); // 1
console.log(b); // 3

javascript
let a = 1;
let b = a;
b = b + 2;
console.log(a); // 1
console.log(b); // 3

Ghi chú. để đơn giản, tôi nói rằng các biến chứa các tham chiếu đến các đối tượng. Nhưng nói đúng ra các biến trong JavaScript giữ các giá trị tham chiếu đến các đối tượng

4. So sánh các giá trị và so sánh các tham chiếu

Hiểu sự khác biệt giữa giá trị và tham chiếu là điều quan trọng khi bạn muốn so sánh các đối tượng

Khi sử dụng toán tử so sánh chặt chẽ

javascript
// Objects
const plainObject = {
  prop: 'Value'
};
const array = [1, 5, 6];
const functionObject = (n1, n2) => {
  return n1 + n2;
};

javascript
let a = 1;
let b = a;
b = b + 2;
console.log(a); // 1
console.log(b); // 3

javascript
// Objects
const plainObject = {
  prop: 'Value'
};
const array = [1, 5, 6];
const functionObject = (n1, n2) => {
  return n1 + n2;
};

javascript
// Objects
const plainObject = {
  prop: 'Value'
};
const array = [1, 5, 6];
const functionObject = (n1, n2) => {
  return n1 + n2;
};

javascript
// Objects
const plainObject = {
  prop: 'Value'
};
const array = [1, 5, 6];
const functionObject = (n1, n2) => {
  return n1 + n2;
};

javascript
// Objects
const plainObject = {
  prop: 'Value'
};
const array = [1, 5, 6];
const functionObject = (n1, n2) => {
  return n1 + n2;
};

javascript
// Objects
const plainObject = {
  prop: 'Value'
};
const array = [1, 5, 6];
const functionObject = (n1, n2) => {
  return n1 + n2;
};

javascript
// Objects
const plainObject = {
  prop: 'Value'
};
const array = [1, 5, 6];
const functionObject = (n1, n2) => {
  return n1 + n2;
};

javascript
// Objects
const plainObject = {
  prop: 'Value'
};
const array = [1, 5, 6];
const functionObject = (n1, n2) => {
  return n1 + n2;
};

javascript
let a = 1;
let b = a;
b = b + 2;
console.log(a); // 1
console.log(b); // 3

Nhưng toán tử so sánh

javascript
// Objects
const plainObject = {
  prop: 'Value'
};
const array = [1, 5, 6];
const functionObject = (n1, n2) => {
  return n1 + n2;
};

javascript
let a = 1;
let b = a;
b = b + 2;
console.log(a); // 1
console.log(b); // 3

javascript
let a = 1;
let b = a;
b = b + 2;
console.log(a); // 1
console.log(b); // 3

javascript
// Objects
const plainObject = {
  prop: 'Value'
};
const array = [1, 5, 6];
const functionObject = (n1, n2) => {
  return n1 + n2;
};

Mảng tham chiếu

javascript
let a = 1;
let b = a;
b = b + 2;
console.log(a); // 1
console.log(b); // 3

javascript
let a = 1;
let b = a;
b = b + 2;
console.log(a); // 1
console.log(b); // 3

javascript
let a = 1;
let b = a;
b = b + 2;
console.log(a); // 1
console.log(b); // 3

javascript
let a = 1;
let b = a;
b = b + 2;
console.log(a); // 1
console.log(b); // 3

javascript
let a = 1;
let b = a;
b = b + 2;
console.log(a); // 1
console.log(b); // 3

javascript
let a = 1;
let b = a;
b = b + 2;
console.log(a); // 1
console.log(b); // 3

Toán tử so sánh chỉ trả về

javascript
// Objects
const plainObject = {
  prop: 'Value'
};
const array = [1, 5, 6];
const functionObject = (n1, n2) => {
  return n1 + n2;
};

javascript
// Objects
const plainObject = {
  prop: 'Value'
};
const array = [1, 5, 6];
const functionObject = (n1, n2) => {
  return n1 + n2;
};

javascript
// Objects
const plainObject = {
  prop: 'Value'
};
const array = [1, 5, 6];
const functionObject = (n1, n2) => {
  return n1 + n2;
};

5. Tóm lược

Trong các kiểu nguyên thủy của JavaScript được truyền xung quanh dưới dạng giá trị. nghĩa là mỗi khi một giá trị được gán, một bản sao của giá trị đó sẽ được tạo

Mặt khác, các đối tượng (bao gồm các đối tượng đơn giản, mảng, hàm, thể hiện lớp) là các tham chiếu. Nếu bạn sửa đổi đối tượng, thì tất cả các biến tham chiếu đến đối tượng đó sẽ thấy sự thay đổi

Toán tử so sánh phân biệt các giá trị so sánh và tham chiếu. 2 biến giữ tham chiếu chỉ bằng nhau nếu chúng tham chiếu chính xác cùng một đối tượng, nhưng 2 biến giữ giá trị bằng nhau nếu chúng chỉ có 2 giá trị giống nhau bất kể giá trị bắt nguồn từ đâu. từ một biến, theo nghĩa đen, v.v.

Tuy nhiên, thông thường, bạn có thể muốn so sánh các đối tượng theo cấu trúc của chúng hơn là theo tham chiếu. Kiểm tra bài viết Cách so sánh các đối tượng trong JavaScript

Thích bài viết?

Bài đăng chất lượng vào hộp thư đến của bạn

Tôi thường xuyên xuất bản bài viết có chứa

• Các khái niệm JavaScript quan trọng được giải thích bằng các từ đơn giản
• Tổng quan về các tính năng JavaScript mới
• Cách sử dụng TypeScript và cách gõ
• Thiết kế phần mềm và thực hành mã hóa tốt

Đăng ký nhận bản tin của tôi để nhận chúng ngay trong hộp thư đến của bạn

Tham gia cùng 6845 người đăng ký khác

Giới thiệu về Dmitri Pavlutin

Nhà văn và huấn luyện viên công nghệ. Thói quen hàng ngày của tôi bao gồm (nhưng không giới hạn) uống cà phê, viết mã, viết, huấn luyện, vượt qua sự nhàm chán 😉

Tham chiếu trong JavaScript có nghĩa là gì?

JavaScript có sử dụng tham chiếu không?

Làm cách nào để kiểm tra tham chiếu của biến trong JavaScript?