根据偏移值拆分文本并将其推送到新对象答案

【问题标题】：Splitting text based on its offset value and push it to new object根据偏移值拆分文本并将其推送到新对象
【发布时间】：2019-10-08 17:21:14
【问题描述】：

我想根据entityRanges 分解paragraph。

所以实际的段落看起来像这样，

{
    type: 'paragraph',
    depth: 1,
    text: 'Do you have questions or comments and do you wish to contact ABC? Please visit our customer support page.',
    entityRanges: [{
        type: 'LINK',
        offset: 83,
        length: 16,
        data: {
            target: '_self',
            url: '/index.htm'
        }
    }]
}

但我的预期结果应该如下所示，

{
    type: 'paragraph',
    depth: 1,
    text: 'Do you have questions or comments and do you wish to contact ABC? Please visit our customer support page.',
    entityRanges: [{
        type: 'LINK',
        offset: 83,
        length: 16,
        data: {
            target: '_self',
            url: '/index.htm'
        }
    }],
    embbeded: [{
        type: 'text',
        text: 'Do you have questions or comments and do you wish to contact ABC? Please visit our '
    }, {
        type: 'link',
        text: 'customer support',
        data: {
            target: '_self',
            url: '/index.htm'
        }
    }, {
        type: 'text',
        text: 'page.'
    }]
}

我想根据 offset 和 length 的值将 text 分解为多个部分。

根据示例，customer support 是偏移值。

所以它应该按以下顺序分解

您有问题或需要联系 ABC 吗？请访问我们的
客户支持
页面。

以上所有部分都需要推送到新对象embbeded。

【问题讨论】：

标签： javascript arrays typescript lodash

【解决方案1】：

希望我理解正确：

const data = {
  "text": "Do you have questions or comments and do you wish to contact ABC? Please visit our customer support page.",
  "entityRanges": [{
      "type": "LINK",
      "offset": 83,
      "length": 16,
      "data": {
        "target": "_self",
        "url": "/index.htm"
      }
    },
    {
      "type": "LINK",
      "offset": 7,
      "length": 4,
      "data": {
        "target": "_self",
        "url": "/index.htm"
      }
    }
  ]
};

function breakData(data) {
  let {
    entityRanges,
    text
  } = data;
  const result = [];
  let finalPart = '';
  let index = 0;

  entityRanges
    .sort((a, b) => a.offset - b.offset)
    .forEach((styleRange) => {
      const {
        offset,
        length,
        type,
        data
      } = styleRange;
      const firstPart = text.substring(index, offset);

      result.push({
        type: 'text',
        text: firstPart,
      });

      index = offset + length; // + 1;
      const secondPart = text.substring(offset, index);
      result.push({
        type,
        data,
        text: secondPart,
      });

      finalPart = text.substring(index);
    });

  if (finalPart) {
    result.push({
      type: 'text',
      text: finalPart,
    });
  }
  data.embbeded = result;

  return data;
}

const result = breakData(data);

document.body.innerHTML = '<pre>' + JSON.stringify(result, null, ' ') + '</pre>';

【讨论】：