Question

我想为不可变的js添加一个非常简单的方法来简化调试...

export const Data =
{
    "elements": [
        {
            "name": "stringVal",
            "facets": [
                {
                    "name": "Cameras",
                    "link": {
                        "type": "Link",
                        "uri": 
                    },
                    "hits": {
                        "type": "Link",
                        "uri": 
                    },
                    "selected": true
                },
                {
                    "name": "Cameras2",
                    "link": {
                        "type": "Link2",
                        "uri": 
                    },
                    "hits": {
                        "type": "Link2",
                        "uri": 
                    },
                    "selected": false
                },

            ],
            "displayType": "text_clear",
            "selectionType": "taxonomic",

        },
        {
            "name": "Brand",
            "facets": [
                {
                    "name": "Canon",
                    "link": {
                        "type": "Link",
                        "uri": 
                    },
                    "hits": {
                        "type": "Link",
                        "uri": 
                    },
                    "selected": false
                },
                {
                    "name": "Canon",
                    "link": {
                        "type": "Link",
                        "uri": 
                    },
                    "hits": {
                        "type": "Link",
                        "uri": 
                    },
                    "selected": false
                },
            ],
            "displayType": "text_clear",
            "selectionType": "single",

        },
    ],
    "type": "stringValue",
    "name": "filters"
}

基本上我可以用它来调试链式表达式，如：

log(msg) {
  console.log(msg, this.toJS());
  return this;
}

这样的事情已经存在吗？如果没有，我如何将其添加到someImmutableMap .toList() .slice(index, index + ITEMS_PER_PAGE) .filter(index => !!index) .log('Filter: ') .map(griddleMapper) .toJS()类以便我可以提出拉取请求？

我已尝试将其添加到Map类定义中的src/Map.js并为其添加简单测试，但测试失败并显示Map

我怀疑那是因为我需要在Property 'log' does not exist on type 'Map<string, number>'.中定义类型，但我从未使用过打字稿/流程等，所以我完全迷失了。

Here是我在上面做出的基本修改的分叉回购..

任何帮助表示感谢。

Answer 1

你可以扩展Collection的原型（基本类型），如下所示：

Immutable.Collection.prototype.log = function(msg){
    console.log(msg, this.toJS());
    return this;
};

或在es6课程风格中，只需将log()方法移到here上即可。但正如上面提到的loganfsmyth，它通常不赞成，因为它经常导致混淆和兼容性问题。

另一种选择就是做一个帮手fn，如：

function logImmutable(msg, obj){
    console.log(msg, obj.toJS());
    return obj;
}

然后你将它称为：

logImmutable('Filter', someImmutableMap
    .toList()
    .slice(index, index + ITEMS_PER_PAGE)
    .filter(index => !!index)) // note the extra paren :-P
    .map(griddleMapper)
    .toJS();

虽然我同意开发人员ux和整体可读性受到影响。

另一种选择是使用类似https://github.com/mattzeunert/immutable-object-formatter-extension的东西来扩展基本console.log()行为，以便它可以更好地处理immutable.js对象。

如何向immutable-js Map添加方法

1 个答案: