CODEWITHSUNDEEP
javascriptjqueryarraysobjectjavascript-objects
adin
adin

Reputation: 833

Can an object name be a number?

I am trying to create an object and have the name of each object be unique. The objects will have a name, a number and a second number that is null (this I intend to calculate later).

Is it possible to have an object named after a variable of 1 then at the end of the function increase the variable so that the next object is 2?

I am being alerted the value of the id number and it comes out as NaN

In my fiddle, I have a button to append each object in the array to a list so I can inspect them. They come out as [ object Object ].

Should this be an object of objects instead of an array of objects if I later want to use the number field in each object to perform calculations?

The format I have my sample object in is what I believe I want to stick with (unless there is a reason to do it better another way) because it follows the example on w3schools.

What am I doing wrong?

Fiddle here.

HTML:

<input type="text" placeholder="Name" id="name"> <input type="text" placeholder="Number" id="number">
    <br>
    <button id="makeObject">Make Object</button>
    <button id="show">Show Me The Objects</button>
        <ul id="list"></ul>

JavaScript:

/*Sample ideal object
 1 = {
    name: John Doe
    number: 52
    newNumber: null
 }
*/

var arrayOfObjects = [];
var id = 1;

$(document).ready(function(){

    $('#makeObject').on('click', function(){
        var number = (parseInt($('#Number').val()));
        var name = $('#Name').val();
        arrayOfObjects.push(id = {
            number: number, 
            name: name,
            newNumber: null
        });
        id++;
        alert("The id is now: " + id);
        $('#Number').val("");
        $('#Name').val("");
    });

    $('#show').on('click', function(){
        $('#list').html("");
        for (i = 0; i < arrayOfObjects.length; i++) {
          $('#list').append("<li>" + arrayOfObjects[i] + "</li>");  
        };
    });
});

Upvotes: 0

Views: 812

Answers (2)

Stefan Dochow
Stefan Dochow

Reputation: 1454

What you are looking for would be an object key, not its name (which cannot start with a number as Quantastical states)

Anyway, your assignment is a little weird. This way shoud be the way you intended it:

arrayOfObjects[id] = {
                number: number, 
                name: name,
                newNumber: null
            };

have a look at http://jsfiddle.net/ej3z9ncd/3/ to confirm it's working

Upvotes: 1

adin
adin

Reputation: 833

Object names are strings.

I realized that the unique name doesn't matter for the object itself, I just went with "student." Instead, I put the name of the student, which is unique, as a field within the object.

Fiddle here.

<input type="text" id="name" placeholder="Name">
<input type="text" id="score" placeholder="Score">
<br>
<br>
<button id="push">Push to Array</button>
<button id="show">Show</button>
<button id="doMath">Do Math</button>
<ul id="list"></ul>
<p id="sum"></p>
<p id="mean"></p>

CSS:

input:hover {
    border: 1px solid black;
}

JavaScript:

var myArray = [];
var sumOfScores;
var mean;
$(document).ready(function () {
    $('#push').on('click', function () {
        var name = $('#name').val();
        var score = parseInt($('#score').val());
        myArray.push((student = {
            name: name,
            score: score,
            newScore: null
        }));
        console.log(student);
        $('#name').val("");
        $('#score').val("");
    });
    $('#show').on('click', function () {
        $('#list').html("");
        for (i = 0; i < myArray.length; i++) {
            $('#list').append("<li>" + myArray[i].name + " received a score of " + myArray[i].score + "</li>");
        };
    });
    $('#doMath').on('click', function(){
        sumOfScores = 0;
        for (i = 0; i < myArray.length; i++) {
            sumOfScores += myArray[i].score;
        };
        $('#sum').html("The sum is: " + sumOfScores);
        mean = (sumOfScores / myArray.length);
        $('#mean').html("The mean score is: " + mean);
    });
});

Upvotes: 0

Related Questions