当前位置:首页 > JavaScript

js原生实现split

2026-03-15 23:12:50JavaScript

js原生实现split

js原生实现split

原生 JavaScript 实现 split 方法

使用原生 JavaScript 实现 split 方法需要处理字符串分割逻辑,包括分隔符匹配、结果数组构建以及可选的长度限制。以下是两种实现方式:

基础实现(不考虑正则分隔符)

function customSplit(str, separator, limit) {
  const result = [];
  if (separator === undefined) return [str];

  let startIndex = 0;
  for (let i = 0; i < str.length; i++) {
    if (str.substr(i, separator.length) === separator) {
      result.push(str.substring(startIndex, i));
      startIndex = i + separator.length;
      i += separator.length - 1;
    }
  }
  result.push(str.substring(startIndex));

  return limit ? result.slice(0, limit) : result;
}

完整实现(支持正则分隔符)

function customSplit(str, separator, limit) {
  const output = [];
  let lastIndex = 0;

  if (separator === undefined) return [str];
  if (separator === '') return Array.from(str);

  const regex = new RegExp(separator, 'g');
  let match;

  while ((match = regex.exec(str)) !== null) {
    output.push(str.slice(lastIndex, match.index));
    lastIndex = match.index + match[0].length;
    if (limit && output.length >= limit) break;
  }

  output.push(str.slice(lastIndex));
  return limit ? output.slice(0, limit) : output;
}

关键特性说明

  • 空字符串处理:当分隔符为空字符串时,将字符串拆分为单字符数组
  • undefined 处理:未提供分隔符时返回包含原字符串的数组
  • 正则支持:第二个实现版本支持正则表达式作为分隔符
  • limit 参数:限制返回数组的最大长度

使用示例

console.log(customSplit('a-b-c', '-')); // ['a', 'b', 'c']
console.log(customSplit('a-b-c', '-', 2)); // ['a', 'b']
console.log(customSplit('abc', '')); // ['a', 'b', 'c']
console.log(customSplit('a,b,c', /[,]/)); // ['a', 'b', 'c']

这两个实现分别展示了基础版本和完整版本的原生 split 方法实现,可根据实际需求选择使用。

标签: jssplit
分享给朋友:

相关文章

js实现轮播

js实现轮播

实现轮播图的基本思路 轮播图的核心逻辑是通过定时切换展示的图片或内容,通常结合左右滑动按钮和指示器(小圆点)增强交互性。以下是基于原生JavaScript的实现方法。 HTML结构 构建轮播图的HT…

js分组实现

js分组实现

分组实现方法 在JavaScript中,可以通过多种方式实现数组或对象的分组操作。以下是几种常见的方法: 使用Array.prototype.reduce() 通过reduce方法可以轻松实现数组分…

js实现报表

js实现报表

使用JavaScript实现报表 在JavaScript中实现报表功能可以通过多种方式完成,常见的方法包括使用原生JavaScript、第三方库(如Chart.js、D3.js)或结合后端数据渲染。以…

js实现瀑布流

js实现瀑布流

实现瀑布流布局 瀑布流布局是一种常见的网页布局方式,常用于图片展示、商品列表等场景。以下是使用 JavaScript 实现瀑布流布局的几种方法。 纯 JavaScript 实现 通过计算元素的位置和…

js实现tab选项卡切换

js实现tab选项卡切换

实现Tab选项卡切换的JavaScript方法 使用纯JavaScript实现Tab切换功能,可以通过监听点击事件动态切换内容显示状态。以下是两种常见实现方式: 基础DOM操作实现 // 获取所有…

js实现祖玛

js实现祖玛

实现祖玛游戏的核心思路 祖玛游戏的核心玩法是发射彩色珠子,形成三个或以上相同颜色的珠子即可消除。以下是使用JavaScript实现的基本框架。 游戏初始化 创建画布并初始化游戏状态: const…