Is “clear” a reserved word in Javascript?

by

As the others said, clear is not a reserved keyword. It seems that the called function is document.clear [MDN]. Invoking

console.log(clear === document.clear);

inside the event handler returns true.

DEMO

So it seems, document is in the scope chain of the event handler…. the question now is why.

JavaScript: The Definitive Guide says:

In an event handler as HTML attribute, the Document object is in the scope chain before the Window object (…)

As your method is global, meaning it is a property of the window object, it is not found in the scope chain, as document.clear comes earlier in the scope chain.

I haven’t found any specification for this. The guide also says that one should not rely on that, so I assume this is nothing official.

If you have form elements inside a form, then even the corresponding form element will be in the scope chain (not sure whether this holds for all browsers though). This is another reason for confusion.

There are two (not exclusive) ways to avoid such situations:

  • Don’t use inline event handlers. It is considered bad practice as it is mixing logic and presentation. There are other ways to attach event handlers.

  • Don’t pollute the global namespace. Create one object in global scope (with a name you are sure of does not collide with any window or document properties or ids of HTML elements) and assign the functions as properties of this object. Whenever you call a function, you reference it through this object. There also other ways to namespace your code.

More Related Contents:

  1. ReferenceError: event is not defined
  2. how i can connect and login in mysql localhost in php by using this html code
  3. How to create a file in memory for user to download, but not through server?
  4. How do you find out the caller function in JavaScript?
  5. Format JavaScript date as yyyy-mm-dd
  6. Arrow function without curly braces
  7. How to wait for the ‘end’ of ‘resize’ event and only then perform an action?
  8. vuejs update parent data from child component
  9. using brackets with javascript import syntax
  10. event.returnValue is deprecated. Please use the standard event.preventDefault() instead
  11. ES6 variable import name in node.js?
  12. Javascript || operator
  13. Fetch API request timeout?
  14. Detect click outside element
  15. Method overloading in Javascript
  16. Cross Browser Flash Detection in Javascript
  17. Mobile Safari Autofocus text field
  18. Injecting a mock into an AngularJS service
  19. javascript function leading bang ! syntax
  20. Running .exe from Javascript
  21. input type=file show only button
  22. Standard conventions for indicating a function argument is unused in JavaScript
  23. Communicating between a Chrome packaged app and a Chrome extension?
  24. How to call another function within the same object?
  25. How to add a trailing zero to a price?
  26. Web application access user’s file system
  27. Copying of an array of objects to another Array without object reference in javascript(Deep copy)
  28. Add javascript pixel values?
  29. I have a UTC string and I want to convert it to UTC Date Object in JavaScript [duplicate]
  30. How do you set, clear and toggle a single bit in JavaScript?

Leave a Comment