Setting one array equal to another array makes it behaving like an object, what am I missing?

Question

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're using [destructuring assignment](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment), you're not actually setting one array to another. — Nick Parsons, Dec 22 '19 at 13:58
you can invent all the code writing you want, but do not expect that they can match the syntax rules of any language, even javascript — Mister Jojo, Dec 22 '19 at 14:00
I was learning react hooks and I saw this in "useState" and when creating a new hook with the instructor. I was confused by this "const [state, setstate] = useState(false); — , Dec 22 '19 at 14:05

Kennuel · Accepted Answer · 2019-12-22T14:10:22.940

2

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];

edited Dec 22 '19 at 14:10

answered Dec 22 '19 at 14:04

Kennuel

169
7

Does this works on Array too? – Dec 22 '19 at 14:07
Yes it does! I will update the answer. – Kennuel Dec 22 '19 at 14:07

score 1 · Answer 2 · answered Dec 22 '19 at 14:08

1

You are using destructuring assignment. Then variable c = arr[0], d = arr[1]

If you need to copy array:

const newArr = arr.concat();

answered Dec 22 '19 at 14:08

AlexDevTime

166
4

jpmc · Answer 3 · 2019-12-22T18:12:29.850

0

If you are trying to set one array to equal another array all you need is:

const c = ["h", "i"];
const d = c;

edited Dec 22 '19 at 18:12

answered Dec 22 '19 at 14:02

jpmc

1,147
7
18

2

Hi James, Thank you for your answer. Please advise what you did and why it's solving the question – Tamir Klein Dec 22 '19 at 14:54
Hi, I was just showing how to set one array to equal another (without making it behave as an object) as you mentioned in your question title. – jpmc Dec 22 '19 at 16:47
1

Great. Please edit your answer with this explanation. – Tamir Klein Dec 22 '19 at 18:07

score 0 · Answer 4 · answered Dec 22 '19 at 14:18

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";

Setting one array equal to another array makes it behaving like an object, what am I missing?

4 Answers4