Waardes uit array JavaScript d.m.v. key
In Javascript heb ik de volgende array:
Code (php)
1
2
3
4
5
6
7
2
3
4
5
6
7
var text_array = new Array();
var text = {
value:document.querySelector('#input').value,
color: '#ccc',
}
textObjects.push(text_array);
var text = {
value:document.querySelector('#input').value,
color: '#ccc',
}
textObjects.push(text_array);
Nu wil ik een bepaalde waarde uit deze array hebben (eerste item), als voorbeeld wil ik de 'value' hebben.
var text = text_array[0];
console.log(text);
In de console.log zie ik {value: "Hallo", color: "#ccc"}
Maar als ik console.log(text.value), of console.log(text["value"]) gebruikt, is er de volgende error "undefined is not an object (evaluating 'text.value')"
Hoe kan ik deze waarde eruit krijgen op key?
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
<input id="input" type="text" name="text" value="Kleurloos" />
<script>
var textObjects = new Array();
var text_array = new Array();
var text_array = {
value:document.querySelector('#input').value,
color: '#ccc'
}
textObjects.push(text_array);
console.log(textObjects);
console.log(text_array);
console.log(text_array.value);
console.log(text_array.color);
console.log(text_array["value"]);
console.log(text_array["color"]);
</script>
<script>
var textObjects = new Array();
var text_array = new Array();
var text_array = {
value:document.querySelector('#input').value,
color: '#ccc'
}
textObjects.push(text_array);
console.log(textObjects);
console.log(text_array);
console.log(text_array.value);
console.log(text_array.color);
console.log(text_array["value"]);
console.log(text_array["color"]);
</script>
Je kunt in JavaScript de korte array notatie gebruiken, net als in PHP:
Code (php)
1
var my_array = [];
Het is het beste om één stijl van naamgeving te gebruiken, dus niet snake_case en camelCase door elkaar:
Code (php)
1
2
2
var text_array;
var textObject;
var textObject;
Werkend voorbeeld:
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title></title>
</head>
<body>
<input type="text" id="input" value="phphulp">
<script>
var text_array = [];
var text_object = {
value: document.querySelector('#input').value,
color: '#ccc'
}
text_array.push(text_object);
console.log(text_array);
console.log(text_array[0]);
console.log(text_array[0].value); // Waarschijnlijk bedoelde je deze?
console.log(text_array[0].color);
console.log(text_object);
console.log(text_object.value);
console.log(text_object.color);
console.log(text_object['value']);
console.log(text_object['color']);
</script>
</body>
</html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title></title>
</head>
<body>
<input type="text" id="input" value="phphulp">
<script>
var text_array = [];
var text_object = {
value: document.querySelector('#input').value,
color: '#ccc'
}
text_array.push(text_object);
console.log(text_array);
console.log(text_array[0]);
console.log(text_array[0].value); // Waarschijnlijk bedoelde je deze?
console.log(text_array[0].color);
console.log(text_object);
console.log(text_object.value);
console.log(text_object.color);
console.log(text_object['value']);
console.log(text_object['color']);
</script>
</body>
</html>
Gewijzigd op 21/05/2022 13:49:27 door Jan Koehoorn