This question already has answers here:
How to access the correct `this` inside a callback
(13 answers)
Closed 1 year ago.
I am very new to Javascript and am trying to translate a game i made in python into javascript. I am currently trying to get keyboard input for the game. Whenever i run this however it gives me the following error:
Uncaught TypeError: Cannot read property '0' of undefined(at line 4 in this example)
Board is a 2d array used to store the board and i have tested that before the addEventListener statement Board is not undefined.
Why is this error happening and what should i do to fix it. As mentioned before i am a complete beginner at javascript so simple explanations would be greatly appreciated.
Kind regards
document.addEventListener('keydown', function(event){
if(event.keyCode == 65){
console.log(Board)
Board[this.block1[0]][this.block1[1]]=null;
Board[this.block2[0]][this.block2[1]]=null;
Board[this.block3[0]][this.block3[1]]=null;
Board[this.block4[0]][this.block4[1]]=null;
this in your code is not what you expect it to be. If block1 etc are local variables, reference them without this.. If they are members of your encapsulating object, change your callback function to use arrow syntax to let this reference your object: document.addEventListener('keydown', event => { /*...*/ })
Related
This question already has answers here:
How to access the correct `this` inside a callback
(13 answers)
Closed 9 months ago.
Here's the thing. I looked up a pong game for java and now I want to try to make it in js. I'm still not good at js and I'm trying to code a simple pong game while trying to use classes like in java. But the problem is I always get this error "Uncaught TypeError: Cannot read properties of undefined (reading 'move')". I've tried looking online for solutions but I still don't get it.
This also shows up for the other two methods, draw and run.
Can anyone please kindly tell me why this happens?
class Game {
constructor() {
this.run();
}
run() {
this.move();
this.draw(ctx);
requestAnimationFrame(this.run);
}
draw(ctx) {
paddle.draw(ctx);
}
move() {
paddle.move();
}
}
let game = new Game();
Thank you very much in advance to anyone who will answer this.
In this case, you call to the method of instancepaddle and it's not declare yet.
That's why, javascript cheat as paddle undefine variable.
This question already has answers here:
addEventListener, arrow functions, and `this` [duplicate]
(1 answer)
What does "this" refer to in arrow functions in ES6?
(10 answers)
Closed last year.
So I'm dealing with a little problem..
I'm trying to modify drag-and-drop code and came across a problem, since I want to have multiple drop areas and one function for all of them.
I have this code:
dropArea.addEventListener("dragover", (event)=>{
event.preventDefault(); //preventing from default behaviour
dropArea.classList.add("activated");
dragText.textContent = "🖐 Release to Upload File";
});
And specified dropareawitth querySelector:
const dropArea = document.querySelector(".drag-area")
Now I need to modify it to work with multiple drop zones. I thought to just replace the "droparea" inside the event to "this" something like that:
this.classList.add("activated");
but it does not work. I even tried:
$(this).classList.add("activated");
Returns this error:
Uncaught TypeError: Cannot read properties of undefined (reading 'add')
Any solutions? I'm stuck...
As your event handler is an arrow function, the value of this is not influenced by the caller, so you cannot use it to get the DOM element. You can use event.target.
event.target.classList.add("activated");
As to your final attempt: $() does not return a DOM element, but an array-like "jQuery" collection object, which doesn't have such properties as classList.
This question already has answers here:
Accessing an object property with a dynamically-computed name
(19 answers)
Closed 1 year ago.
I am trying to create a function that uses the push() or pop() methods as arguments when it is called. I have a working a code but I noticed that I repeated myself a lot and I know that a function would help to improve my code quality, however, I have not been able to find a way to dynamically introduce the push() or pop() methods so I do not have to repeat the same lines of code when I want to do something similar.
This is the current working code (and this is similar to other lines):
pushBtn.addEventListener("click", () => {
if (inputEl.value) {
myEmojis.push(inputEl.value)
inputEl.value = ""
}
render(myEmojis)
})
I created a function that I would pass the push() argument to but it doesn't work as expected.
Here is the function I tried to create:
function modifyEmoji(action) {
if (inputEl.value) {
myEmojis.action(inputEl.value)
inputEl.value = ""
}
render(myEmojis)
}
How I call the function:
pushBtn.addEventListener("click", () => {
modifyEmoji(push)
})
This returns: "Uncaught TypeError: myEmojis.action is not a function"
Thanks in advance.
this line of code: myEmojis.action(inputEl.value)
says that a funcation named "actions" is defined for object array, While this is not the case and so it causes the error
This question already has answers here:
Uncaught TypeError: Illegal invocation in JavaScript
(2 answers)
Closed 6 years ago.
I am new to javascript. Due to certain reasons, I need to override windows.alert function by console.log function. For that, I have written following code,
window.alert = console.log;
alert('abc'); // gives TypeError : Illegal invocation.
I don't know what's wrong I am doing here. As per my knowledge, it's possible to modify javascript function reference with another function object.
Edit
Many have downvoted my question and given me reference to similar question, but
my problem is different. I want to suppress the warning of datatable grid library in jquery. That's why I want to replace alert by console.log or other function.
Hope this should work...
alert("msg");
function alert(msg){
console.log(msg);
}
This should do
var alert = (...params) => console.log(...params);
This question already has answers here:
Closed 11 years ago.
Possible Duplicate:
Javascript how do you find the caller function?
Is there a way to get the value of this from the function which has called the current function?
Look at this:
function TraceMySelf(){
console.log(this);
}
function A(){
TraceMySelf();
console.log(this);
}
var a = new A();
When this code is executed, the console displays first the window object and then the a object. How can I make the code display the a object twice, with only changing line 2? I know that I could apply the function inside A with this, but that isn't what I want.
Is this possible?
I think this is the answer to your question: StackOverflow 280389
However, I think the right answer is "don't do that". I think it runs counter to how JavaScript is designed.
It might also be worth looking at jQuery Proxy for another way of linking function and object.