Hướng dẫn push new key/value to object javascript - đẩy khóa/giá trị mới vào đối tượng javascript

Tôi đã yêu thích Lodash / Undercore khi viết các dự án lớn hơn.

Thêm bởi

var obj = {key1: "value1", key2: "value2"};
var obj2 = {key2:"value4", key3: "value3", key4: undefined};
_.extend[obj, obj2];
console.log[obj];
// → {key1: "value1", key2: "value4", key3: "value3", key4: undefined}

4 hoặc

var obj = {key1: "value1", key2: "value2"};
var obj2 = {key2:"value4", key3: "value3", key4: undefined};
_.extend[obj, obj2];
console.log[obj];
// → {key1: "value1", key2: "value4", key3: "value3", key4: undefined}

5 đều là những câu trả lời của JavaScript thuần túy. Tuy nhiên, cả thư viện Lodash và Undercore đều cung cấp nhiều chức năng thuận tiện bổ sung khi làm việc với các đối tượng và mảng nói chung.

var obj = {key1: "value1", key2: "value2"};
var obj2 = {key2:"value4", key3: "value3", key4: undefined};
_.extend[obj, obj2];
console.log[obj];
// → {key1: "value1", key2: "value4", key3: "value3", key4: undefined}

6 dành cho mảng, không phải cho các đối tượng.

Tùy thuộc vào những gì bạn đang tìm kiếm, có hai chức năng cụ thể có thể tốt để sử dụng và cung cấp chức năng tương tự như cảm giác của

var obj = {key1: "value1", key2: "value2"};
var obj2 = {key2:"value4", key3: "value3", key4: undefined};
_.extend[obj, obj2];
console.log[obj];
// → {key1: "value1", key2: "value4", key3: "value3", key4: undefined}

7. Để biết thêm thông tin, hãy kiểm tra các tài liệu, họ có một số ví dụ tuyệt vời ở đó.

_.merge [chỉ Lodash]

Đối tượng thứ hai sẽ ghi đè hoặc thêm vào đối tượng cơ sở. Giá trị

var obj = {key1: "value1", key2: "value2"};
var obj2 = {key2:"value4", key3: "value3", key4: undefined};
_.extend[obj, obj2];
console.log[obj];
// → {key1: "value1", key2: "value4", key3: "value3", key4: undefined}

8 không được sao chép.

var obj = {key1: "value1", key2: "value2"};
var obj2 = {key2:"value4", key3: "value3", key4: undefined};
_.merge[obj, obj2];
console.log[obj];
// → {key1: "value1", key2: "value4", key3: "value3"} 

_.extend / _.assign

Đối tượng thứ hai sẽ ghi đè hoặc thêm vào đối tượng cơ sở.

var obj = {key1: "value1", key2: "value2"};
var obj2 = {key2:"value4", key3: "value3", key4: undefined};
_.extend[obj, obj2];
console.log[obj];
// → {key1: "value1", key2: "value4", key3: "value3", key4: undefined}

8 sẽ được sao chép.

var obj = {key1: "value1", key2: "value2"};
var obj2 = {key2:"value4", key3: "value3", key4: undefined};
_.extend[obj, obj2];
console.log[obj];
// → {key1: "value1", key2: "value4", key3: "value3", key4: undefined}

_.defaults

Đối tượng thứ hai chứa các mặc định sẽ được thêm vào đối tượng cơ sở nếu chúng không tồn tại. Các giá trị

var obj = {key1: "value1", key2: "value2"};
var obj2 = {key2:"value4", key3: "value3", key4: undefined};
_.extend[obj, obj2];
console.log[obj];
// → {key1: "value1", key2: "value4", key3: "value3", key4: undefined}

8 sẽ được sao chép nếu khóa đã tồn tại.

var obj = {key3: "value3", key5: "value5"};
var obj2 = {key1: "value1", key2:"value2", key3: "valueDefault", key4: "valueDefault", key5: undefined};
_.defaults[obj, obj2];
console.log[obj];
// → {key3: "value3", key5: "value5", key1: "value1", key2: "value2", key4: "valueDefault"}

$.extend

