javascript - 我如何 `.filter()` 一个数组/对象并返回一个带有原始键的新数组而不是作为过滤器返回的索引数组/对象?

标签 javascript ecmascript-6 functional-programming

var obj = {
    
    111: {
        user_id: 111,
        user_name: "user111",
        isActive: 0
    }, 
    112: {
        user_id: 112,
        user_name: "use112",
        isActive: 1
    }, 
    113: {
        user_id: 113,
        user_name: "use113",
        isActive: 0
    }, 
    ... 
}

我想过滤所有 ("isActive"=== 0) 但在返回 newObj 时保持键设置相同(等于用户 ID):

newObj = {
    
    111: {
        user_id: 111,
        user_name: "user111",
        isActive: 0
    }, 
    113: {
        user_id: 113,
        user_name: "use113",
        isActive: 0
    }, 
    ... 
}

这是我现在拥有的:

let newObj = Object.values(obj).filter( user => ( (obj.isActive === 0)));

返回索引键

  • 没有 for 循环(除非 ES6 .forEach() 是必须的)。
  • 在这种情况下,如果可能的话,我希望使用 filter/map/reduce 的 ES6 方法来解决这个问题。
  • loadash 方法还可以,但我还是想先看一个“vanilla ES6”的例子
  • 如果我能知道如何/在哪里最好地学习和练习使用这些方法以各种方式过滤数组(loadash 在这里也很酷)。

最佳答案

真正的 FP 方法是减少重复的对象传播:

const filtered = Object.values(obj).reduce((p, e) => (!e.isActive ? {...p, [e.user_id]: e} : p), {});

const obj = {
    111: {
        user_id: 111,
        user_name: "user111",
        isActive: 0
    }, 
    112: {
        user_id: 112,
        user_name: "use112",
        isActive: 1
    }, 
    113: {
        user_id: 113,
        user_name: "use113",
        isActive: 0
    }
};
const filtered = Object.values(obj).reduce((p, e) => (!e.isActive ? {...p, [e.user_id]: e} : p), {});
console.log(filtered);
.as-console-wrapper {
  max-height: 100% !important;
}

这会创建许多不必要的临时对象,但通过不修改对象来遵守 FP 原则(我认为,我对 FP 并不“深入”:-))。

稍微改变一下规则,我们可能会修改单个对象而不是创建大量临时对象:

const filtered = Object.values(obj).reduce((newObj, e) => {
  if (!e.isActive) {
    newObj[e.user_id] = e;
  }
  return newObj;
}, {});

const obj = {
    111: {
        user_id: 111,
        user_name: "user111",
        isActive: 0
    }, 
    112: {
        user_id: 112,
        user_name: "use112",
        isActive: 1
    }, 
    113: {
        user_id: 113,
        user_name: "use113",
        isActive: 0
    }
};
const filtered = Object.values(obj).reduce((newObj, e) => {
  if (!e.isActive) {
    newObj[e.user_id] = e;
  }
  return newObj;
}, {});
console.log(filtered);
.as-console-wrapper {
  max-height: 100% !important;
}

(可以通过滥用逗号运算符以更少的字符编写,但它的可维护性和可读性较差。)

没有 FP 限制,我只使用循环:

const filtered = {};
for (const e of Object.values(obj)) {
  if (!e.isActive) {
    filtered[e.user_id] = e;
  }
}

const obj = {
    111: {
        user_id: 111,
        user_name: "user111",
        isActive: 0
    }, 
    112: {
        user_id: 112,
        user_name: "use112",
        isActive: 1
    }, 
    113: {
        user_id: 113,
        user_name: "use113",
        isActive: 0
    }
};
const filtered = {};
for (const e of Object.values(obj)) {
  if (!e.isActive) {
    filtered[e.user_id] = e;
  }
}
console.log(filtered);
.as-console-wrapper {
  max-height: 100% !important;
}

关于javascript - 我如何 `.filter()` 一个数组/对象并返回一个带有原始键的新数组而不是作为过滤器返回的索引数组/对象?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/55607837/

相关文章:

javascript - React 静态网站将除主页之外的每个页面都重定向到 404

javascript - 列表元素值在访问属性时返回错误值

javascript - 如何使用 IO monad 正确创建 DOM 元素?

c# - C#中的IF实现

javascript - 从 asp.net 启用 javascript 函数

javascript - Jquery Datatables 不按显示长度过滤行

javascript - 为相同的属性添加对象和数组

javascript - React 如何在组件 View 中打印 PDF 文件

functional-programming - 对GPU的纯函数式编程

ios - 在哪里可以找到 UIATarget 类的所有方法?