Array like object converted to array

Question

I am trying with JavaScript to do what I have done with jQuery for error handling for an API response.

I wrote this piece of code in jQuery that does what I want it to (different project):

var response = e.responseJSON;
$.each(response.errors, function(index, value){
  var div = $("#error_" + index);
  div.html(value[0]).addClass('error');
});

Then I tried to convert the code to JavaScript instead of jQuery, but I seem to be having issues with the object like array conversion to an array. For an e.forEach loop.

The code I currently have is this:

.catch(function(response){
  let e = Object.values(response.response.data)
  let data = Array.from(e[1])
  console.log(e)
  console.log(data)
});

When I log data it returns an empty array. While logging e returns the object like array.

I guess what I am looking for is, what am I doing wrong and is there a better way of going about what I am trying to achieve?

Not answer, just learning myself - why is it important that it's javascript instead of jquery? — Kwahn
– Kwahn, Commented Sep 19, 2017 at 19:35
The second code seems to do different things than the jQuery code. The first code block iterates over reponse.errors, while the second gets the first element of response.response.data, and then converts that value to an array. Completely different, unrelated things. — trincot
– trincot, Commented Sep 19, 2017 at 19:37
Just don't really want to add the dependency to the project. Plus I want to learn how to do it without, I feel too reliant on jQuery and want to move towards learning plain JavaScript — kennyL
– kennyL, Commented Sep 19, 2017 at 19:38
This is a good idea to shy away from jQuery if you intend on learning ReactJS as they are not the most compatible. — fungusanthrax
– fungusanthrax, Commented Sep 19, 2017 at 19:39

Barmar · Accepted Answer · 2017-09-19 20:44:12Z

1

e[1] is a non-array-like object, so Array.from(e[1]) doesn't really make sense. I think what you want is:

let e = Object.values(response.response.data);
for (var index in e[1]) {
    var div = document.getElementById('error_' + index);
    div.innerHTML = e[1][index][0];
    div.classList.add("error");
}

edited Sep 19, 2017 at 20:44

answered Sep 19, 2017 at 19:57

Barmar

789k57 gold badges554 silver badges669 bronze badges

Sign up to request clarification or add additional context in comments.

8 Comments

Frederik.L Over a year ago

I'd add if (e[1].hasOwnProperty(index)) before considering index

Barmar Over a year ago

@Frederik.L That's not really needed for objects created from JSON, there are never any inherited, enumerable properties.

kennyL Over a year ago

Sorry wasn't looking at StackOverflow for a few. It would seem that that code produces an index is not defined error. Thank you for your help, still trying to get a grasp on JavaScript.

Barmar Over a year ago

@kennyL index can't be undefined, it's being assigned by the for loop.

Barmar Over a year ago

Which line is line 11922? Also, I forgot the var declaration in my original post, and fixed that a few minutes ago, but it shouldn't affect this.

|

abc123 · Accepted Answer · 2017-09-20 05:18:40Z

0

Answer

var response = {"error1": "my error", "error2": "another error"}

example(response)

function example(response) {
  Object.keys(response).map(function(key) {
    console.log(key)
    console.log(response[key])
  })
}

answered Sep 20, 2017 at 5:18

abc123

19k7 gold badges55 silver badges84 bronze badges

Collectives™ on Stack Overflow

Array like object converted to array

2 Answers 2

8 Comments

Answer

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

8 Comments

Answer

Comments

Your Answer

Sign up or log in

Post as a guest

Related