Clarification on Javascript functions

Question

I am looking at a chrome extension JavaScript code and I came across the below lines which I did not understand.

var change = function (b, a) {
.....
.....
}, wall = {
loginOverrides: {
 "^(www\\.)?twitter\\.com": {
 action: function () {
 .....
 .....
 }

1.I see a function named "wall" and I could see that the file name is also wall.js. So, is this a constructor by any chance.? or is it a function ?

2.I also see the code where they are checking for login override with a site (twitter in this case). I would like to understand on what "loginOverrides" mean ? Is it a keyword in javascript ? Why is the twitter url patterned in the way as available in the code with " ^ " and " ? " in the middle of the url ? And what does the action function do ?

I am a starter with javascript. So, it would be really helpful if I could get some clear clarifications.

Answer 1

Viman. It would be really cool if you posted a whole js file (or jsfiddle), but as far as I can see there are 2 variables:

• Change
• Wall

Those vars are listed throuh comma notation, like that:

var a = 1,
 b = 2,
 c = 3;

Which is the same as this:

var a = 1;
var b = 2;
var c = 3;

Variable "change" is a function. If you don't uderstand why it is

var change = function(b,a){}

and not

function change(b,a){}

read function declaration vs function expression.

Next one is variable "wall". It is an object, that contains a property called "loginOverrides", which has another object as it value. This "object as value" has property: "^(www\.)?twitter\.com", which has yet another object as value. This "yet another object as value" has property "action", that is a method of its object. Sounds complicated when explained in detail.

After quick guide in this code, answering your questions:

Q: I would like to understand on what "loginOverrides" mean?

A: It is a name of property of "wall" object. Properties can be called whatever you want, excluding some words used by JS itself.

Q: Is it a keyword in javascript ?

A: No

Q: Why is the twitter url patterned in the way as available in the code with " ^ " and " ? " in the middle of the url ?

A: It seems that further on in code it will be used as regex. ^ is used to match starting of a regex expression, and ? is used to get 0 or 1 of chekced instance. If you don't get what I said get a quick look here: http://regexr.com/

Q: And what does the action function do ?

A: Can't say, because you left only dots inside of fucntion body. As said earlier it is a method of it's object.

Hope, that helps.

• mbvee: Thank you so much for the detailed clarification. This is exactly like what I expected.

Answer 2

Change is a function, not a constructor. You can call it with

change(value1, value2);

Wall is an object, loginOverrides is not a javascript keyword, but an object within that object. Both have a key and a value like this:

var obj = { foo: "bar", baz: 42 };

See here: https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_objects/Object/values

It is the same as writing

var newObject = {
 key1 : { // This whole part is the value of key1 and an object itself
 key2: function() {
 // Do stuff
 }
 }
}

• mbvee: Thank you so much for helping me understand the context.