Vue.js VueJS中的绑定函数含义

我有一个脚本，它在VueJS中使用bind方法.过滤器的目的是根据性别或所有人返回人员.

我有HTML代码:

<div id="demo">
        <div class="radio">
            <label>
                <input type="radio" name="gender" v-model="gender" value="all"> All
            </label>
        </div>

        <div class="radio">
            <label>
                <input type="radio" name="gender" v-model="gender" value="male"> Male
            </label>
        </div>

        <div class="radio">
            <label>
                <input type="radio" name="gender" v-model="gender" value="female"> Female
            </label>
        </div>

        <ul>
            <!-- Don't forget about Vue's filterBy filter. This is only for ex. -->
            <li v-for="person in people | gender">{{ person.name }}: {{ person.gender }}</li>
        </ul>
    </div>

下面是JavaScript代码:

new Vue({
    el: '#demo',

    data: {
        gender: 'all',

        people: [
            { name: 'Jeff', gender: 'male' },
            { name: 'Jack', gender: 'male' },
            { name: 'Steven', gender: 'male' },
            { name: 'Kate', gender: 'female' },
            { name: 'Susan', gender: 'female' },
            { name: 'Claire', gender: 'female' }
        ]
    },

    filters: {
        gender: function(people) {          
            if (this.gender == 'all') return people;

            return people.filter(function(person) {
                return person.gender == this.gender;

            }.bind(this));
        }
    }

});

我不太明白bind(this)在这种情况下能做什么.谁能给我解释一下吗？谢谢