Vue.js data objects don't work with some lodash functions?
<p>I'm doing a little <strong>store pattern</strong> as indicated in the <a href="http://vuejs.org/guide/application.html#State-Management" rel="nofollow">docs</a>.</p>

<p>Here is my store object:</p>

<pre><code>import Vue from 'vue';
import _ from 'lodash';

class EmployeeService {

  constructor() {
    this.employees = null;
    this.url = 'http://url';
  }

  all() {
    if (this.employees === null) {
      return Vue.http.get(this.url)
        .then(response =&gt; (this.employees = response.data.data));
    }

    return new Promise(resolve =&gt; resolve(this.employees));
  }

  find(id) {
    const employee = _.find(this.employees, { id });

     if (_.isUndefined(employee)) {
       return Vue.http.get(`${this.url}/${id}`)
         .then(response =&gt; response.data);
     }

    return new Promise(resolve =&gt; resolve(employee));
  }

}

export default new EmployeeService();
</code></pre>

<p>The problem is in the <code>find(id)</code> method, whenever I use the lodash function <code>_.find()</code>, it <strong>always</strong> returns <code>undefined</code>, even when the object does exist. But when I use vanilla js, like this:</p>

<pre><code>const employee = this.employees.flter(emp =&gt; emp.id == id)[0];
</code></pre>

<p>It has no problem finding the object.</p>

<p>I would like to know why this happens, and find if it's a bug or is an expected behaviour.</p>