V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
推荐关注
Meteor
JSLint - a JavaScript code quality tool
jsFiddle
D3.js
WebStorm
推荐书目
JavaScript 权威指南第 5 版
Closure: The Definitive Guide
smithtel
V2EX  ›  JavaScript

js 原生对象如何实现自定义方法?

  •  
  •   smithtel · 2016-11-27 13:42:18 +08:00 · 3306 次点击
    这是一个创建于 2700 天前的主题,其中的信息可能已经有所发展或是发生改变。
    最近写组件的时候发现原生的一些方法不太习惯,自己定义一些函数写起来也不是很方便
    比如
    var array=new Array();
    var json=get(array,y);
    想写成
    var json=array.get(y);
    应该有一种写法是直接实现 Array 的方法,不过写法找了半天也没找到,求解惑。
    15 条回复    2016-11-28 09:34:50 +08:00
    m939594960
        1
    m939594960  
       2016-11-27 14:01:34 +08:00
    ashong
        2
    ashong  
       2016-11-27 14:01:36 +08:00 via iPhone
    prototype

    Array.prototype.get = function(idx){
    }
    feehey
        3
    feehey  
       2016-11-27 14:03:07 +08:00
    ``` javascript
    function Person(name) {
    this.name = name;
    this.age = 12;
    };
    Person.prototype.getName = function () {
    return this.name;
    };
    var per = new Person('zhangsan');
    var oName = per.get();
    console.log(oName);
    ```
    是这种形式么?
    longear
        4
    longear  
       2016-11-27 14:15:30 +08:00
    因为 js 是基于原型链的, 在对象的 prototype 属性上附加声明即可。

    Array.prototype.get= function(val){
    // this[??] = val;
    // ...
    // var json = eval(this);
    // return json;
    }
    haozhang
        5
    haozhang  
       2016-11-27 15:47:04 +08:00 via iPhone
    你可以包装一个类,内部一个 private 的数组容器,提供各种方法
    hronro
        6
    hronro  
       2016-11-27 16:01:49 +08:00
    修改原生对象的这种做法,一般不推荐
    chemzqm
        7
    chemzqm  
       2016-11-27 16:11:16 +08:00
    修改原生对象太容易出问题,自己写个封装类吧

    class MyArray {
    constructor(arr) {
    this.arr = arr
    }
    }
    Phariel
        8
    Phariel  
       2016-11-27 18:39:00 +08:00 via Android
    这种 polyfill 的形式非常非常不推荐
    butterandfly
        9
    butterandfly  
       2016-11-27 18:58:41 +08:00
    - 同楼上,不赞成这种 polyfill 的形式
    - 如果只是封装了两行逻辑的话,你要考虑到时候是写两行方便点还是导入包来解决方便点
    - 先考虑原生是否已经提供方便的方法,或者能否使用如 lodash 之类的库
    billlee
        10
    billlee  
       2016-11-27 21:07:31 +08:00
    这种需求不是应该用继承吗?
    php71
        11
    php71  
       2016-11-27 23:19:09 +08:00
    es6 用 class MyArray extends Array {}
    es5 用 Array.prototype.myMethod = function() {}
    Lonely
        12
    Lonely  
       2016-11-27 23:52:49 +08:00 via iPhone
    搞 js 的不知道原型?
    techmoe
        13
    techmoe  
       2016-11-27 23:53:35 +08:00 via Android
    *不推荐修改原生对象的 prototype ,这不仅可能会造成后期匪夷所思的问题,还会对维护增加负担*
    palmers
        14
    palmers  
       2016-11-28 08:52:23 +08:00
    #2 是对的, 内部实现自定义就可以了, 只要是 Array 实例都可以调用, 然后首行增加实例类型判断就基本没什么问题了
    dilidili
        15
    dilidili  
       2016-11-28 09:34:50 +08:00
    建议你看看 JS 中的原型( prototype )和原型链(__proto__),但是修改原生的方法有的时候会出现问题,建议加一个自定义的,不和原生方法重复的名字。
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   我们的愿景   ·   实用小工具   ·   2834 人在线   最高记录 6543   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 25ms · UTC 11:51 · PVG 19:51 · LAX 04:51 · JFK 07:51
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.