如何将 object 推入数组？

Question

I know it's simple, but I don't get it.

I have this code:

// My object
const nieto = {
  label: "Title",
  value: "Ramones" 
}

let nietos = [];
nietos.push(nieto.label);
nietos.push(nieto.value);

If I do this I'll get a simple array:

["Title", "Ramones"]

I need to create the following:

[{"01":"Title", "02": "Ramones"}]

How can I use push() to add the object into the nietos array?

Answer 1

You have to create an object . Assign the values to the object. Then push it into the array:

var nietos = [];
var obj = {};
obj["01"] = nieto.label;
obj["02"] = nieto.value;
nietos.push(obj);

Answer 2

Create an array of object like this:

var nietos = [];
nietos.push({"01": nieto.label, "02": nieto.value});
return nietos;

First you create the object inside of the push method and then return the newly created array.

Answer 3

can be done like this too.

       let data_array = [];
    
       let my_object = {}; 

       my_object.name = "stack";
       my_object.age = 20;
       my_object.hair_color = "red";
       my_object.eye_color = "green";
        
       data_array.push(my_object);

Answer 4

Well, ["Title", "Ramones"] is an array of strings. But [{"01":"Title", "02", "Ramones"}] is an array of object.

If you are willing to push properties or value into one object, you need to access that object and then push data into that. Example: nietos[indexNumber].yourProperty=yourValue; in real application:

nietos[0].02 = "Ramones";

If your array of object is already empty, make sure it has at least one object, or that object in which you are going to push data to.

Let's say, our array is myArray[] , so this is now empty array, the JS engine does not know what type of data does it have, not string, not object, not number nothing. So, we are going to push an object (maybe empty object) into that array. myArray.push({}) , or myArray.push({""}) .

This will push an empty object into myArray which will have an index number 0 , so your exact object is now myArray[0]

Then push property and value into that like this:

myArray[0].property = value;
//in your case:
myArray[0]["01"] = "value";

Answer 5

I'm not really sure, but you can try some like this:

var pack = function( arr ) {
    var length = arr.length,
        result = {},
        i;

    for ( i = 0; i < length; i++ ) {
        result[ ( i < 10 ? '0' : '' ) + ( i + 1 ) ] = arr[ i ];
    }

    return result;
};

pack( [ 'one', 'two', 'three' ] ); //{01: "one", 02: "two", 03: "three"}

Answer 6

The below solution is more straight-forward. All you have to do is define one simple function that can "CREATE" the object from the two given items. Then simply apply this function to TWO arrays having elements for which you want to create object and save in resultArray.

var arr1 = ['01','02','03'];
var arr2 = ['item-1','item-2','item-3'];
resultArray = [];
    for (var j=0; j<arr1.length; j++) {
        resultArray[j] = new makeArray(arr1[j], arr2[j]);
    }
function makeArray(first,second) {
    this.first = first;
    this.second = second;
}

Answer 7

 let nietos = []; function nieto(aData) { let o = {}; for ( let i = 0; i < aData.length; i++ ) { let key = "0" + (i + 1); o[key] = aData[i]; } nietos.push(o); } nieto( ["Band", "Ramones"] ); nieto( ["Style", "RockPunk"] ); nieto( ["", "", "", "Another String"] ); /* convert array of object into string json */ var jsonString = JSON.stringify(nietos); document.write(jsonString);

Add an object into an array

Answer 8

 let nietos = []; function nieto(aData) { let o = {}; for ( let i = 0; i < aData.length; i++ ) { let key = "0" + (i + 1); o[key] = aData[i]; } nietos.push(o); } nieto( ["Band", "Ramones"] ); nieto( ["Style", "RockPunk"] ); nieto( ["", "", "", "Another String"] ); /* convert array of object into string json */ var jsonString = JSON.stringify(nietos); document.write(jsonString);

Answer 9

Save your values in array and convert it using stringify

var nietos = [];
nietos.push({"01": nieto.label, "02": nieto.value});
return nietos;

var jsonString = JSON.stringify(nietos);

Answer 10

With "push()" method:

let nietos = [];
nietos.push({"01": nieto.label, "02": nieto.value});

With "concat()" method:

let nietos = [];
nietos = nietos.concat({"01": nieto.label, "02": nieto.value});

Answer 11

Using destructuring assignment (ES6)

1. Modify the object

let modifiedObj = {'01': obj.label, '02': obj.value};

2. Unpack the objects inside the array (in case the array is empty it will still work)

[...restOfArray] = array; 

3. Push the modified object to the first index like so:

array = [modifiedObj , ...restOfArray];

 const obj = {label: "Title", value: "Ramones" } let restOfArray, array = [ {'03': 'asd', '04': 'asd'}, {'05': 'asd', '06': 'asd'} ]; let modifiedObj = {'01': obj.label, '02': obj.value}; [...restOfArray] = array; array = [modifiedObj , ...restOfArray]; console.log(array);

If you'd like to push it to the last index just change ...restOfArray to the front.

array = [...restOfArray, modifiedObj];

Answer 12

This solution can be used when you have more than 2 properties in any object.

const nieto = {
  label: "Title",
  value: "Ramones" 
}

let nietos = [];

let xyz = Object.entries(nieto)

xyz.forEach((i,j)=>{
    i[0] = `${(j+1).toLocaleString("en-US", {
        minimumIntegerDigits: 2,
        useGrouping: false,
      })}`
})

nietos.push(Object.fromEntries(xyz))

Answer 13

Add an object to an array

class App extends React.Component {
  state = {
  value: ""
  };

items = [
  {
    id: 0,
    title: "first item"
  },
  {
    id: 1,
    title: "second item"
  },
  {
    id: 2,
    title: "third item"
  }
];

handleChange = e => {
  this.setState({
    value: e.target.value
  });
};

handleAddItem = () => {
  if (this.state.value === "") return;
  const item = new Object();
  item.id = this.items.length;
  item.title = this.state.value;
  this.items.push(item);
  this.setState({
    value: ""
  });

  console.log(this.items);
};

render() {
  const items = this.items.map(item => <p>{item.title}</p>);
  return (
    <>
      <label>
        <input
          value={this.state.value}
          type="text"
          onChange={this.handleChange}
        />
        <button onClick={this.handleAddItem}>Add item</button>
      </label>
      <h1>{items}</h1>
    </>
  );
}
}

ReactDOM.render(<App />, document.getElementById("root"));