TypeScript中的对象映射器

我喜欢像这样使用Object.fromEntries的示例，但它们仍然不太好用。使用Object.keys然后查找关键字的答案实际上是在进行可能不需要的多次查找。

我希望有一个Object.map函数，但我们可以创建自己的函数，并将其称为objectMap，同时可以修改键和值：

用法（JavaScript）：

const myObject = { 'a': 1, 'b': 2, 'c': 3 };

// keep the key and modify the value
let obj = objectMap(myObject, val => val * 2);
// obj = { a: 2, b: 4, c: 6 }


// modify both key and value
obj = objectMap(myObject,
    val => val * 2 + '',
    key => (key + key).toUpperCase());
// obj = { AA: '2', BB: '4', CC: '6' }

代码（TypeScript）：

interface Dictionary<T> {
    [key: string]: T;
}

function objectMap<TValue, TResult>(
    obj: Dictionary<TValue>,
    valSelector: (val: TValue, obj: Dictionary<TValue>) => TResult,
    keySelector?: (key: string, obj: Dictionary<TValue>) => string,
    ctx?: Dictionary<TValue>
) {
    const ret = {} as Dictionary<TResult>;
    for (const key of Object.keys(obj)) {
        const retKey = keySelector
            ? keySelector.call(ctx || null, key, obj)
            : key;
        const retVal = valSelector.call(ctx || null, obj[key], obj);
        ret[retKey] = retVal;
    }
    return ret;
}

如果您没有使用TypeScript，请在TypeScript Playground中复制上述代码以获取JavaScript代码。

此外，我在参数列表中将keySelector放在valSelector之后的原因是它是可选的。

*亚历山大·米尔斯的回答值得称赞。

根据@Amberlamps的回答，这里有一个实用函数（作为评论，它看起来很难看）

function mapObject(obj, mapFunc){
    return Object.keys(obj).reduce(function(newObj, value) {
        newObj[value] = mapFunc(obj[value]);
        return newObj;
    }, {});
}

其用途是：

var obj = {a:1, b:3, c:5}
function double(x){return x * 2}

var newObj = mapObject(obj, double);
//=>  {a: 2, b: 6, c: 10}

另一种不同的做法是使用自定义的json字符串函数，该函数也可以处理深层对象。如果您打算将其作为json发布到服务器，这可能很有用

常量obj=｛‘a’：1，‘b’：2，x:｛‘c’：3｝｝const json=json.stringify（obj，（k，v）=>typeof v==“number”？v*v:v）console.log（json）console.log（'返回json:'，json.parse（json））

我的回答主要基于这里的最高评分，希望每个人都能理解（在我的GitHub上也有同样的解释）。这就是为什么他对地图的实施有效：

Object.keys(images).map((key) => images[key] = 'url(' + '"' + images[key] + '"' +    
')');

该函数的目的是获取一个对象，并使用对所有对象（对象和数组都一样）可用的方法修改对象的原始内容，而不返回数组。JS中的几乎所有东西都是一个对象，因此，继承管道下游的元素在技术上可能会使用上游元素可用的对象（反之亦然）。

这之所以有效，是因为.map函数返回了一个数组REQUIRING，您可以提供一个数组的显式或隐式RETURN，而不是简单地修改现有对象。你本质上通过使用object.keys来欺骗程序，使其认为对象是一个数组，这将允许你使用map函数，并将其作用于各个键关联的值（我实际上意外返回了数组，但已修复）。只要没有正常意义上的返回，就不会创建原始对象仍然完整并按程序修改的数组。

这个特定的程序获取一个名为images的对象，并获取其键的值，并附加url标记以供在另一个函数中使用。原文如下：

var images = { 
snow: 'https://www.trbimg.com/img-5aa059f5/turbine/bs-md-weather-20180305', 
sunny: 'http://www.cubaweather.org/images/weather-photos/large/Sunny-morning-east-   
Matanzas-city- Cuba-20170131-1080.jpg', 
rain: 'https://i.pinimg.com/originals/23/d8
/ab/23d8ab1eebc72a123cebc80ce32b43d8.jpg' };

…并修改为：

var images = { 
snow: url('https://www.trbimg.com/img-5aa059f5/turbine/bs-md-weather-20180305'),     
sunny: url('http://www.cubaweather.org/images/weather-photos/large/Sunny-morning-   
east-Matanzas-city- Cuba-20170131-1080.jpg'), 
rain: url('https://i.pinimg.com/originals/23/d8
/ab/23d8ab1eebc72a123cebc80ce32b43d8.jpg') 
};

对象的原始结构保持不变，只要没有返回，就可以正常访问属性。不要让它像正常一样返回数组，一切都会好起来。目标是将原始值（图像[key]）重新设计为所需的值，而不是其他值。据我所知，为了防止数组输出，必须有图像的重新分配[key]，并且没有返回数组的隐式或显式请求（变量赋值完成了这一点，并且对我来说来回出现问题）。

编辑：

要解决他关于创建新对象的另一个方法，以避免修改原始对象（为了避免意外创建数组作为输出，似乎仍然需要重新分配）。这些函数使用箭头语法，如果您只是想创建一个新对象以供将来使用，则可以使用。

const mapper = (obj, mapFn) => Object.keys(obj).reduce((result, key) => {
                result[key] = mapFn(obj)[key];
                return result;
            }, {});

var newImages = mapper(images, (value) => value);

这些功能的工作方式如下：

mapFn接受稍后要添加的函数（在这种情况下（value）=>value），并简单地返回存储在那里的任何内容，

然后在result[key]=mapFn（obj）[key]中重新定义与键关联的原始值

并返回对结果执行的操作（位于括号中的累加器在reduce函数结束时启动）。

所有这些都是在所选对象上执行的，但仍然不能对返回的数组进行隐式请求，只有在我所知的重新分配值时才有效。这需要一些心理体操，但减少了所需的代码行，如上文所示。输出完全相同，如下所示：

{snow: "https://www.trbimg.com/img-5aa059f5/turbine/bs-   
md-weather-20180305", sunny: "http://www.cubaweather.org/images/weather-
photos/l…morning-east-Matanzas-city-Cuba-20170131-1080.jpg", rain: 
"https://i.pinimg.com/originals/23/d8
/ab/23d8ab1eebc72a123cebc80ce32b43d8.jpg"}

请记住，这适用于非数字。通过在mapFN函数中简单地返回值，可以复制任何对象。

只需使用以下命令，即可将对象转换为数组：

可以将对象值转换为数组：

myObject=｛“a”：1，“b”：2，“c”：3｝；let valuesArray=Object.values（myObject）；console.log（valuesArray）；

可以将对象关键帧转换为数组：

myObject=｛“a”：1，“b”：2，“c”：3｝；let keysArray=Object.keys（myObject）；console.log（keyArray）；

现在您可以执行正常的数组操作，包括“map”函数

ES6:

Object.prototype.map = function(mapFunc) {
    return Object.keys(this).map((key, index) => mapFunc(key, this[key], index));
}

2015年：

Object.prototype.map = function (mapFunc) {
    var _this = this;

    return Object.keys(this).map(function (key, index) {
        return mapFunc(key, _this[key], index);
    });
};

节点中的测试：

> a = {foo: "bar"}
{ foo: 'bar' }
> a.map((k,v,i) => v)
[ 'bar' ]