当前位置:首页 > JavaScript

js实现重写

2026-01-31 22:01:14JavaScript

实现方法一:使用 Function.prototype 重写方法

通过修改原型链上的方法实现重写。例如重写 Array.prototype.map

const originalMap = Array.prototype.map;
Array.prototype.map = function(callback) {
    console.log('重写后的 map 方法');
    return originalMap.call(this, callback);
};
const arr = [1, 2, 3];
arr.map(x => x * 2); // 输出:重写后的 map 方法

实现方法二:使用 Object.defineProperty 重写属性

通过属性描述符控制可写性,适合重写对象属性或方法:

const obj = { value: 10 };
Object.defineProperty(obj, 'value', {
    get() { return this._value * 2; },
    set(newValue) { this._value = newValue; }
});
obj.value = 5;
console.log(obj.value); // 输出:10(getter 返回值的两倍)

实现方法三:代理模式(Proxy)

利用 Proxy 拦截对象操作,实现更灵活的重写:

const target = { name: 'Alice' };
const proxy = new Proxy(target, {
    get(target, prop) {
        if (prop === 'name') return `Proxy: ${target[prop]}`;
        return target[prop];
    }
});
console.log(proxy.name); // 输出:Proxy: Alice

实现方法四:继承与覆盖

通过类继承重写父类方法:

js实现重写

class Parent {
    greet() { return 'Hello'; }
}
class Child extends Parent {
    greet() { return `${super.greet()} World!`; }
}
const child = new Child();
console.log(child.greet()); // 输出:Hello World!

注意事项

  • 原型链重写可能影响全局,需谨慎操作。
  • Proxy 兼容性需检查(IE 不支持)。
  • 使用 Object.defineProperty 时需注意 configurablewritable 配置。

标签: 重写js
分享给朋友:

相关文章

jquery.js

jquery.js

jQuery 简介 jQuery 是一个快速、简洁的 JavaScript 库,用于简化 HTML 文档遍历、事件处理、动画设计和 Ajax 交互。它的设计宗旨是“Write Less, Do Mor…

js 实现继承

js 实现继承

原型链继承 通过让子类的原型对象指向父类的实例来实现继承。子类实例可以访问父类原型上的属性和方法。 function Parent() { this.name = 'parent'; } Par…

js实现驼峰

js实现驼峰

实现驼峰命名的几种方法 使用正则表达式和字符串替换 通过正则表达式匹配字符串中的特定模式(如下划线或短横线),并将其后的字母转换为大写,同时移除分隔符。 function toCamelCase(s…

js钟表实现

js钟表实现

实现JavaScript钟表的基本方法 创建一个简单的JavaScript钟表可以通过以下步骤完成,涵盖数字和模拟两种形式。 数字钟表实现 HTML结构只需一个显示时间的容器: <div i…

js 实现跳转

js 实现跳转

使用 window.location.href 进行跳转 通过修改 window.location.href 可以跳转到指定 URL,浏览器会加载新页面: window.location.hre…

js实现滑动

js实现滑动

实现滑动效果的方法 在JavaScript中实现滑动效果可以通过多种方式完成,以下是几种常见的实现方法: 使用CSS过渡和JavaScript触发 通过CSS定义过渡效果,JavaScript控制触…