Ember.js ArrayProxy invoke() Method

import Route from '@ember/routing/route';
class employee {
    name = null;
    city = null;
    gender = null;
    zipCode = null;
    constructor(name, city, gender, zipCode) {
        this.name = name;
        this.city = city;
        this.gender = gender;
        this.zipCode = zipCode;
    }
    show_details() {
        return `${this.name} is Employee from 
        ${this.city} zipCode ${this.zipCode}`;
    }
}
export default class DetailsRoute extends Route {
    details = [
        new employee('Anubhav', 'Patna', 'M', '800020'),
        new employee('Satyam', 'Delhi', 'M', '110012'),
        new employee('Shivam', 'Patna', 'M', '530068'),
        new employee('Ayushi', 'Jaipur', 'F', '302001'),
    ];
    attr = ['name', 'city', 'gender', 'zipCode'];
    temp;
    start;
    end;
    model() {
        return this.details;
    }
    setupController(controller, model) {
        super.setupController(controller, model);
        controller.set('details', this.details);
        controller.set('attr', this.attr);
        controller.set('temp', this.temp);
        controller.set('temp2', this.temp2);
        controller.set('end', this.end);
    }
}

import Ember from "ember";
import { any, slice, reverseObjects, rejectBy }
    from "@ember/array";

export default Ember.Controller.extend({
    actions: {
        checkCity(city) {
            let res = this.details.any((person) =>
                person.city == city);
            alert(`Person from ${city} is ${res ? "" :
             'not'} Present`);
        },
        getFemale() {
            let tempItems = this.details.find((i)
            => i.gender == "F");
            alert(tempItems.name);
        },
        show_Data() {
            let ans = this.details.invoke('show_details');
            alert(ans.join('\n'))
        },
    },
});

{{page-title "invoke"}}
<h3>List of People: </h3>
<br /><br />
<table>
    <tr>
        <th>Name</th>
        <th>Gender</th>
        <th>City</th>
        <th>Zip Code</th>
    </tr>
    {{#each @model as |detail|}}
        <tr>
            <td>{{detail.name}}</td>
            <td>{{detail.gender}}</td>
            <td>{{detail.city}}</td>
            <td>{{detail.zipCode}}</td>
        </tr>
    {{/each}}
</table>
<br /><br />
<div>
    <label>Enter City: </label>
    {{input value=this.city}}
</div>
<div>
    <input
        type="button"
        id="check-city"
        value="Check"
        {{action "checkCity" this.city}}
    />
</div>
<br />
<input
    type="button"
    id="get-female"
    value="Get Female"
    {{action "getFemale"}}
/>

<br /><br />
<div>
    <input
        type="button"
        id="show-details"
        value="Employee's details"
        {{action "show_Data"}}
    />
</div>
{{outlet}}

import Route from '@ember/routing/route';

class fruit {
    name = null;
    isFruit = null;
    color = null;
    constructor(name, isFruit, color) {
        this.name = name;
        this.isFruit = isFruit;
        this.color = color;
    }

    Show_item() {
        return `${this.name} is ${this.color} color`;

    }
}

export default class StudentsRoute extends Route {
    fruits = [new fruit('Orange', true, 'orange',),
    new fruit('Apple', true, 'red'),
    new fruit('Pineapple', true, 'Green-grey'),
    new fruit('Banana', true, 'yellow'),
    new fruit('Potato', false, 'brown'),
    new fruit('Cabbage', false, 'green'),
    new fruit('Cauli-flower', false, 'green'),
    ];
    temp2;
    temp;
    model() {
        return this.fruits;
    }
    setupController(controller, model) {
        super.setupController(controller, model);
        controller.set('fruits', this.fruits);
        controller.set('temp', this.temp);
        controller.set('temp1', this.temp1);
        controller.set('temp2', this.temp2);
    }
}

import Ember from 'ember';

export default Ember.Controller.extend({
    actions: {
        find_Data() {
            let ans = this.fruits.invoke('Show_item');
            alert(ans.join('\n'))
        },
        insertItem(data, data1, data2) {
            let temp = {
                name: data,
                isFruit: data1,
                color: data2,
            }
            let ans = this.fruits.pushObject(temp);
        },
    },
});

{{page-title "Student"}}
<h3>List of Students: </h3>
<br />
<table>
    <tr>
        <th>Name</th>
        <th>isFruit </th>
        <th>Color </th>

    </tr>
    {{#each @model as |detail|}}
        <tr>
            <td>{{detail.name}}</td>
            <td> {{detail.isFruit}}</td>
            <td>{{detail.color}}</td>
        </tr>
    {{/each}}
</table>

<br />
<br />
<div>
    <input
        type="button"
        id="check-fruit"
        value="Show Items details"
        {{action "find_Data"}}
    />
</div><br /><br />
<div>
    <label>Enter Fruit Name: </label>
    {{input value=this.item1}}
</div><br />
<div>
    <label>Item is Fruit: </label>
    {{input value=this.item2}}
</div><br />
<div>
    <label>Enter Fruit color: </label>
    {{input value=this.item3}}
</div><br />
<div>
    <input
        type="button"
        id="insert-item"
        value="Insert Fruit"
        {{action "insertItem" this.item1 
         this.item2 this.item3}}
    />
</div>

{{outlet}}