:chap_num: 4

:prev_link: 03_functions

:next_link: 05_higher_order

:load_files: ["code/jacques_journal.js", "code/chapter/04_data.js"]

:zip: node/html

= Estructuras de Datos: Objetos y Arreglos =

[chapterquote="true"]

[quote, Charles Babbage, Passages from the Life of a Philosopher (1864)]

____

En dos ocasiones me preguntaron - “Disculpe, Sr. Babbage, si pongo

números incorrectos en la máquina, ¿van a salir las respuestas correctas?”

[...] No puedo terminar de comprender el tipo de confusión de ideas que

podrían provocar esta pregunta.

____

(((Babbage+++,+++ Charles)))(((object)))(((data structure)))Números, Booleanos

y cadenas son los ladrillos de los que están hechas las estructuras de ((datos)).

Pero no podrás construir mucha casa de un solo ladrillo. Los _objetos_ nos

permiten agrupar valores-incluyendo otros objetos-permitiéndonos construir

estructuras más complejas.

Los programas que hemos construido hasta ahora han sido seriamente limitados

debido al hecho de que estaban operando únicamente en tipos de datos simples. Este

capítulo agregará a tu caja de herramientas un entendimiento básico de las

estructuras de datos. Al finalizarlo, sabrás lo suficiente para empezar a escribir

algunos programas de utilidad.

El capítulo trabajará a lo largo de un ejemplo de programación más o menos

realista, introduciendo conceptos conforme apliquen al problema en cuestión.

El código de ejemplo muchas veces construirá sobre funciones y variables que

fueron presentadas previamente en el texto.

ifdef::book_target[]

(((sandbox)))El sandbox de programación en línea para el libro