Ngoài ra, có thể đáng để đề cập đến jQuery.extend, nó hoạt động tương tự như _.merge và có thể là một lựa chọn tốt hơn nếu bạn đã sử dụng jQuery.

Đối tượng thứ hai sẽ ghi đè hoặc thêm vào đối tượng cơ sở. Giá trị

var obj = {key1: "value1", key2: "value2"};
var obj2 = {key2:"value4", key3: "value3", key4: undefined};
_.extend[obj, obj2];
console.log[obj];
// → {key1: "value1", key2: "value4", key3: "value3", key4: undefined}

8 không được sao chép.

var obj = {key1: "value1", key2: "value2"};
var obj2 = {key2:"value4", key3: "value3", key4: undefined};
$.extend[obj, obj2]; 
console.log[obj];
// → {key1: "value1", key2: "value4", key3: "value3"}

Object.assign[]

_.extend / _.assign

Đối tượng thứ hai sẽ ghi đè hoặc thêm vào đối tượng cơ sở.

var obj = {key1: "value1", key2: "value2"};
var obj2 = {key2:"value4", key3: "value3", key4: undefined};
_.extend[obj, obj2];
console.log[obj];
// → {key1: "value1", key2: "value4", key3: "value3", key4: undefined}

8 sẽ được sao chép.

var obj = {key1: "value1", key2: "value2"};
var obj2 = {key2:"value4", key3: "value3", key4: undefined};
Object.assign[obj, obj2]; 
console.log[obj];
// → {key1: "value1", key2: "value4", key3: "value3", key4: undefined}

Ví dụ 1: Thêm cặp khóa/giá trị vào một đối tượng bằng cách sử dụng ký hiệu dấu chấm

// program to add a key/value pair to an object

const person = {
    name: 'Monica',
    age: 22,
    gender: 'female'
}

// add a key/value pair
person.height = 5.4;

console.log[person];

Đầu ra

{
    name: "Monica",
    age: 22,
    gender: "female",
    height: 5.4
}

Trong ví dụ trên, chúng tôi thêm thuộc tính mới

var obj = {key3: "value3", key5: "value5"};
var obj2 = {key1: "value1", key2:"value2", key3: "valueDefault", key4: "valueDefault", key5: undefined};
_.defaults[obj, obj2];
console.log[obj];
// → {key3: "value3", key5: "value5", key1: "value1", key2: "value2", key4: "valueDefault"}

3 vào đối tượng & nbsp; ________ 24 bằng cách sử dụng ký hiệu dấu chấm

var obj = {key3: "value3", key5: "value5"};
var obj2 = {key1: "value1", key2:"value2", key3: "valueDefault", key4: "valueDefault", key5: undefined};
_.defaults[obj, obj2];
console.log[obj];
// → {key3: "value3", key5: "value5", key1: "value1", key2: "value2", key4: "valueDefault"}

5, tức là

var obj = {key3: "value3", key5: "value5"};
var obj2 = {key1: "value1", key2:"value2", key3: "valueDefault", key4: "valueDefault", key5: undefined};
_.defaults[obj, obj2];
console.log[obj];
// → {key3: "value3", key5: "value5", key1: "value1", key2: "value2", key4: "valueDefault"}

6.

Ví dụ 2: Thêm cặp khóa/giá trị vào một đối tượng bằng cách sử dụng ký hiệu khung vuông

// program to add a key/value pair to an object

const person = {
    name: 'Monica',
    age: 22,
    gender: 'female'
}

// add a key/value pair
person['height'] = 5.4;

console.log[person];

Đầu ra

{
    name: "Monica",
    age: 22,
    gender: "female",
    height: 5.4
}

Trong ví dụ trên, chúng tôi thêm thuộc tính mới

var obj = {key3: "value3", key5: "value5"};
var obj2 = {key1: "value1", key2:"value2", key3: "valueDefault", key4: "valueDefault", key5: undefined};
_.defaults[obj, obj2];
console.log[obj];
// → {key3: "value3", key5: "value5", key1: "value1", key2: "value2", key4: "valueDefault"}

3 vào đối tượng & nbsp; ________ 24 bằng cách sử dụng ký hiệu dấu chấm

var obj = {key3: "value3", key5: "value5"};
var obj2 = {key1: "value1", key2:"value2", key3: "valueDefault", key4: "valueDefault", key5: undefined};
_.defaults[obj, obj2];
console.log[obj];
// → {key3: "value3", key5: "value5", key1: "value1", key2: "value2", key4: "valueDefault"}

5, tức là

var obj = {key3: "value3", key5: "value5"};
var obj2 = {key1: "value1", key2:"value2", key3: "valueDefault", key4: "valueDefault", key5: undefined};
_.defaults[obj, obj2];
console.log[obj];
// → {key3: "value3", key5: "value5", key1: "value1", key2: "value2", key4: "valueDefault"}

6.

Thêm một cặp khóa/giá trị vào một đối tượng trong javascript #

Có nhiều cách để thêm một cặp khóa/giá trị vào một đối tượng:

• Sử dụng ký tự

  var obj = {key3: "value3", key5: "value5"};
  var obj2 = {key1: "value1", key2:"value2", key3: "valueDefault", key4: "valueDefault", key5: undefined};
  _.defaults[obj, obj2];
  console.log[obj];
  // → {key3: "value3", key5: "value5", key1: "value1", key2: "value2", key4: "valueDefault"}
  

  9, ví dụ:

  var obj = {key1: "value1", key2: "value2"};
  var obj2 = {key2:"value4", key3: "value3", key4: undefined};
  $.extend[obj, obj2]; 
  console.log[obj];
  // → {key1: "value1", key2: "value4", key3: "value3"}
  

  2.
• Sử dụng ký hiệu DOT

  var obj = {key3: "value3", key5: "value5"};
  var obj2 = {key1: "value1", key2:"value2", key3: "valueDefault", key4: "valueDefault", key5: undefined};
  _.defaults[obj, obj2];
  console.log[obj];
  // → {key3: "value3", key5: "value5", key1: "value1", key2: "value2", key4: "valueDefault"}
  

  5, ví dụ:

  var obj = {key1: "value1", key2: "value2"};
  var obj2 = {key2:"value4", key3: "value3", key4: undefined};
  $.extend[obj, obj2]; 
  console.log[obj];
  // → {key1: "value1", key2: "value4", key3: "value3"}
  

  4.
• Sử dụng phương thức

  var obj = {key1: "value1", key2: "value2"};
  var obj2 = {key2:"value4", key3: "value3", key4: undefined};
  $.extend[obj, obj2]; 
  console.log[obj];
  // → {key1: "value1", key2: "value4", key3: "value3"}
  

  5, chuyển nó một đối tượng mục tiêu và nguồn làm tham số.

Chúng ta hãy xem một ví dụ về việc thêm các cặp giá trị khóa với ký hiệu dấu chấm và khung.

Copied!
const obj = {name: 'Tom'};

obj.age = 30;

obj['country'] = 'Chile';

// 👇️ {name: 'Tom', age: 30, country: 'Chile'}
console.log[obj];

Ví dụ đầu tiên thêm một cặp khóa/giá trị bằng cách sử dụng ký hiệu DOT

var obj = {key3: "value3", key5: "value5"};
var obj2 = {key1: "value1", key2:"value2", key3: "valueDefault", key4: "valueDefault", key5: undefined};
_.defaults[obj, obj2];
console.log[obj];
// → {key3: "value3", key5: "value5", key1: "value1", key2: "value2", key4: "valueDefault"}

5. Nó ngắn gọn và trực tiếp hơn so với phương pháp ký hiệu

var obj = {key3: "value3", key5: "value5"};
var obj2 = {key1: "value1", key2:"value2", key3: "valueDefault", key4: "valueDefault", key5: undefined};
_.defaults[obj, obj2];
console.log[obj];
// → {key3: "value3", key5: "value5", key1: "value1", key2: "value2", key4: "valueDefault"}

9.

Nếu một khóa có tên được cung cấp đã tồn tại trong đối tượng, giá trị của nó sẽ được cập nhật.

Nếu tên của khóa chứa khoảng trắng hoặc dấu gạch nối

var obj = {key1: "value1", key2: "value2"};
var obj2 = {key2:"value4", key3: "value3", key4: undefined};
$.extend[obj, obj2]; 
console.log[obj];
// → {key1: "value1", key2: "value4", key3: "value3"}

