简体   繁体   中英

How do you print out [{ and }] in JavaScript console.log() without the [“{ and the }”] in web page?

I have trouble turning the input:

["apple", "banana", "carrot", "durian", "eggplant", "apple", "carrot"] 

into the right output:

[{ name: "Apple", count: 2 }, { name: "Banana", count: 1 }, { name: "Carrot", count: 2 }, { name: "Durian", count: 1 }, { name: "Eggplant", count: 1 }]

where I have trouble with the wrong output:

["{ name: "Apple", count: 2 }, { name: "Banana", count: 1 }, { name: "Carrot", count: 2 }, { name: "Durian", count: 1 }, { name: "Eggplant", count: 1 }"]. 

How can I have the right output:

[{ name: "Apple", count: 2 }, { name: "Banana", count: 1 }, { name: "Carrot", count: 2 }, { name: "Durian", count: 1 }, { name: "Eggplant", count: 1 }] 

with the use of console.log() method?

<html>
<body>

    <h1>Number of fruits 4</h1>
      
      <div id="output"></div>

     <script>
        
    var input = ["apple", "banana", "carrot", "durian", "eggplant", "apple", "carrot"];
        
        var A = 0;//to count the number of apples
        var B = 0;//to count the number of bananas
        var C = 0;//to count the number of carrots
        var D = 0;//to count the number of durians
        var E = 0; //to count the number of eggplants
   
         for (var i = 0; i < input.length; i++)
          {
             if (input[i] == "apple")
             {   
               A += 1;  
              }
             if (input[i] == "banana")
             {   
               B += 1;  
              }
             if (input[i] == "carrot")
             {   
               C += 1;  
              }
             if (input[i] == "durian")
             {   
               D += 1;  
             }
             if (input[i] == "eggplant")
             {   
               E += 1;  
             }
           }            
        
       var apple1 = '&quot;Apple&quot;';
       var banana1 = '&quot;Banana&quot;';
       var carrot1 = '&quot;Carrot&quot;';
       var durian1 = '&quot;Durian&quot;';
       var eggplant1 = '&quot;Eggplant&quot;';
 
       var x1 = '{ name: ' + apple1 + ', count: ' + A + ' }';
       var x2 = ', { name: ' + banana1 + ', count: ' + B + ' }';
       var x3 = ', { name: ' + carrot1 + ', count: ' + C + ' }';
       var x4 = ', { name: ' + durian1 + ', count: ' + D + ' }';
       var x5 = ', { name: ' + eggplant1 + ', count: ' + E + ' }'; 
      
         var res1 = x1.split();  
         var res2 = x2.split();  
         var res3 = x3.split();  
         var res4 = x4.split();  
         var res5 = x5.split();    

         var output = [ res1 + res2 + res3 + res4 + res5 ];        
       
        console.log("output = ", output);
        document.getElementById('output').innerHTML = JSON.stringify(output);

   </script>

   </body>
   </html>

You should use object entity like:

let x1 = {
name: 'Apple',
count: A
};

and array method push (it adds provided element to the end of array):

output.push(x1);

console.log(output); will show you your array. But to display it on the page, you should use JSON.stringify() as you do.

The code, you provided is really bad. I'd better read more JS documentation :)

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM