2016-08-24 2 views
0

내 작업에서 일부 프레임 워크 제한 때문에 es6에서 내 코드를 번역하려고했습니다 ... 문제가 무엇인지 파악하는 데 상당히 어려움을 겪었지만. 어떤 이유로 코드가 완전히 동일하게 작동하지 않으며 오류가 없습니다. ...es5에서 깨진 es6 코드

누군가 제대로 말할 수 있습니까?

이것은 ES6 코드 : 상기 주석으로

function filterFunction(items, filters, stringFields = ['Title', 'Description'], angular = false) { 
    // Filter by the keys of the filters parameter 
    const filterKeys = Object.keys(filters); 

    // Set up a mutable filtered object with items 
    let filtered; 

    // Angular doesn't like deep clones... *sigh* 
    if (angular) { 
     filtered = items; 
    } else { 
     filtered = _.cloneDeep(items); 
    } 

    // For each key in the supplied filters 
    for (let key of filterKeys) { 
     if (key !== 'TextInput') { 
      filtered = filtered.filter(item => { 

       // Make sure we have something to filter by... 
       if (filters[key].length !== 0) { 
        return _.intersection(filters[key], item[key]).length >= 1; 
       } 

       return true; 
      }); 
     } 

     // If we're at TextInput, handle things differently 
     else if (key === 'TextInput') { 
      filtered = filtered.filter(item => { 
       let searchString = ""; 

       // For each field specified in the strings array, build a string to search through 
       for (let field of stringFields) { 
        // Handle arrays differently 
        if (!Array.isArray(item[field])) { 
         searchString += `${item[field]} `.toLowerCase(); 
        } else { 
         searchString += item[field].join(' ').toLowerCase(); 
        } 
       } 

       // Return the item if the string matches our input 
       return searchString.indexOf(filters[key].toLowerCase()) !== -1; 
      }); 
     } 
    } 
    return filtered; 
} 

그리고이 I가 부분적으로 99 % 일 번역 코드 .. 여기서

function filterFunction(items, filters, stringFields, angular) { 
    // Filter by the keys of the filters parameter 
    var filterKeys = Object.keys(filters); 

    // Set up a mutable filtered object with items 
    var filtered; 

    // Angular doesn't like deep clones... *sigh* 
    if (angular) { 
     filtered = items; 
    } else { 
     filtered = _.cloneDeep(items); 
    } 

    // For each key in the supplied filters 
    for (var key = 0 ; key < filterKeys.length ; key ++) { 

     if (filterKeys[key] !== 'TextInput') { 
      filtered = filtered.filter(function(item) { 

       // Make sure we have something to filter by... 
       if (filters[filterKeys[key]].length !== 0) { 
        return _.intersection(filters[filterKeys[key]], item[filterKeys[key]]).length >= 1; 
       } 

       return true; 
      }); 
     } 

     // If we're at TextInput, handle things differently 
     else if (filterKeys[key] === 'TextInput') { 
      filtered = filtered.filter(function(item) { 
       var searchString = ""; 

       // For each field specified in the strings array, build a string to search through 
       for (var field = 0; field < stringFields.length; field ++) { 
        // Handle arrays differently 
        console.log(field); 
        if (!Array.isArray(item[stringFields[field]])) { 
         searchString += item[stringFields[field]] + ' '.toLowerCase(); 
        } else { 
         searchString += item[stringFields[field]].join(' ').toLowerCase(); 
        } 
       } 

       // Return the item if the string matches our input 
       return searchString.indexOf(filters[filterKeys[key]].toLowerCase()) !== -1; 
      }); 
     } 
    } 
    return filtered; 
} 
+1