8, bạn phải sử dụng dấu ngoặc vuông.

var obj = {key1: "value1", key2: "value2"};
var obj2 = {key2:"value4", key3: "value3", key4: undefined};
_.extend[obj, obj2];
console.log[obj];
// → {key1: "value1", key2: "value4", key3: "value3", key4: undefined}

0

Bạn cũng phải sử dụng phương pháp tiếp cận dấu ngoặc vuông khi bạn không biết tên của khóa trước và bạn cần đặt tên động cho khóa.

var obj = {key1: "value1", key2: "value2"};
var obj2 = {key2:"value4", key3: "value3", key4: undefined};
_.extend[obj, obj2];
console.log[obj];
// → {key1: "value1", key2: "value4", key3: "value3", key4: undefined}

1

Chúng tôi có tên của khóa được lưu trữ trong một biến, do đó chúng tôi không thể sử dụng ký hiệu DOT để thêm cặp khóa/giá trị vào đối tượng.

Chúng tôi không bao gồm giá trị giữa các dấu ngoặc vuông trong các trích dẫn, bởi vì nó là một biến có giá trị chúng tôi sử dụng cho tên khóa.

Hầu hết các lập trình viên sử dụng ký hiệu DOT

var obj = {key3: "value3", key5: "value5"};
var obj2 = {key1: "value1", key2:"value2", key3: "valueDefault", key4: "valueDefault", key5: undefined};
_.defaults[obj, obj2];
console.log[obj];
// → {key3: "value3", key5: "value5", key1: "value1", key2: "value2", key4: "valueDefault"}

5 để thêm các cặp khóa/giá trị vào các đối tượng, cho đến khi chúng phải sử dụng phương pháp hình vuông

var obj = {key3: "value3", key5: "value5"};
var obj2 = {key1: "value1", key2:"value2", key3: "valueDefault", key4: "valueDefault", key5: undefined};
_.defaults[obj, obj2];
console.log[obj];
// → {key3: "value3", key5: "value5", key1: "value1", key2: "value2", key4: "valueDefault"}

9.

Cách phổ biến nhất tiếp theo để thêm một cặp khóa/giá trị vào một đối tượng là sử dụng phương thức

var obj = {key1: "value1", key2: "value2"};
var obj2 = {key2:"value4", key3: "value3", key4: undefined};
Object.assign[obj, obj2]; 
console.log[obj];
// → {key1: "value1", key2: "value4", key3: "value3", key4: undefined}

1.

Để thêm nhiều cặp khóa/giá trị vào một đối tượng trong cùng một câu lệnh, hãy sử dụng phương thức

var obj = {key1: "value1", key2: "value2"};
var obj2 = {key2:"value4", key3: "value3", key4: undefined};
$.extend[obj, obj2]; 
console.log[obj];
// → {key1: "value1", key2: "value4", key3: "value3"}

5. Phương thức sao chép các cặp khóa/giá trị của một hoặc nhiều đối tượng vào đối tượng đích và trả về đối tượng mục tiêu được sửa đổi.

var obj = {key1: "value1", key2: "value2"};
var obj2 = {key2:"value4", key3: "value3", key4: undefined};
_.extend[obj, obj2];
console.log[obj];
// → {key1: "value1", key2: "value4", key3: "value3", key4: undefined}

2

Các đối số chúng tôi đã chuyển đến phương thức đối tượng.Assign là:

1. đối tượng đích - đối tượng mà các thuộc tính được cung cấp sẽ được áp dụngtarget object - the object to which the provided properties will be applied
2. [các] đối tượng nguồn - một hoặc nhiều đối tượng có chứa các thuộc tính mà chúng tôi muốn áp dụng cho đối tượng đíchsource object[s] - one or more objects that contain the properties we want to apply to the target object

Bạn có thể tưởng tượng rằng các cặp khóa/giá trị của đối tượng chúng tôi đã chuyển khi đối số thứ hai được sao chép vào đối tượng chúng tôi cung cấp cho đối số đầu tiên.

Phương thức

