What is this "[]" here doing?

Question

Below is an extract from my textbook.

I have a question about the use of [] here in window.history[type](). I can tell that it's separating the object name(window) and the variable(type) so that they can be recognized as separate things but is there a name for this use of []? I performed a google search but nothing came up.

$(function() {
//omitted
['back', 'forward'].forEach(function(type) {
  $('.' + type).click(function() {
    window.history[type]();
    });
  });
});

`[]` notation is used when you try to access property using a variable. — Code Maniac, Feb 01 '19 at 13:02
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Property_Accessors — Teemu, Feb 01 '19 at 13:02
this is the same as doing window.history.back() or window.history.forward(), however, since type is dynamic, you must access the back or forward property using bracket notation — jo_va, Feb 01 '19 at 13:08
`type` is inside [] because in this case you are trying to read the property of object window.history that the variable `type` holds. If you remove `[]` and use `.` instead it will actually try to read the property `type` inside object `window.location` but you want to read the string that the variable holds. In this case `back` and `forward`. — Vaibhav Vishal, Feb 01 '19 at 13:08
There is no var to access to with square bracket notation in example code, so as is, it is an array with a forEach loop. — Mosè Raguzzini, Feb 01 '19 at 13:17
Possible duplicate of [JavaScript property access: dot notation vs. brackets?](https://stackoverflow.com/questions/4968406/javascript-property-access-dot-notation-vs-brackets) — Mosè Raguzzini, Feb 01 '19 at 13:28
@Mosè Raguzzini, a bracket access is done with `window.history[type]()` — jo_va, Feb 04 '19 at 21:56

score 5 · Accepted Answer · answered Feb 01 '19 at 13:11

5

This is property/method access using bracket notation. In Javascript, you can access the properties of an object using the dot notation:

myObj.prop

Or the bracket notation:

myObj['prop']

When you dynamically construct the properties, however, you have no choice but to use bracket notation:

window.history['forward']()

is the same as

window.history.forward()

Here you are iterating on the forward and back properties, and the bracket notation is used to call the functions from their string names on window.history.

Here is the doc linked by @Teemu

answered Feb 01 '19 at 13:11

jo_va

13,504
3
23
47

There is no var to access to with square bracket notation in example code, so as is, it is an array with a forEach loop. – Mosè Raguzzini Feb 01 '19 at 13:18
2

I think the question was about the access done on `window.history`, which holds the `forward` and `back` functions() called by `window.history[type]()`, is there something I didn't interpret well? – jo_va Feb 01 '19 at 13:21
2

No they missed it. Don't worry, your answer is fine. – Kaiido Feb 01 '19 at 13:24
1

>Here you are iterating on the `forward` and `back` properties, and the bracket notation is used to call the functions from their string names on `window.history`. I finally understood what this code is doing after reading your answer. Thanks so much! – Yuko Kasahara Feb 14 '19 at 05:17

What is this "[]" here doing?

1 Answers1