将箭头样式函数转换为“函数”样式

时间:2018-03-02 17:56:00

标签: javascript angularjs ecmascript-6 lodash arrow-functions

我有这样的功能:

const jsonObject = {a: {b: 'c'}};
const x = 'a.b';
const properties = x.split('.');

const item = properties.reduce((obj, prop) => obj && obj[prop], jsonObject);

console.log(item); // prints 'c;

此函数动态遍历jsonObject并打印值。

这很好用,但这种声明方式不支持我的环境。所以我想尝试将其转换为函数样式声明:

const item = properties.reduce(function(obj, prop){
   if(obj && obj[prop]) return obj[prop];
});

但这似乎不起作用。它的打印(项目)未定义。

6 个答案:

答案 0 :(得分:3)

const item = properties.reduce((obj, prop) => obj && obj[prop], jsonObject);

类似于

const item = properties.reduce(function(obj, prop){
   return obj && obj[prop];
}, jsonObject);

详细了解.reduce及其参数here

答案 1 :(得分:1)

是的,正确的翻译是:

function(obj, prop) {
    return obj && obj[prop];
}

答案 2 :(得分:1)

在您的代码中:

const item = properties.reduce(function(obj, prop){
  if(obj && obj[prop]) return obj[prop];
});

您永远不会将jsonObject作为第二个参数传递给函数,因此.reduce不知道要枚举的内容。正确的做法是:

const item = properties.reduce(function(obj, prop){
  if(obj && obj[prop]) return obj[prop];
}, jsonObject);

答案 3 :(得分:1)

  

工作代码段



const jsonObject = {
  a: {
    b: 'c'
  }
};
const x = 'a.b';
const properties = x.split('.');

const item = properties.reduce(function(obj, prop) {
  return obj && obj[prop];
}, jsonObject);

console.log(item); // prints 'c;




  

解释

  1. Fat arrow(=>)返回默认情况下写在右侧的任何内容(即没有块作为正文)
  2. 在移植到函数表达式或声明时,我们需要显式使用return关键字。

答案 4 :(得分:1)

一个很棒的在线工具BabelJs

它可以帮助您轻松地将ES6转换为ES5。但是,我建议了解它如何进行转换

   'use strict';

    var jsonObject = { a: { b: 'c' } };
    var x = 'a.b';
    var properties = x.split('.');

    var item = properties.reduce(function (obj, prop) {
      return obj && obj[prop];
    }, jsonObject);

    console.log(item);

答案 5 :(得分:1)

您可以添加默认值以防止对象中的非给定属性。

const item = properties.reduce(function (obj, prop){
        return (obj || {})[prop];
    }, jsonObject);