var obj = {key1: "value1", key2: "value2"};
var obj2 = {key2:"value4", key3: "value3", key4: undefined};
Object.assign[obj, obj2]; 
console.log[obj];
// → {key1: "value1", key2: "value4", key3: "value3", key4: undefined}

1 rất thuận tiện khi bạn phải thêm nhiều cặp khóa/giá trị vào một đối tượng.

Một cách tiếp cận phổ biến khác để thêm nhiều cặp khóa/giá trị vào một đối tượng là sử dụng

var obj = {key1: "value1", key2: "value2"};
var obj2 = {key2:"value4", key3: "value3", key4: undefined};
Object.assign[obj, obj2]; 
console.log[obj];
// → {key1: "value1", key2: "value4", key3: "value3", key4: undefined}

4. Tuy nhiên, để sử dụng cú pháp

var obj = {key1: "value1", key2: "value2"};
var obj2 = {key2:"value4", key3: "value3", key4: undefined};
Object.assign[obj, obj2]; 
console.log[obj];
// → {key1: "value1", key2: "value4", key3: "value3", key4: undefined}

5, chúng tôi phải khai báo biến bằng cách sử dụng từ khóa

var obj = {key1: "value1", key2: "value2"};
var obj2 = {key2:"value4", key3: "value3", key4: undefined};
Object.assign[obj, obj2]; 
console.log[obj];
// → {key1: "value1", key2: "value4", key3: "value3", key4: undefined}

6.

var obj = {key1: "value1", key2: "value2"};
var obj2 = {key2:"value4", key3: "value3", key4: undefined};
_.extend[obj, obj2];
console.log[obj];
// → {key1: "value1", key2: "value4", key3: "value3", key4: undefined}

3

Một cách dễ dàng để suy nghĩ về toán tử lây lan [...] là chúng tôi đang giải nén các cặp khóa/giá trị của đối tượng vào một đối tượng mới.

Chúng tôi sử dụng từ khóa

var obj = {key1: "value1", key2: "value2"};
var obj2 = {key2:"value4", key3: "value3", key4: undefined};
Object.assign[obj, obj2]; 
console.log[obj];
// → {key1: "value1", key2: "value4", key3: "value3", key4: undefined}

6 thay vì

var obj = {key1: "value1", key2: "value2"};
var obj2 = {key2:"value4", key3: "value3", key4: undefined};
Object.assign[obj, obj2]; 
console.log[obj];
// → {key1: "value1", key2: "value4", key3: "value3", key4: undefined}

8 vì nó cho phép chúng tôi khai báo lại biến

var obj = {key1: "value1", key2: "value2"};
var obj2 = {key2:"value4", key3: "value3", key4: undefined};
Object.assign[obj, obj2]; 
console.log[obj];
// → {key1: "value1", key2: "value4", key3: "value3", key4: undefined}

9.

Khi sử dụng phương pháp này, chúng tôi tạo một đối tượng mới bằng cách sử dụng các cặp khóa/giá trị của một đối tượng hiện có và thêm một hoặc nhiều cặp giá trị khóa.

Đọc thêm #

• Nhận các phím của một đối tượng làm mảng trong javascript
• Nhận các giá trị của một đối tượng làm mảng trong javascript
• Cách cập nhật đối tượng const trong JavaScript
• Kiểm tra xem giá trị có phải là đối tượng sử dụng JavaScript không
• Cách lấy độ dài của một đối tượng trong JavaScript
• Xóa các giá trị NULL và không xác định khỏi đối tượng trong JavaScript
• Cập nhật tất cả các giá trị trong một đối tượng bằng JavaScript
• Nhận giá trị của một đối tượng theo khóa biến trong JavaScript
• Cách đổi tên khóa của một đối tượng trong JavaScript
• Truy cập khóa đối tượng chứa một khoảng trống trong JavaScript
• Nhận số lượng khóa trong một đối tượng bằng JavaScript
• Chuyển đổi một đối tượng thành một mảng bằng JavaScript

Làm thế nào để bạn đẩy một giá trị khóa vào một đối tượng?

Bạn có thể đẩy vào đối tượng JavaScript không?

Làm cách nào để thêm giá trị khóa vào một mảng các đối tượng?

Làm thế nào để bạn thêm một cặp giá trị khóa vào một bản tóm tắt đối tượng?