so I don't have a lot of experiences in using classes with javascript and I'm facing a problem that is certainly easy to solve but I can't find the solution.
It's quite simple, I would like to have access to the variable this.gtaList inside the anonymous function of ".on()".
I know the solutions without using the classes, but since I force myself to use them in order to be able to use this code later, I'm facing a wall.
...
success: function(streamList) {
this.gtaList = [];
this.streamList = streamList
for (let i = 0; i < this.streamList['data'].length; i++){
if(this.streamList['data'][i]['game_id'] == 32982){
this.gtaList.push(this.streamList['data'][i]['display_name'])
this.img = $('<img id="thumbnail'+i+' " src="https://static-
cdn.jtvnw.net/previews-ttv/live_user_'+this.streamList['data'][i]
['display_name']+'-300x200.jpg">')
.on("click", (function (index) { /* I want to use this.gtaList inside this
function*/
return function (e) {
console.log(index)
new Twitch.Embed("twitch-embed-main", {
width: '80%',
height: '80%',
channel: this.gtaList[index],/* this.gtaList is undefined here */
autoplay: false,
layout: "video",
parent: ["embed.example.com", "othersite.example.com"]
});
};
})(i));
$('#twitch-embed-low').append(this.img)
}
}
...
I hope I have been as clear as possible, in general I find it difficult to explain haha.
Use arrow function => instead so you can access the this keyword properly
something like this:
.on("click", index => { })