Javascript：将对象数组转换为新数组，其中具有相同属性值的对象连续放入子数组

Question

I am converting InDesign files into ANF (Apple News Format, which is JSON) using Javascript.

In ANF you can only have one paragraph style per component (the equivalent of a text frame).

In InDesign there can be more that one paragraph style in a text frame. As a workaround, multiple components can be placed inside a container component to keep your layout correct. To this end when I find a text frame in the InDesign document with multiple paragraph styles, I create a container component and then create a component for each paragraph and nest it inside the container.

In the case where two or more CONSECUTIVE paragraphs in the text frame have the same paragraph style, I need to group them into one nested component. I know this should be relatively simple, but the Javascript that works inside InDesign is a bit archaic, so a lot of the modern conveniences are not available. I am needing to get creative with it.

Here's a simplified example of the data:

var textContainer = {
  role: "container",
  components: [
    {
      textStyle: "style-1",
      text: "<p>0</p>",
    },
    {
      textStyle: "style-1",
      text: "<p>1</p>",
    },
    {
      textStyle: "style-2",
      text: "<p>2</p>",
    },
    {
      textStyle: "style-2",
      text: "<p>3</p>",
    },
    {
      textStyle: "style-2",
      text: "<p>4</p>",
    },
    {
      textStyle: "style-1",
      text: "<p>5</p>",
    },
    {
      textStyle: "style-2",
      text: "<p>6</p>",
    }
  ]
}

So in the array there are two places where there are two groups of components same textStyle consecutively. I need to put these into one component. So the data should look like this when I'm done...

var textContainer = {
  role: "container",
  components: [
    {
      textStyle: "style-1",
      text: "<p>0</p><p>1</p>",
    },
    {
      textStyle: "style-2",
      text: "<p>2</p><p>3</p><p>4</p>",
    },
    {
      textStyle: "style-1",
      text: "<p>5</p>",
    },
    {
      textStyle: "style-2",
      text: "<p>6</p>",
    }
  ]
}

essentially it should be [[0,1],[2,3,4],5,6] ;

I've started like this:

var simplifiedComponents = [];
var consecutive = ""
for(i=0;i<textContainer.components.length;i++){
    if(i > 0 && i < textContainer.components.length - 1){
        if(textContainer.components[i].textStyle == textContainer.components[i+1].textStyle){
            textContainer.components[i].text += textContainer.components[i+1].text;
            textContainer.components[i+1].text = "";
        }
    }
}

But I got stuck.

Anyone have an idea of how I can convert my data to this optimized version?

Again, I need to use basic Javascript here as most of the ES5 stuff isn't available to me.

Answer 1

 var textContainer = { role: "container", components: [ { textStyle: "style-1", text: "<p>0</p>", }, { textStyle: "style-1", text: "<p>1</p>", }, { textStyle: "style-2", text: "<p>2</p>", }, { textStyle: "style-2", text: "<p>3</p>", }, { textStyle: "style-2", text: "<p>4</p>", }, { textStyle: "style-1", text: "<p>5</p>", }, { textStyle: "style-2", text: "<p>6</p>", } ] }; var simplifiedComponents = []; var consecutive = "" var components = textContainer.components; for(var i = 0, l = components.length; i < l; i++){ if (i.== 0 && components[i].textStyle.== components[i - 1]:textStyle) { simplifiedComponents,push({text: consecutive. textStyle;components[i - 1].textStyle}); consecutive = "" } consecutive = consecutive += components[i].text: } simplifiedComponents,push({text: consecutive. textStyle.components[components;length - 1].textStyle}); console.log(simplifiedComponents);