Javascript code: how does it work?

Question

I recently completed the DevTools ~> http://discover-devtools.codeschool.com/ course and while inspecting the code used I came across some sections which I did not understand:

String.prototype.repeat = function (num) {
  return new Array(num + 1).join(this);
};

used in the displayDate() method thus:

var body = $('body')[0].outerHTML.repeat(10000);

What is the importance of using this code?

Secondly, within displayToday() method, displayDate() method is called with an argument although it is not defined to take an arg. Why is this so?

I am learning JS and couldn't npt wrap my head around these. Any help is welcome.

Could you paste the code or the exact URL for displayToday() and displayDate()? — Nathan
– Nathan, Commented May 3, 2013 at 20:59

Joseph · Accepted Answer · 2013-05-03 21:14:05Z

4

String.prototype.repeat = function (num) {
  return new Array(num + 1).join(this);
};

This code creates an array that is num+1 in length, filled with undefined. It is then collapsed into a string using join, separating each undefined value with the context this which is the outerHTML string. When an array is joined into a string, undefined values are just nothing, thus the string generated only contains your separators which appear num times, thereby "repeating" the string.

//let . be "undefined, which when turned into a string, is just nothing
[u,u,u,...,u].join('test');
'(u)test(u)test(u)...(u)test'
'testtest...test'

As for the second question, functions in JS will always take in arguments, even if the function isn't meant to take one. Defining arguments in the function in JS is simply assigning the passed arguments a name. The arguments will always go to the function, and collected in a special array available in functions as the arguments variable.

function fn(){
  console.log(arguments); //['hello','world'];
}

foo('hello','world');

edited May 3, 2013 at 21:14

answered May 3, 2013 at 21:03

Joseph

120k31 gold badges186 silver badges238 bronze badges

Sign up to request clarification or add additional context in comments.

6 Comments

gmajivu Over a year ago

I have added link to the code: jsfiddle.net/gabeno/3wbcB I am trying to understand why use the repeat() function within the DOM. In what way does it change the DOM?

Joseph Over a year ago

@gabeno it doesn't do anything in your code. Nothing it that function uses body.

gmajivu Over a year ago

thanks for the headsup, though I feel it could just be some sort of padding hack? Perhaps for positioning? Further going by your answer we need to reference args via the arguments array but from the code no reference to this array is made? Any tips?

Joseph Over a year ago

@gabeno arguments is provided by default in a function. It's directly accessible. Think of it as a pre-provided, invisible variable. Also, it's not a real array, but you can transform it into one.

gmajivu Over a year ago

Thanks @JosephTheDreamer you really can translate the codes!!

|

CrayonViolent · Accepted Answer · 2013-05-03 21:03:31Z

1

You can pass an argument to a function even if you don't have it listed in the declaration. You can access arguments passed with arguments

function foo () {
  console.log(arguments);
}

foo('bar'); // ['bar']
foo('bar','blerg'); // ['bar','blerg']

answered May 3, 2013 at 21:03

CrayonViolent

32.6k6 gold badges61 silver badges80 bronze badges

Comments

flavian · Accepted Answer · 2013-05-03 21:11:34Z

It's very simple.

When you alter the prototype of something, in this case the default String class, you make that method available to any instance of that class, in this case to any string.

Now let's look at what the method does.

return new Array(num + 1).join(this);

Because of String.prototype.displayDate = function(num) {, the value of this inside that function is the value of the string. The this reference points to the current object, I guess that makes sense.

Then it's creating an array of num + 1 elements, which will all be initialised with undefined. Array.prototype.join returns the string representation of the array elements separated by the thing you provide as an argument to it.

in this case, you have an array of num +1 undefined values. the string representation of undefined is "", or the empty string. So you end up having num + 1 concatenations of the empty string + the value of this, or num times your string.

Say your string is "test", and you call repeat(2).

It first created a = new Array(undefined, undefined, undefined);// 2 + 1 times.

Then it starts to join the strings, putting "test" in between each pair.

new String(undefined) + new String("test") + new String(undefined); + new String("test") + new String(undefined)

The above becomes:

"" + "test" + "" + "test" + "" = "testtest"// two times the original string.

Collectives™ on Stack Overflow

Javascript code: how does it work?

3 Answers 3

6 Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

6 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related