(http://eloquentjavascript.net/code[_eloquentjavascript.net/code_])

proporciona una manera de correr el código en el contexto de un capítulo en

espacífico. Si decides trabajar en los ejemplos en otro entorno, asegúrate de

descargar primero el código completo de este capítulo desde la página del

sandbox.

endif::book_target[]

== La ardillalobo ==

(((weresquirrel example)))(((lycanthropy)))De vez en cuando, comúnmente

entre las ocho y las diez de la noche, ((Jacques)) se transforma en

un pequeño y peludo roedor con una frondosa cola.

Por un lado, Jacques esta bastante contento de no tener la clásica licantropía.

Convertirse en una ardilla suele causar menos problemas que convertirse en un

lobo. En vez de tener que preocuparse por comerse accidentalmente a un vecino

(_eso_ sería extraño), le preocupa el ser deborado por el gato del vecino.

Después de un par de ocasiones donde se despertó, desnudo y desorientado, en una

apenas delgada rama en la cima de un roble, se ha asegurado de cerrar puertas y

ventanas de su cuarto por las noches y ponear algunas nueces en el suelo para

mantenerse ocupado.

image::img/weresquirrel.png[alt="The weresquirrel"]

Eso resuelve los problemas del gato y el roble. Pero Jacques aún sufre de su

enfermedad. Los momentos irregular en que se presenta la transformación le hacen

sospechar que pudieran ser detonadas por algo. Por algún tiempo, creyó que

sucedía sólo en los dias que había tocado árboles. Así que dejó de tocar árboles

de manera definitiva e incluso evitó acercarse a ellos. Pero el problema

presistió.

(((journal)))Cambiando a una perspectiva un poco más científica, Jacques planea

empezar un registro diario de todo lo que hizo ese día y si tuvo o no una

transformación. Con estos datos espera limitar las condiciones que disparan las

transformaciones.

La primer cosa que hace es diseñar una estructura de datos para almacenar esta

información.

== Conjuntos de datos ==

(((data structure)))Para trabajar con un pedazo de datos digitales, primero

tendremos que encontrar una forma de representarlo en la ((memoria)) de nuestra

máquina.Digamos, como un pequeño ejemplo, que queremos representar una

((colección)) de números: 2, 3, 5, 7 y 11.

(((string)))Podríamos ponernos creativos usando cadenas-despues de todo, las

cadenas pueden ser de cualquier longitud, así que podríamos pone mucha

información en ellas-y usar `"2 3 5 7 11"` como nuestra representación. Pero

esto es extaño. De alguna forma tendrías que extaer los dígitos y convertirlos

de vuelta a números para accesarlos.

(((array,creation)))((([] (array))))Afortunadamente, Javascript proporciona un

tipo de dato específico para almacenar secuencias de valores. Se le llama

_arreglo_ y se escribe como una lista de valores entre ((corchetes)), separados

por comas.

[source,javascript]

----

var listOfNumbers = [2, 3, 5, 7, 11];

console.log(listOfNumbers[1]);

// → 3

console.log(listOfNumbers[1 - 1]);

// → 2

----

((([] (subscript))))(((array,indexing)))La notación para obtener los elementos

dentro de un arreglo también utiliza ((corchetes)). Un par de corchetes

inmediátamente después de una expresión, con otra expresión dentro de los

corchetes. buscará el elemento en la expresión de la izquierda que corresponda

al _((índice))_ dado por la expresión en corchetes.

[[array_indexing]]

El primer índice de un arreglo es cero, no uno. Así que el primer elemento puede

leerse usando `listOfNumbers[0]`. Si no tienes antecedentes en programación,

acostumbrarte a esta convención puede tomarte algún tiempo. Pero el

((zero-based counting)) tiene una larga tradición en tecnología y mientras la

convención se siga de manera consistente (que se ha hecho, en Javascript),

funciona bien.

[[properties]]

== Propiedades ==

(((Math object)))(((Math.max function)))(((length property,for

string)))(((object,property)))(((period character)))Hemos visto algunas expresiones

sospechosas como `myString.length` (para obtener la longitud de una cadena) y

`Math.max` (la función máximo) en ejemplos pasados. Estas son expresiones que

accesan una _((propiedad))_ de algún valor. En el primer caso, accesamos la

propiedad `length` de el valor en `myString`. En el segundo, accesamos la

propiedad llamada `max` en el objeto `Math` (que es una colección de valores y

funciones relacionadas con las matemáticas).

(((property)))(((null)))(((undefined)))Casi todos los valores de Javascript tienen

propiedades. Las excepciones son `null` y `undefined`. Si intentas acceder una

propiedad de alguno de estos nonvalues, recibirás un error.

// test: no

[source,javascript]

----

null.length;

// → TypeError: Cannot read property 'length' of null

----

indexsee:[dot character,period character]

((([] (subscript))))(((period character)))(((square

brackets)))(((computed property)))Las dos maneras comúnes de accesar propiedades

en Javascript es con un punto y con corchetes. Ambas `value.x` y `value[x]`

accesan una ((propiedad)) en ++value++—pero no necesariamente la misma propiedad.

La diferencia radica en cómo se interpreta `x`. Cuando usamos un punto, la parte

después del punto debe ser un nombre de variable válido y nombra de maner a

directa a la propiedad. Cuando usamos corchetes, la expresión dentro de los

corchetes es _evaluada_ para obtener el nombre de la propiedad. Mientras que

`value.x` busca la propiedad de `value` llamada “x”, `value[x]` intenta evaluar

la expresión `x` y usa el resultado como el nombre de la propiedad.

Así que si sabes que la propiedad que te interesa se llama “length”, usas

`value.length`. Si deseas extraer la propiedad nombrada por el valor almacenado

en la variable`i`, usas `value[i]`. Y debido a que el nombre de las propiedades

puede ser cualquier cadena, si quieres accesar una propiedad llamada “2” o

“John Doe”, debes utilizar corchetes:`value[2]` or `value["John Doe"]`. Así lo

harías incluso si conoces el nombre preciso de la propiedad de antemano, ya que

ni “2” ni “John Doe” son nombres válidos de variables y por lo tanto no pueden

accesarse a traves de la notación con punto.

(((array)))(((length property,for array)))(((array,length

of)))Los elementos en un arreglo se almacenan en propiedades. Debido a que los

nombres de estas propiedades son números y usualmente necesitamos obtener su

nombre de una variable, tenemos que usar la sintaxis de corchetes para accesarlos.

La propiedad `length` de un arreglo nos dice cuantos elementos contiene. Este

nombre de propiedad es un nombre de variable válido, y conocemos su nombre por

anticipad, así que para encontrar la longitud de un arreglo, comúnmente

escribiremos `array.length` ya que es más fácil de escribir que `array["length"]`.

[[methods]]

== Métodos ==

(((function,as property)))(((method)))(((string)))Ambos objetos, las cadenas y

los arreglos contienen, adicionalmente a la propiedad `length`, un número de

propiedades que refieren a valores función.

[source,javascript]

----

var doh = "Doh";

console.log(typeof doh.toUpperCase);

// → function

console.log(doh.toUpperCase());

// → DOH

----

(((case conversion)))(((toUpperCase method)))(((toLowerCase

method)))Todas las cadenas tienen una propiedad `toUpperCase`. Cuando es llamada,

regresará una copia de la cadena en la que todas las letras han sido convertidas

a mayúsculas. También existe `toLowerCase`. Puedes adivinar que es lo que hace.

(((this)))Interestingly, even though the call to `toUpperCase` does

not pass any arguments, the function somehow has access to the string

`"Doh"`, the value whose property we called. How this works is

described in link:06_object.html#obj_methods[Chapter 6].

Properties that contain functions are generally called _methods_ of

the value they belong to. As in, “++toUpperCase++ is a method of a

string”.

[[array_methods]]

(((collection)))(((array)))(((string)))(((push

method)))(((pop method)))(((join method)))This example demonstrates

some methods that array objects have:

[source,javascript]

----

var mack = [];

mack.push("Mack");

mack.push("the", "Knife");

console.log(mack);

// → ["Mack", "the", "Knife"]

console.log(mack.join(" "));

// → Mack the Knife

console.log(mack.pop());

// → Knife

console.log(mack);

// → ["Mack", "the"]

----

The `push` method can be used to add values to the end of an array.

The `pop` method does the opposite: it removes the value at the end of

the array and returns it. An array of strings can be flattened to a

single string with the `join` method. The argument given to `join`

determines the text that is glued between the array's elements.

== Objects ==

(((journal)))(((weresquirrel example)))(((array)))(((record)))Back to the weresquirrel. A set of daily log

entries can be represented as an array. But the entries do not consist

of just a number or a string—each entry needs to store a list of

activities and a Boolean value that indicates whether Jacques turned

into a squirrel. Ideally, we would like to group these values together

into a single value and then put these grouped values into an array of

log entries.

(((syntax)))(((object)))(((property)))(((curly braces)))((({}

(object))))Values of the type _object_ are arbitrary collections of

properties, and we can add or remove these properties as we please.

One way to create an object is by using a curly brace notation.

[source,javascript]

----

var day1 = {

squirrel: false,

events: ["work", "touched tree", "pizza", "running",

"television"]

};

console.log(day1.squirrel);

// → false

console.log(day1.wolf);

// → undefined

day1.wolf = false;

console.log(day1.wolf);

// → false

----

(((quoting,of object properties)))(((colon character)))Inside the

curly braces, we can give a list of properties separated by commas.

Each property is written as a name, followed by a colon, followed by

an expression that provides a value for the property. Spaces and line

breaks are not significant. When an object spans multiple lines,

indenting it like in the previous example improves readability.

Properties whose names are not valid variable names or valid numbers

have to be quoted.

[source,javascript]

----

var descriptions = {

work: "Went to work",

"touched tree": "Touched a tree"

};

----

This means that ((curly braces)) have _two_ meanings in JavaScript. At

the start of a statement, they start a block of statements. In any

other position, they describe an object. Fortunately, it is almost

never useful to start a statement with a curly-brace object, and in

typical programs, there is no ambiguity between these two uses.

(((undefined)))Reading a property that doesn't exist will produce the

value `undefined`, which happens the first time we try to read the `wolf`

property in the previous example.

(((property,assignment)))(((mutability)))(((= operator)))It is

possible to assign a value to a property expression with the `=`

operator. This will replace the property's value if it already existed

or create a new property on the object if it didn't.

(((tentacle (analogy))))(((property,model of)))To briefly return to

our tentacle model of ((variable)) bindings—property bindings are

similar. They _grasp_ values, but other variables and properties might

be holding onto those same values. You may think of objects as

octopuses with any number of tentacles, each of which has a name

inscribed on it.

image::img/octopus-object.jpg[alt="Artist's representation of an object"]

(((delete operator)))(((property,deletion)))The `delete` operator cuts

off a tentacle from such an octopus. It is a unary operator that, when

applied to a property access expression, will remove the named

property from the object. This is not a common thing to do, but it is

possible.

[source,javascript]

----

var anObject = {left: 1, right: 2};

console.log(anObject.left);

// → 1

delete anObject.left;

console.log(anObject.left);

// → undefined

console.log("left" in anObject);

// → false

console.log("right" in anObject);

// → true

----

(((in operator)))(((property,testing for)))(((object)))The binary

`in` operator, when applied to a string and an object, returns a

Boolean value that indicates whether that object has that property.

The difference between setting a property to `undefined` and actually

deleting it is that, in the first case, the object still _has_ the

property (it just doesn't have a very interesting value), whereas in

the second case the property is no longer present and `in` will return

`false`.

(((array)))(((collection)))Arrays, then, are just a kind of

object specialized for storing sequences of things. If you evaluate

`typeof [1, 2]`, this produces `"object"`. You can see them as long,

flat octopuses with all their arms in a neat row, labeled with

numbers.

image::img/octopus-array.jpg[alt="Artist's representation of an array"]

(((journal)))(((weresquirrel example)))So we can represent Jacques’

journal as an array of objects.

[source,javascript]

----

var journal = [

{events: ["work", "touched tree", "pizza",

"running", "television"],

squirrel: false},

{events: ["work", "ice cream", "cauliflower",

"lasagna", "touched tree", "brushed teeth"],

squirrel: false},

{events: ["weekend", "cycling", "break",

"peanuts", "beer"],

squirrel: true},

/* and so on... */

];

----

== Mutability ==

We will get to actual programming _real_ soon now. But first, there's

one last piece of theory to understand.

(((mutability)))(((side effect)))(((number)))(((string)))(((Boolean)))(((object)))We've seen that object

values can be modified. The types of values discussed in earlier

chapters, such as numbers, strings, and Booleans, are all

__immutable__—it is impossible to change an existing value of those

types. You can combine them and derive new values from them, but when

you take a specific string value, that value will always remain the

same. The text inside it cannot be changed. If you have reference to a

string that contains `"cat"`, it is not possible for other code to

change a character in _that_ string to make it spell `"rat"`.

With objects, on the other hand, the content of a value _can_ be

modified by changing its properties.

(((object,identity)))(((identitiy)))(((memory)))When we have two

numbers, 120 and 120, we can consider them precisely the same number,

whether or not they refer to the same physical bits. But with objects,

there is a difference between having two references to the same object

and having two different objects that contain the same properties.

Consider the following code:

[source,javascript]

----

var object1 = {value: 10};

var object2 = object1;

var object3 = {value: 10};

console.log(object1 == object2);

// → true

console.log(object1 == object3);

// → false

object1.value = 15;

console.log(object2.value);

// → 15

console.log(object3.value);

// → 10

----

(((tentacle (analogy))))(((variable,model of)))The `object1` and

`object2` variables grasp the _same_ object, which is why changing

`object1` also changes the value of `object2`. The variable `object3`

points to a different object, which initially contains the same

properties as `object1` but lives a separate life.

(((== operator)))(((comparison,of objects)))(((deep

comparison)))JavaScript's `==` operator, when comparing objects, will

return `true` only if both objects are precisely the same value.

Comparing different objects will return `false`, even if they have

identical contents. There is no “deep” comparison operation built into

JavaScript, which looks at object's contents, but it is possible to

write it yourself (which will be one of the

link:04_data.html#exercise_deep_compare[exercises] at the end of this

chapter).

== The lycanthrope's log ==

(((weresquirrel example)))(((lycanthropy)))(((addEntry function)))So

Jacques starts up his JavaScript interpreter and sets up the

environment he needs to keep his ((journal)).

// include_code

[source,javascript]

----

var journal = [];

function addEntry(events, didITurnIntoASquirrel) {

journal.push({

events: events,

squirrel: didITurnIntoASquirrel

});

}

----

And then, every evening at ten—or sometimes the next morning, after

climbing down from the top shelf of his bookcase—he records the day.

[source,javascript]

----

addEntry(["work", "touched tree", "pizza", "running",

"television"], false);

addEntry(["work", "ice cream", "cauliflower", "lasagna",

"touched tree", "brushed teeth"], false);

addEntry(["weekend", "cycling", "break", "peanuts",

"beer"], true);

----

Once he has enough data points, he intends to compute the

((correlation)) between his squirrelification and each of the day's

events and ideally learn something useful from those correlations.

(((correlation)))_Correlation_ is a measure of ((dependence)) between

((variable))s (“variables” in the statistical sense, not the

JavaScript sense). It is usually expressed as a coefficient that

ranges from -1 to 1. Zero correlation means the variables are not

related, whereas a correlation of one indicates that the two are

perfectly related—if you know one, you also know the other. Negative

one also means that the variables are perfectly related but that they

are opposites—when one is true, the other is false.

(((phi coefficient)))For binary (Boolean) variables, the _phi_

coefficient (_ϕ_) provides a good measure of correlation and is

relatively easy to compute. To compute _ϕ_, we need a ((table)) _n_

that contains the number of times the various combinations of the two

variables were observed. For example, we could take the event of

eating ((pizza)) and put that in a table like this:

image::img/pizza-squirrel.svg[alt="Eating pizza versus turning into a squirrel",width="7cm"]

_ϕ_ can be computed using the following formula, where _n_ refers to the table:

ifdef::html_target[]

++++

<div>

<style scoped="scoped">sub { font-size: 60%; }</style>

<table style="border-collapse: collapse; margin-left: 1em;"><tr>

<td style="vertical-align: middle"><em>ϕ</em> =</td>

<td style="padding-left: .5em">

<div style="border-bottom: 1px solid black; padding: 0 7px;">n₁₁n₀₀ - n₁₀n₀₁</div>

<div style="padding: 0 7px;">√<span style="border-top: 1px solid black; position: relative; top: 2px;">

<span style="position: relative; top: -4px">n_1•n_0•n_•1n_•0</span>

</span></div>

</td>

</tr></table>

</div>

++++

endif::html_target[]

ifdef::tex_target[]

pass:[\begin{equation}\varphi = \frac{n_{11}n_{00}-n_{10}n_{01}}{\sqrt{n_{1\bullet}n_{0\bullet}n_{\bullet1}n_{\bullet0}}}\end{equation}]

endif::tex_target[]

The notation (!html _n_~01~!)(!tex pass:[$n_{01}$]!) indicates the

number of measurements where the first variable (squirrelness) is false

(0) and the second variable (pizza) is true (1). In this

example, (!html _n_~01~!)(!tex pass:[$n_{01}$]!) is 9.

The value (!html _n_~1•~!)(!tex pass:[$n_{1\bullet}$]!) refers to the

sum of all measurements where the first variable is true, which is 5

in the example table. Likewise, (!html _n_~•0~!)(!tex pass:[$n_{\bullet0}$]!)

refers to the sum of the measurements where the second variable is false.

(((correlation)))(((phi coefficient)))So for the pizza table, the part

above the division line (the dividend) would be 1×76 - 4×9 = 40, and

the part below it (the divisor) would be the square root of

5×85×10×80, or (!html √340000!)(!tex pass:[$\sqrt{340000}$]!). This

comes out to _ϕ_ ≈ 0.069, which is tiny. Eating ((pizza)) does not

appear to have influence on the transformations.

== Computing correlation ==

(((array,as table)))(((nesting,of arrays)))We can represent a

two-by-two ((table)) in JavaScript with a four-element array (`[76, 9,

4, 1]`). We could also use other representations, such as an array

containing two two-element arrays (`[[76, 9], [4, 1]]`) or an object

with property names like `"11"` and `"01"`, but the flat array is

simple and makes the expressions that access the table pleasantly

short. We'll interpret the indices to the array as two-((bit))

((binary number)), where the leftmost (most significant) digit refers

to the squirrel variable and the rightmost (least significant) digit

refers to the event variable. For example, the binary number `10`

refers to the case where Jacques did turn into a squirrel, but the

event (say, "pizza") didn't occur. This happened four times. And since

binary `10` is 2 in decimal notation, we will store this number at

index 2 of the array.

(((phi coefficient)))(((phi function)))This is the function that

computes the _ϕ_ coefficient from such an array:

// test: clip

// include_code strip_log

[source,javascript]

----

function phi(table) {

return (table[3] * table[0] - table[2] * table[1]) /

Math.sqrt((table[2] + table[3]) *

(table[0] + table[1]) *

(table[1] + table[3]) *

(table[0] + table[2]));

}

console.log(phi([76, 9, 4, 1]));

// → 0.068599434

----

(((square root)))(((Math.sqrt function)))This is simply a direct

translation of the _ϕ_ formula into JavaScript. `Math.sqrt` is the

square root function, as provided by the `Math` object in a standard

JavaScript environment. We have to sum two fields from the table to

get fields like (!html n~1•~!)(!tex pass:[$n_{1\bullet}$]!) because

the sums of rows or columns are not stored directly in our data

structure.

(((JOURNAL data set)))Jacques kept his journal for three months. The

resulting ((data set)) is available in the coding sandbox for this

chapter(!book (http://eloquentjavascript.net/code#4[_eloquentjavascript.net/code#4_])!),

where it is stored in the `JOURNAL` variable, and in a downloadable

http://eloquentjavascript.net/code/jacques_journal.js[file].

(((tableFor function)))(((hasEvent function)))To extract a two-by-two

((table)) for a specific event from this journal, we must loop over

all the entries and tally up how many times the event occurs in

relation to squirrel transformations.

// include_code strip_log

[source,javascript]

----

function hasEvent(event, entry) {

return entry.events.indexOf(event) != -1;

}

function tableFor(event, journal) {

var table = [0, 0, 0, 0];

for (var i = 0; i < journal.length; i++) {

var entry = journal[i], index = 0;

if (hasEvent(event, entry)) index += 1;

if (entry.squirrel) index += 2;

table[index] += 1;

}

return table;

}

console.log(tableFor("pizza", JOURNAL));

// → [76, 9, 4, 1]

----

(((array,searching)))(((indexOf method)))The `hasEvent` function tests

whether an entry contains a given event. Arrays have an `indexOf`

method that tries to find a given value (in this case, the event name)

in the array and returns the index at which it was found or -1 if it

wasn't found. So if the call to `indexOf` doesn't return -1, then we

know the event was found in the entry.

(((array,indexing)))The body of the loop in `tableFor` figures

out which box in the table each journal entry falls into by checking

whether the entry contains the specific event it's interested in and

whether the event happens alongside a squirrel incident. The loop then

adds one to the number in the array that corresponds to this box on

the table.

We now have the tools we need to compute individual ((correlation))s.

The only step remaining is to find a correlation for every type of

event that was recorded and see whether anything stands out. But how

should we store these correlations once we compute them?

== Objects as maps ==

(((weresquirrel example)))(((array)))One possible way is to store

all the ((correlation))s in an array, using objects with `name` and

`value` properties. But that makes looking up the correlation for a

given event somewhat cumbersome: you'd have to loop over the whole

array to find the object with the right `name`. We could wrap this

lookup process in a function, but we would still be writing more code,

and the computer would be doing more work than necessary.

[[object_map]]

(((object)))(((square brackets)))(((object,as map)))(((in

operator)))A better way is to use object properties named after the

event types. We can use the square bracket access notation to create

and read the properties and can use the `in` operator to test whether

a given property exists.

[source,javascript]

----

var map = {};

function storePhi(event, phi) {

map[event] = phi;

}

storePhi("pizza", 0.069);

storePhi("touched tree", -0.081);

console.log("pizza" in map);

// → true

console.log(map["touched tree"]);

// → -0.081

----

(((data structure)))A _((map))_ is a way to go from values in one

domain (in this case, event names) to corresponding values in another

domain (in this case, _ϕ_ coefficients).

There are a few potential problems with using objects like this, which

we will discuss in link:06_object.html#prototypes[Chapter 6], but for

the time being, we won't worry about those.

(((for/in loop)))(((for loop)))(((object,looping over)))What if

we want to find all the events for which we have stored a coefficient?

The properties don't form a predictable series, like they would in an

array, so we cannot use a normal `for` loop. JavaScript provides a

loop construct specifically for going over the properties of an

object. It looks a little like a normal `for` loop but distinguishes

itself by the use of the word `in`.

[source,javascript]

----

for (var event in map)

console.log("The correlation for '" + event +

"' is " + map[event]);

// → The correlation for 'pizza' is 0.069

// → The correlation for 'touched tree' is -0.081

----

[[analysis]]

== The final analysis ==

(((journal)))(((weresquirrel example)))(((gatherCorrelations

function)))To find all the types of events that are present in the

data set, we simply process each entry in turn and then loop over the

events in that entry. We keep an object `phis` that has correlation

coefficients for all the event types we have seen so far. Whenever we

run across a type that isn't in the `phis` object yet, we compute its

correlation and add it to the object.

// test: clip

// include_code strip_log

[source,javascript]

----

function gatherCorrelations(journal) {

var phis = {};

for (var entry = 0; entry < journal.length; entry++) {

var events = journal[entry].events;

for (var i = 0; i < events.length; i++) {

var event = events[i];

if (!(event in phis))

phis[event] = phi(tableFor(event, journal));

}

}

return phis;

}

var correlations = gatherCorrelations(JOURNAL);

console.log(correlations.pizza);

// → 0.068599434

----

(((correlation)))Let's see what came out.

// test: no

[source,javascript]

----

for (var event in correlations)

console.log(event + ": " + correlations[event]);

// → carrot: 0.0140970969

// → exercise: 0.0685994341

// → weekend: 0.1371988681

// → bread: -0.0757554019

// → pudding: -0.0648203724

// and so on...

----

(((for/in loop)))Most correlations seem to lie close to zero. Eating

carrots, bread, or pudding apparently does not trigger

squirrel-lycanthropy. It _does_ seem to occur somewhat more often on

weekends, however. Let's filter the results to show only correlations

greater than 0.1 or less than -0.1.

// start_code

// test: no

[source,javascript]

----

for (var event in correlations) {

var correlation = correlations[event];

if (correlation > 0.1 || correlation < -0.1)

console.log(event + ": " + correlation);

}

// → weekend: 0.1371988681

// → brushed teeth: -0.3805211953

// → candy: 0.1296407447

// → work: -0.1371988681

// → spaghetti: 0.2425356250

// → reading: 0.1106828054

// → peanuts: 0.5902679812

----

A-ha! There are two factors whose ((correlation)) is clearly stronger

than the others. Eating ((peanuts)) has a strong positive effect on

the chance of turning into a squirrel, whereas brushing his teeth has

a significant negative effect.

Interesting. Let's try something.

// include_code strip_log

[source,javascript]

----

for (var i = 0; i < JOURNAL.length; i++) {

var entry = JOURNAL[i];

if (hasEvent("peanuts", entry) &&

!hasEvent("brushed teeth", entry))

entry.events.push("peanut teeth");

}

console.log(phi(tableFor("peanut teeth", JOURNAL)));

// → 1

----

Well, that's unmistakable! The phenomenon occurs precisely when

Jacques eats ((peanuts)) and fails to brush his teeth. If only he

weren't such a slob about dental hygiene, he'd have never even noticed

his affliction.

Knowing this, Jacques simply stops eating peanuts altogether and finds

that this completely puts an end to his transformations.

(((weresquirrel example)))All is well with Jacques for a while. But a

few years later, he loses his ((job)) and is eventually forced to take

employment with a ((circus)), where he performs as _The Incredible

Squirrelman_ by stuffing his mouth with peanut butter before every

show. One day, fed up with this pitiful existence, Jacques fails to

change back into his human form, hops through a crack in the circus

tent, and vanishes into the forest. He is never seen again.

== Further arrayology ==

(((array,methods)))(((method)))Before finishing up this chapter,

I want to introduce you to a few more object-related concepts. We'll

start by introducing some generally useful array methods.

(((push method)))(((pop method)))(((shift method)))(((unshift

method)))We saw `push` and `pop`, which add and remove elements at the

end of an array, link:04_data.html#array_methods[earlier] in this

chapter. The corresponding methods for adding and removing things at

the start of an array are called `unshift` and `shift`.

[source,javascript]

----

var todoList = [];

function rememberTo(task) {

todoList.push(task);

}

function whatIsNext() {

return todoList.shift();

}

function urgentlyRememberTo(task) {

todoList.unshift(task);

}

----

(((task management example)))The previous program manages lists of

tasks. You add tasks to the end of the list by calling

`rememberTo("eat")`, and when you're ready to do something, you call

`whatIsNext()` to get (and remove) the front item from the list. The

`urgentlyRememberTo` function also adds a task but adds it to the

front instead of the back of the list.

(((array,searching)))(((indexOf method)))(((lastIndexOf

method)))The `indexOf` method has a sibling called `lastIndexOf`,

which starts searching for the given element at the end of the array

instead of the front.

[source,javascript]

----

console.log([1, 2, 3, 2, 1].indexOf(2));

// → 1

console.log([1, 2, 3, 2, 1].lastIndexOf(2));

// → 3

----

Both `indexOf` and `lastIndexOf` take an optional second argument that

indicates where to start searching from.

(((slice method)))(((array,indexing)))Another fundamental method

is `slice`, which takes a start index and an end index and returns an

array that has only the elements between those indices. The start

index is inclusive, the end index exclusive.

[source,javascript]

----

console.log([0, 1, 2, 3, 4].slice(2, 4));

// → [2, 3]

console.log([0, 1, 2, 3, 4].slice(2));

// → [2, 3, 4]

----

(((string,indexing)))When the end index is not given, `slice`

will take all of the elements after the start index. Strings also have

a `slice` method, which has a similar effect.

(((concatenation)))(((concat method)))The `concat` method can be used

to glue arrays together, similar to what the `+` operator does for

strings. The following example shows both `concat` and `slice` in

action. It takes an array and an index, and it returns a new array

that is a copy of the original array with the element at the given

index removed.

[source,javascript]

----

function remove(array, index) {

return array.slice(0, index)

.concat(array.slice(index + 1));

}

console.log(remove(["a", "b", "c", "d", "e"], 2));

// → ["a", "b", "d", "e"]

----

== Strings and their properties ==

(((string,properties)))We can read properties like `length` and

`toUpperCase` from string values. But if you try to add a new

property, it doesn't stick.

[source,javascript]

----

var myString = "Fido";

myString.myProperty = "value";

console.log(myString.myProperty);

// → undefined

----

Values of type string, number, and Boolean are not objects, and though

the language doesn't complain if you try to set new properties on

them, it doesn't actually store those properties. The values are

immutable and cannot be changed.

(((string,methods)))(((slice method)))(((indexOf

method)))(((string,searching)))But these types do have some built-in

properties. Every string value has a number of methods. The most

useful ones are probably `slice` and `indexOf`, which resemble the

array methods of the same name.

[source,javascript]

----

console.log("coconuts".slice(4, 7));

// → nut

console.log("coconut".indexOf("u"));

// → 5

----

One difference is that a string's `indexOf` can take a string

containing more than one character, whereas the corresponding array

method looks only for a single element.

[source,javascript]

----

console.log("one two three".indexOf("ee"));

// → 11

----

(((whitespace)))(((trim method)))The `trim` method removes whitespace

(spaces, newlines, tabs, and similar characters) from the start and

end of a string.

[source,javascript]

----

console.log(" okay \n ".trim());

// → okay

----

(((length property,for string)))(((charAt

method)))(((string,indexing)))We have already seen the string type's

`length` property. Accessing the individual characters in a string can

be done with the `charAt` method but also by simply reading numeric

properties, like you'd do for an array.

[source,javascript]

----

var string = "abc";

console.log(string.length);

// → 3

console.log(string.charAt(0));

// → a

console.log(string[1]);

// → b

----

[[arguments_object]]

== The arguments object ==

(((arguments object)))(((length

property)))(((parameter)))(((optional argument)))(((array-like

object)))Whenever a function is called, a special variable named

`arguments` is added to the environment in which the function body

runs. This variable refers to an object that holds all of the

arguments passed to the function. Remember that in JavaScript you are

allowed to pass more (or fewer) arguments to a function than the

number of parameters the function itself declares.

[source,javascript]

----

function noArguments() {}

noArguments(1, 2, 3); // This is okay

function threeArguments(a, b, c) {}

threeArguments(); // And so is this

----

(((length property)))The `arguments` object has a `length` property

that tells us the number of arguments that were really passed to the

function. It also has a property for each argument, named 0, 1, 2, and

so on.

indexsee:[pseudo array,array-like object]

(((array,methods)))If that sounds a lot like an array to you,

you're right, it _is_ a lot like an array. But this object,

unfortunately, does not have any array methods (like `slice` or

`indexOf`), so it is a little harder to use than a real array.

[source,javascript]

----

function argumentCounter() {

console.log("You gave me", arguments.length, "arguments.");

}

argumentCounter("Straw man", "Tautology", "Ad hominem");

// → You gave me 3 arguments.

----

(((journal)))(((console.log)))(((variadic function)))Some functions

can take any number of arguments, like `console.log`. These typically

loop over the values in their `arguments` object. They can be used to

create very pleasant interfaces. For example, remember how we created

the entries to Jacques’ journal.

[source,javascript]

----

addEntry(["work", "touched tree", "pizza", "running",

"television"], false);

----

Since he is going to be calling this function a lot, we could create

an alternative that is easier to call.

[source,javascript]

----

function addEntry(squirrel) {

var entry = {events: [], squirrel: squirrel};

for (var i = 1; i < arguments.length; i++)

entry.events.push(arguments[i]);

journal.push(entry);

}

addEntry(true, "work", "touched tree", "pizza",

"running", "television");

----