官方API到底还是比较靠谱的
bind方法会创建一个新函数,称为绑定函数.当调用这个绑定函数时,绑定函数会以创建它时传入bind方法的第一个参数作为this,传入bind方法的第二个以及以后的参数加上绑定函数运行时本身的参数按照顺序作为原函数的参数来调用原函数
提炼：
- 第一个参数是上下文中的this
- 第二个及以后的参数是作为新函数的参数出入新函数中的
- 捆绑上下文（this关键字）和一系列参数到原来的函数(传入的参数是值传递到函数中)
首先看一段简单代码：
function add(a,b){
return a + b;
}
var a = 3;
var b = 4;var newFoo = add.bind(this,a, b);
a = 6;
b = 7;
console.log(newFoo());
首先看一段RN代码：
_renderImages = (imgDataList) =>{
let allImage = [];
for (let i = 0 ; i < imgDataList.length ; i++){
let itemUrl = imgDataList[i];
allImage.push(
<TouchableWithoutFeedback key = {i} onPress={this._onPressImage(i,imgDataList)}>
<Image source={{uri: itemUrl ,cache: 'force-cache'}} style={styles.imageStyle}/>
</TouchableWithoutFeedback>
);
}
allImage.push(
<View key = {imgDataList.length} style={{height:56,width:20}}/>//解决右侧靠边问题
);
return allImage;
}
_onPressImage = (i,imgDataList) =>{
NativeModules.HSLooKBigImg.lookBigImg(i.toString(), imgDataList.toString());
}
这段代码会出现_onPressImage 方法中接受的i会随着for循环中的i变化而变化，所谓为了解决此问题，引入bind()方法，如下：
_renderImages = (imgDataList) =>{
let allImage = [];
for (var i = 0 ; i < imgDataList.length ; i++){
let itemUrl = imgDataList[i];
allImage.push(
<TouchableWithoutFeedback key = {i} onPress={this._onPressImage.bind(this,i,imgDataList)}>
<Image source={{uri: itemUrl ,cache: 'force-cache'}} style={styles.testimageStyle}/>
</TouchableWithoutFeedback>
);
}
allImage.push(
<View key = {imgDataList.length} style={{height:56,width:20}}/>//解决右侧靠边问题
);
return allImage;
};
_onPressImage = (i,imgDataList) =>{
AlertIOS.prompt(i.toString());
// NativeModules.HSLooKBigImg.lookBigImg(i.toString(), imgDataList.toString());
}
引入bind()方法后，在创建每个{this._onPressImage.bind(this,i,imgDataList)}代码块的时候传入其中的参数 都是for循环期间的当前值，不会随着for遍历而比那话
