当前位置:首页 > JavaScript

js原生实现split

2026-02-02 22:46:21JavaScript

原生 JavaScript 实现 split 方法

split 是 JavaScript 字符串的原生方法,用于将字符串按指定分隔符拆分为数组。以下是手动实现 split 功能的几种方法:

方法一:基础实现(按字符拆分)

function customSplit(str, delimiter) {
    const result = [];
    let current = '';
    for (let i = 0; i < str.length; i++) {
        if (str[i] === delimiter) {
            result.push(current);
            current = '';
        } else {
            current += str[i];
        }
    }
    result.push(current); // 添加最后一部分
    return result;
}

// 示例
console.log(customSplit('a,b,c', ',')); // 输出: ['a', 'b', 'c']

说明

js原生实现split

  • 遍历字符串,遇到分隔符时将当前累积的子串加入结果数组。
  • 最后需处理剩余的子串。

方法二:支持多字符分隔符

function customSplit(str, delimiter) {
    const result = [];
    let start = 0;
    let index = str.indexOf(delimiter);
    while (index !== -1) {
        result.push(str.slice(start, index));
        start = index + delimiter.length;
        index = str.indexOf(delimiter, start);
    }
    result.push(str.slice(start)); // 添加剩余部分
    return result;
}

// 示例
console.log(customSplit('hello##world##!', '##')); // 输出: ['hello', 'world', '!']

说明

js原生实现split

  • 使用 indexOf 查找分隔符位置,通过 slice 截取子串。
  • 支持多字符分隔符(如 ##)。

方法三:支持正则表达式分隔符

function customSplit(str, delimiter) {
    const result = [];
    let lastIndex = 0;
    const regex = new RegExp(delimiter, 'g');
    let match;
    while ((match = regex.exec(str)) !== null) {
        result.push(str.slice(lastIndex, match.index));
        lastIndex = match.index + match[0].length;
    }
    result.push(str.slice(lastIndex)); // 添加剩余部分
    return result;
}

// 示例
console.log(customSplit('a1b2c', /\d/)); // 输出: ['a', 'b', 'c']

说明

  • 通过正则表达式匹配分隔符,处理动态模式(如数字、空格等)。

方法四:处理空字符串和限制拆分次数

function customSplit(str, delimiter, limit) {
    const result = [];
    let start = 0;
    let index = str.indexOf(delimiter);
    while (index !== -1 && result.length < limit - 1) {
        result.push(str.slice(start, index));
        start = index + delimiter.length;
        index = str.indexOf(delimiter, start);
    }
    result.push(str.slice(start)); // 添加剩余部分
    return result;
}

// 示例
console.log(customSplit('a,b,c,d', ',', 2)); // 输出: ['a', 'b,c,d']

说明

  • 通过 limit 参数控制拆分后的数组长度。
  • 当达到限制时,剩余部分作为最后一个元素。

注意事项

  1. 原生 split 的边界情况
    • 空分隔符:将字符串拆分为单字符数组。
    • 分隔符在开头/结尾:生成空字符串元素。
  2. 性能优化
    • 对于长字符串,避免频繁拼接(如方法一),优先使用 slice(如方法二)。
  3. 正则表达式
    • 复杂分隔符(如多个空格)需通过正则实现,但需注意贪婪匹配问题。

以上方法可根据实际需求组合或扩展,覆盖原生 split 的核心功能。

标签: jssplit
分享给朋友:

相关文章

js如何实现继承

js如何实现继承

原型链继承 通过将子类的原型指向父类的实例实现继承。子类实例能够访问父类原型上的属性和方法。 function Parent() { this.name = 'parent'; } Parent…

js实现拷贝

js实现拷贝

实现文本拷贝 使用 document.execCommand 方法(已废弃但兼容性较好): function copyText(text) { const textarea = document…

js实现瀑布流

js实现瀑布流

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

js节流实现

js节流实现

节流的概念 节流(Throttle)是一种限制函数执行频率的技术,确保函数在一定时间间隔内只执行一次。常用于滚动事件、窗口调整等高频触发的场景。 基础实现方法 使用时间戳判断是否执行函数: fun…

js实现下拉菜单

js实现下拉菜单

使用HTML和CSS创建基础结构 HTML部分需要包含一个触发下拉的按钮和隐藏的下拉菜单内容: <div class="dropdown"> <button class="dr…

js实现上传文件

js实现上传文件

文件上传的基本实现 使用HTML的<input type="file">元素配合JavaScript的File API可以实现文件上传功能。 <input type="file"…