CODEWITHSUNDEEP
javascriptfunctionparameters
Warrshrike
Warrshrike

Reputation: 136

How do parameters named as strings work in Javascript?

How does Javascript work with arguments as string and why is this done? For example:

window.addEventListener('hashchange', function () {

I understand how this helps with minification in the case of, for example, Angular (which must match arg names like $scope from another file) but this is native Javascript. And how does this work 'behind the scenes' (does the JS interpreter, for example, analyze the strings and substitute them for actual arguments)?

First day on Stackoverflow, apologies if this is a repeat question :)

Upvotes: 1

Views: 100

Answers (2)

transistor09
transistor09

Reputation: 5138

How are arguments passed

Let's say you define a function as follows

function Foo(argument1, argument2, argument3) {
    return argument1 + argument2
}

When the function is called, the arguments get assigned respectively as passed, substituting undefined for any that are missing. For illustration purposes, you can imagine it as the following code (although it doesn't really happen anywhere and any expressions you have will be evaluated in the calling scope).

// somewhere in the script
foo('bar', 'baz' + '1')
...
// in scope of function Foo, between its { and }
var argument1 = 'bar', // these lines never actually exist
    argument2 = 'baz1', // but variables are created as if they were
    argument3 = undefined
return argument1 + argument2

How the script engine actually handles this situation is an implementation detail and you needn't worry about it.

Also, it doesn't matter at all whether you use a literal string or pass a variable that has a string.

var a = 'like this', b = 'and this'
foo('like this', 'and this')
foo(a, b) // the function has no way to differentiate these 2 lines

As a side note, this is perfectly safe, because strings are immutable. Assigning to them inside the function will not propagate back to the outer scope (even if they are String objects). With JavaScript passing a string is actually the same as passing an integer.

Why would you use a string as an argument

There are several cases where this design decision would make sense. In the case of addEventListener it is useful because you can easily make your own events that you can be sure won't trip over some browser's internal mechanism.

Should the argument names match

Absolutely not. What's inside the function argument list is completely isolated of any interaction with other code, but when you're maintaining a code base you want your code to be readable and consistent. This is matter of agreement, not something enforced by the language.

Upvotes: 1

yolanda_dlh
yolanda_dlh

Reputation: 43

The first parameter in the addEventListener method is used to specify the type of the event handler like "click" or "mousedown".

Internally, it is attached an object (the event handler) that listens for incoming events in order to handle them or respond to that specific event. These events are triggered as a result of the interaction with the web application, for example the user clicked a button.

In the case of AngularJS it is followed the MVC (Model-View-Controller) software architecture pattern: https://en.wikipedia.org/wiki/Model%E2%80%93view%E2%80%93controller, so the $scope is the glue between the model and the view.

In AngularJS it is used to access to the data-model. The data-model in AngularJS has the same functionality as the document object but with the advantage that you can define diferent scopes levels to access the DOM.

Upvotes: 0

Related Questions