Question

我正在跟踪this tutorial以“检测”数组对象中是否有唯一的数字。这个数字是一个字符串。

我已经习惯了Ruby on Rails中的detect所以我在React（JavaScript）中寻找等价物：

ES6：

...


// this will be "data" in "this.props.data"
data = [
 {
   id: 1,
   order_id: "44",
   name: "Some order number name",
  },
  {
    id: 2,
    order_id: "65",
    ...,
  }
]

  // let num = "44"; Just for this example

  renderCreditNote(num){
    if (num instanceof this.props.data) {
      return num.map(function(p){
        return p.order_id
      });
    }
  }

  render(){
   return({this.renderCreditNote().bind(this)})
  }

...

实际上，这将如下所示：this.renderCreditNote(this.state.num).bind(this)

因此，如果此num位于数组中，则仅显示该数组。我这样做是对的吗？错误是：

未捕获的TypeError：'instanceof'的右侧不可调用

Answer 1

我不了解Ruby，但基于detect的描述，您似乎在JavaScript中寻找array.find。 .find迭代一个数组 - 如果它找到你要查找的项目，它将返回它并停止迭代，如果它没有找到任何undefined被返回。

例如：

  renderCreditNote(num){
    return this.props.data.find(function(p){
      return num === p.order_id;
    });
  }

这是一个小提琴：https://jsfiddle.net/7ykt9ze3/

一些ES6美化：

  renderCreditNote(num){
    return this.props.data.find(p => num === p.order_id);
  }

请注意，稍微老一点的浏览器并不完全支持这一点，我从经验中知道IE11没有它。然而，它绝对值得填料。

关于您链接的博客 - 如果输入是数据结构，instanceof基本上返回true / false，而不进行原型继承。在您链接的博客中，他们检测输入是对象还是数组 - 但只有这样他们才能根据输入采取不同的操作。因此，如果它是一个对象，它们只返回该对象上的字段，如果它是一个数组，它们使用.map遍历数组，并返回该数组中这些对象的所有名称。

编辑以检查渲染方法：

  render(){

   return(<div>{JSON.stringify(this.renderCreditNote().bind(this))}</div>)
  }

Answer 2

您应该将函数传递给右侧的实例。尝试并执行this.props.data.constructor

'instanceof'的右侧不可调用

2 个答案: