当前位置:首页 > JavaScript

js trim 实现

2026-03-14 16:02:51JavaScript

实现 JavaScript 的字符串 trim 方法

JavaScript 的原生 trim() 方法用于移除字符串两端的空白字符(包括空格、制表符、换行符等)。以下是几种实现方式:

js trim 实现

使用原生方法(最简单)

const str = "   Hello World!   ";
const trimmedStr = str.trim();
console.log(trimmedStr); // "Hello World!"

自定义实现(正则表达式)

function customTrim(str) {
    return str.replace(/^\s+|\s+$/g, '');
}
const str = "   Hello World!   ";
console.log(customTrim(str)); // "Hello World!"

自定义实现(非正则)

function customTrim(str) {
    let start = 0;
    let end = str.length - 1;

    while (start <= end && str[start] === ' ') start++;
    while (end >= start && str[end] === ' ') end--;

    return str.substring(start, end + 1);
}
const str = "   Hello World!   ";
console.log(customTrim(str)); // "Hello World!"

扩展实现(trimStart 和 trimEnd)

// trimStart 实现
function trimStart(str) {
    return str.replace(/^\s+/g, '');
}

// trimEnd 实现
function trimEnd(str) {
    return str.replace(/\s+$/g, '');
}

const str = "   Hello World!   ";
console.log(trimStart(str)); // "Hello World!   "
console.log(trimEnd(str)); // "   Hello World!"

注意事项

  • 原生 trim() 方法在 IE9 及以上版本支持,如需兼容旧版浏览器需使用自定义实现。
  • 正则表达式实现简洁但性能略低于非正则实现,适用于大多数场景。
  • 自定义非正则实现适合对性能要求较高的场景。

标签: jstrim
分享给朋友:

相关文章

js实现拷贝

js实现拷贝

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

js实现vr

js实现vr

使用WebXR API实现VR体验 WebXR是浏览器中实现VR和AR体验的标准API,它取代了早期的WebVR。现代浏览器如Chrome、Edge和Firefox已支持WebXR。 // 初始化W…

js实现vue路由

js实现vue路由

Vue 路由的基本实现 在 Vue.js 中实现路由功能通常使用 Vue Router 库。Vue Router 是 Vue.js 官方的路由管理器,用于构建单页面应用(SPA)。 安装 Vue R…

js实现吸色

js实现吸色

使用Canvas实现吸色功能 通过Canvas的getImageData方法获取像素颜色数据。创建一个Canvas元素,将目标图像绘制到Canvas上,通过鼠标事件获取坐标对应的颜色值。 const…

js实现图片

js实现图片

图片加载与显示 在JavaScript中,可以通过Image对象动态加载图片。创建实例后设置src属性触发加载,通过onload回调处理加载完成后的操作: const img = new Ima…

js计算器的实现

js计算器的实现

实现基础结构 HTML部分需要创建计算器的基本框架,包含显示区域和按钮。使用<div>容器包裹整个计算器,内部设置一个显示屏和多个按钮。 <div class="calculato…