This question already has answers here:
Define an array with first element empty in JS [closed]
(2 answers)
Multiple assignment in JavaScript? What does `[ a, b, c ] = [ 1, 2, 3 ]` mean?
(4 answers)
Javascript. Assign array values to multiple variables? [duplicate]
(2 answers)
Closed 3 years ago.
I'm learning how to use Nuxt to build generate a static blog, and I came across the piece of code bellow to create the page containing a list of posts:
<script>
export default {
async asyncData() {
const resolve = require.context("~/content/", true, /\.md$/)
const imports = resolve.keys().map((key) => {
const [, name] = key.match(/\/(.+)\.md$/);
return resolve(key);
});
return {
posts: imports
}
},
}
</script>
I understand what it does: getting a list of all the markdown files and map their keys to the file's name, but I don't understand what const [, name] means, actually what the coma inside the array means.
can somebody explain it to me, please?
Thanks.
Noah
It's called array destructuring.
In your case const [, name] = key.match(/\/(.+)\.md$/); is the same as const name = key.match(/\/(.+)\.md$/)[1]
It means take the second value from the array returned by key.match and assign it to the variable name
const [a, b] = [123, 456];
console.log('a:', a, 'b:', b); // a = 123, b = 456
const [, d] = [111, 222];
console.log('d:', d); // d = 222
Related
This question already has answers here:
How to get the difference between two arrays in JavaScript?
(84 answers)
Closed 4 months ago.
In Javascript, I have this
var a = ["1","2","3"]
var b = ["3","4","5"]
assuming "b" reads "a" and removes the 3 because it is repeated, how can I get this?
var c = ["4","5"]
Thank You!
You can use set and spread operators.
set has property to have all unique value object.
Below we are using Set constructor passing values using spread operator and it return an object so to get an array we are again passing that object with spread operator.
let a = ["1", "2", "3"]
let b = ["3", "4", "5"]
let c = [...new Set([...a, ...b])];
console.log(c);
Check if value exists on another array using includes()
Docs: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/includes
You can remove values by using filter()
Docs: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/filter
To do what you want:
const a = ["1","2","3"]
const b = ["3","4","5"]
const c = b.filter((value) => !a.includes(value))
This has been answered before and is in detail: How to get the difference between two arrays in JavaScript?
This question already has answers here:
From an array of objects, extract value of a property as array
(24 answers)
How can I access and process nested objects, arrays, or JSON?
(31 answers)
Closed 6 months ago.
Im quite new to front-end development. I am using React.
My problem:
How to extract object value that are within array?
myArr = [[{a: 1, b: 2}], [{a: 1, b:2}], [{a: 1, b:2}]]
// I want to extract only the values of b and make them into array
// my asnwer should look like this:
// [2,2,2]
My Approach:
const [answerArr, setAnswerArr] = useState([]);
useEffect(() => {
const extractCode = () => {
const res = myArr.map((item)=>{
????
})
};
extractCode();
}, [codeArr]);
I've tried using map method...but I am struggling very much...
If you could help me i would learn so much!
Your code should look something like this
const res = myArr.map(item => item[0].b)
This question already has answers here:
Copy array items into another array
(19 answers)
Closed 2 years ago.
I have this:
z: [[res.push(this.Map.heatmap[0])]],
so this is just one value. But how can I push all the values of the array
and this is the interface:
export interface map {
}
I have a array of 100 values in it:
10
but if I do this:
this.Map().subscribe((res) => {
zsmooth: 'best'
}
],
not all the values are loaded. So how to load all the values?
and this is how I have the object:
Map: map = {};
Thank you
Oke,
console.log(res)
gives back array with 100 values:
length: 100
but apperently this:
z: [[res]],
doesn't work. I dont see the value at all.
But if I do this:
hallo: console.log(res.push(this.Map.map[0])),
z: [[res.push(this.cMap.tmap[0])]],
it returns the number 2
concat function is maybe what you are looking for:
var array1 = [A, B, C];
var array2 = [D, E, F];
var newArray = array1.concat(array2);
The newArray will be [A,B,C,D,E,F]
In your case you would do something like:
z = z.concat(this.cameraAgretateHeadMap.heatmap)
a little bit more code from your side would have been helpful to understand it in a better what your problem is!
Hopefully this helps!
This question already has answers here:
What is destructuring assignment and its uses?
(3 answers)
Closed 3 years ago.
I have set:
const [c, d ] = ["h", "i"]
in the browser console. It returns undefined.
After that, when I type c it returns "h",
and when I type d it returns "i".
To me it looks like an object where I have set the value of c and d according to ["h", "i"] 's order
I have been learning Javascript for the past 9 months. I am not sure what am I missing? Why it's behaving like this?
You are using destructuring - a great feature to directly get named access to nested properties of an Object or an Array:
const car= {
color: 'blue',
power: '120HP',
brand: 'an awesome one'
};
// Object Destructuring
const { colorOfCar, powerOfCar, brandOfCar} = car;
You are then directly able to work with each of these variable names.
It is more or less short for:
const colorOfCar = car.color;
const powerOfCar = car.power;
const brandOfCar = car.brand;
Hoping it is helpful!
Update:
An Array can be destructured the following way:
const rgb = [255, 200, 0];
// Array Destructuring
const [red, green, blue] = rgb;
Short for:
const red = rgb[0];
const green= rgb[1];
const blue= rgb[2];
You are using destructuring assignment. Then variable c = arr[0], d = arr[1]
If you need to copy array:
const newArr = arr.concat();
This statement
const [c, d ] = ["h", "i"]
is destructuring, which is not an array assignment. It doesn't read as
"an array having the elements c and d will be assigned the values of h
and i"
but it reads as
"The array having the values of h and i are destructured into
variables called c and d, respectively."
Hence, the result is not an array, nor an object, but two variables. You can use babeljs.io to check the equivalent of your code:
"use strict";
var c = "h",
d = "i";
If you are trying to set one array to equal another array all you need is:
const c = ["h", "i"];
const d = c;
This question already has answers here:
What is SpreadElement in ECMAScript documentation? Is it the same as Spread syntax at MDN?
(3 answers)
Closed 6 years ago.
I found the following case in javascript. I don't understand '...' operator mean here. I search it on the Google, but I did not get anything about it. Is there any other usage for this operator? Can someone help me out?
var x= [1,2,3];
var y = [4,5,6];
var z = [...x, ...y]; // z will be [1,2,3,4,5,6];
Thanks.
I have a way of thinking which makes it very easy to understand and remember how '...' works.
var arr = [1,2,3] // this is arr which is the array
on the other hand
...arr // this is whatever inside arr, which is 1,2,3
So you can also think of it as taking what is inside of an array.
Note that by its own, ...arr is not a valid syntax. You can use it in
many ways , two of them coming to my mind are :
1 - Pass what is inside an array to a function
var arr = [ 1,2,3 ]
var myFunc = function(a,b,c) {
console.log(a,b,c)
}
myFunc(..arr) // logs 1 2 3
myFunc(1,2,3) // logs 1 2 3
2 - Take what is inside of an array and use them in another array.
var arr = [ 1,2,3 ]
var foo = [ ...arr, 4,5,6 ] // now foo is [ 1,2,3,4,5,6 ]