jquery how to add to objects with a for loop?

Question

Hello I made a jquery function which sorts words based on length and it wordks fine. But now I want to store those words in an object so I can use JSON.stringify to make a JSON string. The problem is I only get the last words shown as an json object and not all the words. I think it's becuase I need to add or append every word to the object, but I couldn't find out how and haven't found an answer yet.

this is my function:

function sortWords() {
var count7 = 0;
var count8 = 0;
var count9 = 0;
var count10 = 0;
var count11 = 0;
var count12 = 0;
var obj7 = {};
var obj8 = {};
var obj9 = {};
var obj10 = {};
var obj11 = {};
var obj12 = {};
//Get the text from the div
var str = $("div.someText").text();
//Chance everything exept words into spaces
str = str.replace(/[^a-zA-Z]/g," ");
//Replace all spaces for one space
str = str.replace(/ +/g," ");
//Make all words lowercase
str = str.toLowerCase();
//Make an array
var words = str.split(" ");
//Loop trough the array to show the result
for(var i=0;i<words.length;i++){
    //sort words by length
    switch(words[i].length) {
        case 7: 
            count7++;
            $('td.length7').append("<div>"+count7+": "+words[i]+"</div>");
            obj7["word"] = words[i];
            break;
        case 8: 
            count8++;
            $('td.length8').append("<div>"+count8+": "+words[i]+"</div>");
            obj8["word"] = words[i];
            break;
        case 9: 
            count9++;
            $('td.length9').append("<div>"+count9+": "+words[i]+"</div>");
            obj9["word"] = words[i];
            break;      
        case 10:    
            count10++;
            $('td.length10').append("<div>"+count10+": "+words[i]+"</div>");
            obj10["word"] = words[i];
            break;  
        case 11:
            count11++;
            $('td.length11').append("<div>"+count11+": "+words[i]+"</div>");
            obj11["word"] = words[i];
            break;  
        case 12:    
            count12++;
            $('td.length12').append("<div>"+count12+": "+words[i]+"</div>");
            obj12["word"] = words[i];
            break;                  
    }
}
jsonStr7 = JSON.stringify(obj7);
$("div.result1").text("The JSON String: " + jsonStr7); 
jsonStr8 = JSON.stringify(obj8);
$("div.result2").text("The JSON String: " + jsonStr8);
jsonStr9 = JSON.stringify(obj9);
$("div.result3").text("The JSON String: " + jsonStr9);
jsonStr10 = JSON.stringify(obj10);
$("div.result4").text("The JSON String: " + jsonStr10);
jsonStr11 = JSON.stringify(obj11);
$("div.result5").text("The JSON String: " + jsonStr11);
jsonStr12 = JSON.stringify(obj12);
$("div.result6").text("The JSON String: " + jsonStr12);
};

The HTML:

</head>
<body>
<input onClick="sortWords()" type="button" value="Sorteren op lengte" />
<table border="1" padding="10">
<tr>
    <td>length7</td>
</tr>
<tr>
    <td class="length7"></td>
</tr>
</table>    
<table border="1" padding="10">
<tr>
    <td>length8</td>
</tr>
<tr>
    <td class="length8"></td>
</tr>
</table>    

<table border="1" padding="10">
<tr>
    <td>length9</td>
</tr>
<tr>
    <td class="length9"></td>
</tr>
</table>    

<table border="1" padding="10">
<tr>
    <td>length10</td>
</tr>
<tr>
    <td class="length10"></td>
</tr>
</table>    

<table border="1" padding="10">
<tr>
    <td>length11</td>
</tr>
<tr>
    <td class="length11"></td>
</tr>
</table>    

<table border="1" padding="10">
<tr>
    <td>length12</td>
</tr>
<tr>
    <td class="length12"></td>
</tr>
</table>    

<br />
<div class="array"></div>
<br />
<div class="result1"></div>
<br />
<div class="result2"></div>
<br />
<div class="result3"></div>
<br />
<div class="result4"></div>
<br />
<div class="result5"></div>
<br />
<div class="result6"></div>
<br />
<div class="someText">
a aa aaa aaaa aaaaa aaaaaa aaaaaaa aaaaaaaa aaaaaaaaa aaaaaaaaaa aaaaaaaaaaa aaaaaaaaaaaa
</div>
</body>
</html>

Can you post your HTML too? It's hard to follow without seeing "someText" and table containing td.lengthX — Carol Skelly
– Carol Skelly, Commented Mar 24, 2013 at 11:20
The html is just some divs and tables to show the result. The div someText contains some text. — Zeebats
– Zeebats, Commented Mar 24, 2013 at 11:35
Consider the variables count7, etc. What are they for? Do they do anything more than reflect the loop counter i? Then consider the statements obj7["word"] = words[i]; etc inside the for loop. This one "word" property is set to each word in turn, so when the loop finishes it is set to the last word in words. — Beetroot-Beetroot
– Beetroot-Beetroot, Commented Mar 24, 2013 at 12:13
the count vars are only to set numbers for the words(just for display ) in the tables. Yes "word" is the key and words[i] is the value. I need to make the json string look like: [{"word":"word1"},{"word":"word2"},{"word":"word3"}] etc. but to do that I need to json.stringify an object containing all the words. The result i now get is {"word":"lastword"} — Zeebats
– Zeebats, Commented Mar 24, 2013 at 12:30

Marryat · Accepted Answer · 2013-03-24 15:31:05Z

4

As @Beetroot-Betroot mentioned above, the issue that you are having is that you have an object with a single key in it called word, and each time you replace the value for that key with the latest match. Therefore you will always only save the last word.

To match the structure you have outlined in your comment, you need to use an array of objects.

Therefore you should initialise an array instead of an object: i.e.: var obj7 = [];

Then everytime you match a word length you should add an object to that array. You can do this by using something like: obj7.push({"word":words[i]});

Then when you stringify the array (obj7) you will get the structure you want.

answered Mar 24, 2013 at 15:31

Marryat

5353 silver badges11 bronze badges

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

Collectives™ on Stack Overflow

jquery how to add to objects with a for loop?

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related