JavaScript calling array values in two different contexts - javascript

I am having trouble understanding how to call specific array values:
I have commented out the questions in the code. Please take a look and let me know why the array produces one result within the function, while producing a different result outside of it. To run the code, please use a website like repl.it
var passengers = [ ["Thomas", "Meeks"],
["Gregg", "Pollack"],
["Christine", "Wong"],
["Dan", "McGaw"] ];
var results = passengers.map(function (array) {
// The following prints out the first names--the entire first column. Why?
console.log(array[0]);
});
console.log(); // Just empty space
// Why is the following only printin the first row of passengers (which it should), but the array[0] printed out the entirety of the first column?
console.log(passengers[0]);

You have an array of arrays, so when you call map here:
var results = passengers.map(function (array) {
// The following prints out the first names--the entire first column. Why?
console.log(array[0]);
});
It's looping through the outer array. The parameter that gets passed into the function is the element of the array that you're looping through, in this case, the inner array. So the console.log(array[0]) is printing the first element of the inner array.
In other words, this code is roughly equivalent to:
console.log(passengers[0][0]);
console.log(passengers[1][0]);
console.log(passengers[2][0]);
console.log(passengers[3][0]);
Notice that in this example, I'm only iterating through the outer array (the first index). The inner array index stays at zero.
But later where you have
console.log(passengers[0]);
It's simply printing the first element from the outer array, which is the entire first inner array.
Further Reading
Array
Array.prototype.map()

Related

Multiple arrays inside a array in javascript

when i do console.log(myArray) I obtain this:
console.log result
I want to take a value inside only one of this arrays, but how? When i do console.log(array[0]) I obtain this result:
37.7
28.45
36.38
You have nested arrays. So your main array has three elements each of which contains one number, and the indexes of those arrays go from 0 to 2.
You access each nested array with its index, and then access the number with the 0 index (because there's only one element in that nested array).
const arr = [[37.7], [28.45], [36.38]];
console.log(arr[0][0]);
console.log(arr[1][0]);
console.log(arr[2][0]);
Or even loop over the array and destructure the number from each nested array:
const arr = [[37.7], [28.45], [36.38]];
for (let [number] of arr) {
console.log(number);
}
From what I can see in the original question so far, the output of this function is actually three different console.log() executions, which leads me to believe that whatever is firing these console.logs is actually running in some sort of loop.
If that is the case, you will not be able to pull just one value out to simply. The screenshot you added only shows the output. Could you please add the code for (or screenshot of) all the related code from setting up or fetching the array, to your console.log? With all that context, I can rewrite my answer to get you the exact answer you are looking for.
Please compare your code with this working example:
let myArray = [37.7, 28.45, 36.38];
console.log(myArray[0]); // outputs 37.7

Pushing simple value into an array on the fly

I want to be able to create an array with only one value inside of it on the fly without using a variable. This works with a variable:
var arr = [];
arr.push('test');
console.log(arr); // correctly logs ["test"]
But this does not:
console.log([].push('test')); // logs 1
Why does this log 1 instead of ["test"]? Is this coerced into a boolean?
Array.prototype.push returns the new length of the array, not the pushed item nor the array it-self.
"I want to be able to create an array with only one value inside of it
on the fly without using a variable"
const arr = ['test'];
console.log(['test']);
Array.prototype.push()
The push() method adds one or more elements to the end of an array and returns the new length of the array.
In the first example you are first pushing the element in the array then log the array. But in the second example you are logging the returned result of push().

How to push data to specific sub-array in an empty 2-dimensional array

I'm trying to setup a 2-d array, which should receive values at specific sub-arrays. I created my array with:
myArray= Array(100).fill([])
Now, let's say I want to push a value to say sub-array number 40
I'm doing this like that:
myArray[40].push("myValue")
I would expect the value to be pushed only to the myArray[40] instead it is pushed as the first element of every of the hundred sub-arrays.
I searched for the solution for quite some time, but I still have no idea what I'm doing wrong. Please help.
fill will push the same value to each element, not a copy of it. That's fine when it's a number or string or something else immutable. But now each copy is a reference to the same object.
There are a number of ways to fix this. Here's one (switched to ten elements for demonstration):
const myArray = [...Array(10)].map((_, i) => [])
myArray[4].push('myValue')
console.log(myArray)

Javascript slice isn't giving me correct array length values

Why does it say length 1 instead of 4?
The following is what I'm trying to push and slice. I try and append items.image_urls and slice them into 5 each.
items.image_urls is my dictionary array.
var final_push = []
final_push.push(items.image_urls.splice(0,5))
console.log(final_push.length)## gives me 1...?
var index = 0
final_push.forEach(function(results){
index++ ##this gives me one. I would need 1,2,3,4,5,1,2,3,4,5. Somehting along that.
}
items.image_urls looks like this:
It's an iteration of arrays with image urls.
In your example items.image_urls.splice(0,5) returns an array of items removed from items.image_urls. When you call final_push.push(items.image_urls.splice(0,5));, this whole array is pushed as one item to the final_push array, so it now looks like [["url1", "url2", "url3", "url4", "url5"]] (2-dimensional array). You can access this whole array by calling final_push[some_index].
But what you want instead is to add every element of items.image_urls.splice(0,5) to the final_push. You can use a spread operator to achieve this:
final_push.push(...items.image_urls.splice(0,5));
Spread syntax allows an iterable such as an array expression or string
to be expanded in places where zero or more arguments (for function
calls) or elements (for array literals) are expected
This is exactly our case, because push() expects one or more arguments:
arr.push(element1[, ...[, elementN]])
And here is an example:
let items = {
image_urls: ["url1", "url2", "url3", "url4", "url5", "url6", "url7", "url8", "url9", "url10"]
};
let final_push = [];
final_push.push(...items.image_urls.splice(0,5));
console.log(final_push.length);
console.log(JSON.stringify(final_push));
console.log(JSON.stringify(items.image_urls));
Note: do not confuse Array.prototype.slice() with Array.prototype.splice() - the first one returns a shallow copy of a portion of an array into a new array object while the second changes the contents of an array by removing existing elements and/or adding new elements and returns an array containing the deleted elements.
That seems to be a nested array. So if you would access index 0, and then work on that array like below it will probably work:
console.log(final_push[0].length); //should print 4
The author is mixing up splice and slice. Probably a typo :)
You start at the beginning (0) and then delete 5 items.

Pass values from observableArray to another without referencing to each other

I'm trying to pass values from one observableArray to another one without a reference to each other, right know if I change one of the observable array values they synchronize and both have the same value.
Here is jsFiddle
JavaScript:
var test = ko.observableArray([1, 2, 3]);
var test2 = ko.observableArray(test());
test2()[0] = 2;
console.log(test());
console.log(test2());
Output:
[2,2,3]
[2,2,3]
Expected:
[1,2,3]
[2,2,3]
Try doing this:
var test2 = ko.observableArray(test().slice(0));
Instead of this:
var test2 = ko.observableArray(test());
This is a simple way of creating a clone of the underlying array; right now you're referencing the same array.
The slice function basically selects the elements starting at the given index (0 in this case) and ends at the end of the array's length (since it isn't specified) as a new array.
From KnockoutJS:
The slice function is the observableArray equivalent of the native
JavaScript slice function (i.e., it returns the entries of your array
from a given start index up to a given end index). Calling
myObservableArray.slice(...) is equivalent to calling the same method
on the underlying array (i.e., myObservableArray().slice(...)).
Here's an update to your JSFiddle.

Categories

Resources