How to format the element inside an array?

Question

I have three arrays for example:

var name = ["wheel", "rectangle", "moon"];
var type = ["car", "shape", "sky"];
var all = [];
var temp = " ";

for (var i = 0; i < name.length; i++) {
    temp = name[i] + " " + type[i];
    all.push(temp);
}

for (var i = 0; i < name.length; i++) {
    // I call here function to display all element of array `all`
}

The output is:

wheel car
rectangle shape
moon sky

But the format of output is not nice. I want to shift the element of array type before add them to array all, so I want the output to be like:

wheel       car
rectangle shape
moon        sky

My question is: how can I shift elements of the array to add them to another array and store them in a way that allows to me to display the elements like form above ?

What language is this? What does string temp = " "; mean? To answer your question, pad the first part out to some fixed number of spaces before concatenating it to the second. Look at developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/…. — user663031
– user663031, Commented Nov 2, 2016 at 9:16
by shift do you mean you want to add space before the element? — Md Sifatul Islam
– Md Sifatul Islam, Commented Nov 2, 2016 at 9:19

gurvinder372 · Accepted Answer · 2016-11-02 09:16:56Z

2

But the form of output not nice

If you simply want to format the output in a better way, then try console.table

var name1 = [ "wheel","rectangle","moon" ];
var type = [ "car" , "shape", "sky"];
var all=[];
for (var i = 0; i< name1.length; i++)
{
      all.push({ name : name1[i], type: type[i] });
}
console.table(all);

Try this fiddle to see the actual output since stack-snippet alters the behaviour of console api

answered Nov 2, 2016 at 9:16

gurvinder372

68.6k11 gold badges78 silver badges98 bronze badges

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

Comments

Fabrizio Calderan · Accepted Answer · 2016-11-02 09:28:32Z

1

You should calculate which is the longest string in the first array so to know in advance how many spaces you need to append to correctly pad the string

var n = ["wheel", "rectangle", "moon"];
var t = ["car", "shape", "sky"];
var all = [];

/* sorting the values of the first array by length desc,
 * then get the length of the first element 
 */
var padding = n.sort(function(a, b) {
  return a.length <= b.length;
})[0].length + 1; 

n.forEach(function(el, i) {
  all.push(el + " ".repeat(padding - el.length) + t[i]);
});

Output

"rectangle car"
"wheel     shape"
"moon      sky"

codepen demo

edited Nov 2, 2016 at 9:28

answered Nov 2, 2016 at 9:17

Fabrizio Calderan

124k26 gold badges171 silver badges183 bronze badges

1 Comment

user663031 Over a year ago

The sort seems like an awkward way to do Math.max(...n.map(s => s.length)). Also, a sort comparator function is supposed to return +1/-1/0.

Marcus · Accepted Answer · 2016-11-02 09:26:57Z

1

First loop over the array and find the max length. Then loop again and add spaces.

<script >
  var name=["wheel","rectangle","moon"];
  var type=["car","shape","sky"];
  var all=[];
  var i=0;
  var maxLength=0;

  string temp=" ";

  String.prototype.padLeft= function(len, c){
      var r = '';
      while(r.length < len) r += c;
      return s+r;
  }
  for (i = 0; i< name.length; i++)
  {
      maxLength = Math.max(maxLength, name[i].length+type[i].length+1;
  }

  for (i = 0; i< name.length; i++)
  {
      temp=name[i]+type[i].padLeft(maxLength-name[i].length-type[i].length);
      all.push(temp);
  }
 </script >

answered Nov 2, 2016 at 9:26

Marcus

1,9402 gold badges18 silver badges28 bronze badges

Comments

Redu · Accepted Answer · 2016-11-02 09:31:49Z

1

I would do as follows;

var id = ["wheel","rectangle","moon"],
  type = ["car","shape","sky"];
id.longestStringLength = Math.max(...id.map(s => s.length));
type.longestStringLength = Math.max(...type.map(s => s.length));
id = id.map((s,_,a) => s + " ".repeat(a.longestStringLength-s.length));
type = type.map((s,_,a) => " ".repeat(a.longestStringLength-s.length) + s);
console.log(id,type);

answered Nov 2, 2016 at 9:31

Redu

26.3k6 gold badges61 silver badges84 bronze badges

Comments

Kiran Kumar · Accepted Answer · 2016-11-02 09:19:36Z

0

Use \t instead of space while concatenating to make it aligned.

answered Nov 2, 2016 at 9:19

Kiran Kumar

1,0517 silver badges20 bronze badges

Comments

Dinesh Verma · Accepted Answer · 2016-11-07 03:38:07Z

0

Why don't you just add tab '\t' and it will give you the desired output. Or you can append fixed number of spaces between the two array items.

answered Nov 7, 2016 at 3:38

Dinesh Verma

6668 silver badges9 bronze badges

Collectives™ on Stack Overflow

How to format the element inside an array?

6 Answers 6

Comments

1 Comment

Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

6 Answers 6

Comments

1 Comment

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related