왜 돈 [babeljs] (https://babeljs.io/) 만 사용하면 ES 버전을 관리합니다. –

+1

꽤 똑같이 작동하지 않는 것으로 보이는 것은 무엇입니까? – Karin

+0

'TextInput'이있는 다른 경우, 제대로 번역되지 않았다는 느낌이 들었습니다. – Kiwimoisi

답변

5

이 두 줄

searchString += `${item[field]} `.toLowerCase(); 
searchString += item[stringFields[field]] + ' '.toLowerCase(); 

은 참으로 동등하지 않다. 문자열의 모든 부분에 toLowerCase 방법을 적용하려면 괄호에 ES5의 연결을 포장해야합니다 : 공백 어쨌든 소문자 할 수 없으므로 단지 사용,

searchString += (item[stringFields[field]] + ' ').toLowerCase(); 

또는

searchString += item[stringFields[field]].toLowerCase() + ' '; 
+0

절대 전설 감사합니다 친구 – Kiwimoisi

0

babeljs 자체에서 번역 된 코드 .

'use strict'; 

function filterFunction(items, filters) { 
    var stringFields = arguments.length <= 2 || arguments[2] === undefined ? ['Title', 'Description'] : arguments[2]; 
    var angular = arguments.length <= 3 || arguments[3] === undefined ? false : arguments[3]; 

    // Filter by the keys of the filters parameter 
    var filterKeys = Object.keys(filters); 

    // Set up a mutable filtered object with items 
    var filtered = void 0; 

    // Angular doesn't like deep clones... *sigh* 
    if (angular) { 
     filtered = items; 
    } else { 
     filtered = _.cloneDeep(items); 
    } 

    // For each key in the supplied filters 
    var _iteratorNormalCompletion = true; 
    var _didIteratorError = false; 
    var _iteratorError = undefined; 

    try { 
     var _loop = function _loop() { 
      var key = _step.value; 

      if (key !== 'TextInput') { 
       filtered = filtered.filter(function (item) { 

        // Make sure we have something to filter by... 
        if (filters[key].length !== 0) { 
         return _.intersection(filters[key], item[key]).length >= 1; 
        } 

        return true; 
       }); 
      } 

      // If we're at TextInput, handle things differently 
      else if (key === 'TextInput') { 
        filtered = filtered.filter(function (item) { 
         var searchString = ""; 

         // For each field specified in the strings array, build a string to search through 
         var _iteratorNormalCompletion2 = true; 
         var _didIteratorError2 = false; 
         var _iteratorError2 = undefined; 

         try { 
          for (var _iterator2 = stringFields[Symbol.iterator](), _step2; !(_iteratorNormalCompletion2 = (_step2 = _iterator2.next()).done); _iteratorNormalCompletion2 = true) { 
           var field = _step2.value; 

           // Handle arrays differently 
           if (!Array.isArray(item[field])) { 
            searchString += (item[field] + ' ').toLowerCase(); 
           } else { 
            searchString += item[field].join(' ').toLowerCase(); 
           } 
          } 

          // Return the item if the string matches our input 
         } catch (err) { 
          _didIteratorError2 = true; 
          _iteratorError2 = err; 
         } finally { 
          try { 
           if (!_iteratorNormalCompletion2 && _iterator2.return) { 
            _iterator2.return(); 
           } 
          } finally { 
           if (_didIteratorError2) { 
            throw _iteratorError2; 
           } 
          } 
         } 

         return searchString.indexOf(filters[key].toLowerCase()) !== -1; 
        }); 
       } 
     }; 

     for (var _iterator = filterKeys[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) { 
      _loop(); 
     } 
    } catch (err) { 
     _didIteratorError = true; 
     _iteratorError = err; 
    } finally { 
     try { 
      if (!_iteratorNormalCompletion && _iterator.return) { 
       _iterator.return(); 
      } 
     } finally { 
      if (_didIteratorError) { 
       throw _iteratorError; 
      } 
     } 
    } 

    return filtered; 
} 

추신 또는 수동으로 변환하지 않고 직접 babeljs를 사용하는 더 좋은 방법이 있습니다.

+0

매우 못 생기고 디버깅하기가 훨씬 더 어려울지라도 그걸 보았습니다. – Kiwimoisi

+0

@Kiwimoisi babel [디버깅 도구] (https://babeljs.io/docs/setup/#babel_node_debug)도 제공하므로 원본도 만들 수 있습니다. 따라서 코드 변환 된 코드를 디버깅하는 것은 매우 쉽습니다. –

관련 문제