How to avoid the top ten errors in JS

This error is the same as chrome’s “TypeError: ‘undefined’ is not a function”. It’s just that different browsers will report different error words.

This kind of error is generally high on IE that uses namespaces. 99.9% it’s because IE can’t resolve the correct namespace that this points to. For example:

var Person = {
     name : "daisy",
     getName : function() {
         console.log(this.name)
     },
     print: function() {
       this. getName()
     }
 };

For example, in the namespace of Person, the method this.getName() can be called in print. But it doesn’t work in IE, so the namespace must be clearly stated.

var Person = {
     name : "daisy",
     getName : function() {
         console.log(Person.name)
     },
     print: function() {
       Person. getName()
     }
 };

(Note: Since I don’t have a Windows computer at hand, and I’m too lazy to find ==, so I haven’t verified it. According to the translation of the original text, I understand this meaning. If you are interested, you can verify it. Comments Tell me the conclusion~)

6. TypeError: ‘undefined’ is not a function

This is the reason mentioned above, did Chrome/Firefox call it? The defined method leads to. I won’t go into details.

Of course, except for negligence, no one will directly call an undefined method, mostly because of insufficient understanding of this in callback functions or mandatory packages. For example:

function clearBoard(){
   alert("Cleared");
 }
 document. addEventListener("click", function(){
   this. clearBoard(); // what is “this” ?
 });

In this case, the this in the callback function actually points to the document, and the scope of the clearBoard namespace defined in the outer layer is in the window, so it will report “Uncaught TypeError: this. clearBoard is not a function”. error.

There are many ways to solve the above problems:

1. You can save the outer this, so that self still points to windows.

var self=this; // save reference to 'this', while it's still this!
 document. addEventListener("click", function(){
   self. clearBoard();
 });

2. You can also use bind to change the direction of this.

document.addEventListener("click",this.clearBoard.bind(this));

Seven, Uncaught RangeError

This error will appear in many scenarios of Chrome. One of them is to use recursion without using the stop condition.

When is it easy to make this mistake? In the callback of the event, if you want to use the event, you should pay attention to the incoming event.

document. addEventListener("mousemove", function (event) {
   console. log(event);
 })

Because some browsers will not automatically upload for you, such as Firefox, they will report an error. So it’s best to pass it on yourself.

Recommended tutorial: “JS Tutorial”

The above is the detailed content of how to avoid the top ten errors in JS. For more information, please pay attention to 1024programmer.com Other related articles!