this指针指代问题
来源:25-3 使用Module和Class提取封装一个Movie对象
夏河文化
2019-03-19
老师,请问一下,我在您用class类改写movie那一章节中对this的指向问题还有一点不清楚:
这里老师您说需要用bind绑定this使得processDoubanData中的this指的是Movie类,这样才能用this.cb调用Movie类中的cb方法:
然后我发现在没有使用Movie这个class之前,我们是直接在页面调用util.http函数进行数据绑定的:
而调用页面中也有一个processDoubanData函数,其中也用到了this指针用于绑定数据到当前页面的data中:
那么我想请问一下为什么第一种做法需要bind(this)来确保processDoubanData函数内部的this指的是Movie类,而第二种就不需要绑定this用于指代当前页面呢?这样的话,processDoubanData函数传到util中的http方法时this的指向不也发生了改变么?
补充:
Movie.js
var util = require('../../../../utils/util.js')
class Movie {
constructor(url) {
this.url = url;
}
getMovieData(cb) {
this.cb = cb;
util.http(this.url, this.processDoubanData.bind(this));
}
processDoubanData(data) {
if (!data) {
return;
}
var director = {
avatar: "",
name: "",
id: ""
}
if (data.directors[0] != null) {
if (data.directors[0].avatars != null) {
director.avatar = data.directors[0].avatars.large
}
director.name = data.directors[0].name;
director.id = data.directors[0].id;
}
var movie = {
movieImg: data.images ? data.images.large : "",
country: data.countries[0],
title: data.title,
originalTitle: data.original_title,
wishCount: data.wish_count,
commentCount: data.comments_count,
year: data.year,
generes: data.genres.join("、"),
stars: util.convertToStarsArray(data.rating.stars),
score: data.rating.average,
director: director,
casts: util.convertToCastString(data.casts),
castsInfo: util.convertToCastInfos(data.casts),
summary: data.summary
}
this.cb(movie);
}
}
export { Movie }
util.js中的http方法
function http(url, callBack){
wx.request({
url: url,
method: 'GET',
header: {
"Content-Type": ""
},
success:function(res){
callBack(res.data)
},
fail: function(error){
console.log(error)
}
})
}
movie-detail.js中的方法:
onLoad: function(options) {
var movieId = options.id
var url = app.globalData.doubanBase + '/v2/movie/subject/' + movieId
// 方法一:用本页面函数
// util.http(url, this.processDoubanData)
// 方法二:用class类+匿名函数
// 因为此处匿名函数内部this的指向发生改变,所以用了that
var movie = new Movie(url);
var movieData = movie.getMovieData();
var that = this;
movie.getMovieData(function (movie) {
that.setData({
movie: movie
})
})
2回答
-
7七月
2019-03-19
util.http(url, this.processDoubanData) ,这个代码没毛病吧?process函数就在当前的Page里对吧。我们已经写了很多个this.method的代码了。
第二个 that.setData这是因为他是在一个回调函数呀。这个我觉得,你还是要去详细的看一下this这个关键字的意义。this的指代 主要是和“谁”调用这个函数有关系的,你可以看下上述 函数调用方到底是哪个?
012019-03-19 -
7七月
2019-03-19
你把代码贴全一点,这样分段我不太能理解。
012019-03-19
相似问题