Почему существует проблема с деструктурой ES6 на объявленном объекте? - PullRequest
Новая
       30

Почему существует проблема с деструктурой ES6 на объявленном объекте?

0 голосов
/ 17 сентября 2018

У меня проблема или, более того, какая-то странная ситуация.Я использую https://es6console.com.

Я хочу использовать деструктуризацию и присваивать свойства уже объявленным переменным.Похоже, что есть проблема в том, где я объявляю объект.Пожалуйста, откройте https://es6console.com/jm6e72c7/ и нажмите Transform to ES5.Есть странное поведение, когда я объявляю объект после переменных. 

// not working
let ip, port;

let config = {
    ip: 'ip',
    port: 'port'
}

({ip, port} = config)

console.log(ip);

//working
let obj = {
    name: 'name',
    age: 'age'
}

let name, age;

({name, age} = obj)

console.log(name);

Ответы [ 3 ]

0 голосов
/ 17 сентября 2018

Во-первых, они оба работают. У вас есть два разных способа скомпилировать код ES6 в ES5: 

({ip, port} = config)
// converted to
((_config = config, ip = _config.ip, port = _config.port, _config));

// and

({name, age} = obj)
// converted to
name = obj.name;
age = obj.age;

Результатом в обоих случаях является то, что переменные установлены на соответствующие значения из объекта.

Разница в том, что транспортер считает, что возвращаемое значение операции присваивания может быть важным в первом случае, но не будет во втором случае. Так что в первом случае вы увидите _config в конце как возвращаемое значение. На самом деле это не нужно, но транспортер защищает - он сделает все возможное, чтобы функциональность была точно такой же.

Что касается , почему думает, что вам может потребоваться возвращаемое значение в первом случае, это из-за отсутствия точки с запятой после объявления объекта config.

С добавленной точкой с запятой она работает как положено: 

let config = {
    ip: 'ip',
    port: 'port'
};

({ip, port} = config)

Рабочий пример

0 голосов
/ 17 сентября 2018

проблема в том, что пропущена точка с запятой. 

let ip, port;

let config = {
	ip: 'ip',
	port: 'port'
}

({ip, port} = config)//this is being evaluated as part of the let config declaration...

console.log(ip);
console.log('------------------------------');

let obj = {
	name: 'name',
	age: 'age'
}

let name, age;

({name, age} = obj)

console.log(name);

должно быть 

let ip, port;

let config = {
	ip: 'ip',
	port: 'port'
};//added semicolon here

({ip, port} = config);//not needed here, but good to have

console.log(ip);
console.log('------------------------------');

let obj = {
	name: 'name',
	age: 'age'
}

let name, age;

({name, age} = obj)

console.log(name);

вы заметите, что даже при запуске от имени es6 вы получаете ошибку деструктурирования в первом фрагменте. это потому, что переводчик читает утверждение как 

let ip, port;
let config = {ip:'ip',port:'port'}({ip, port} = config)
0 голосов
/ 17 сентября 2018

Это одна из тех ситуаций, когда точка с запятой обязательна: 

let ip, port;

let config = {
	ip: 'ip',
	port: 'port'
};  //< --- you need the ;

({ip, port} = config)

console.log(ip);

В противном случае JavaScript будет интерпретировать код как: 

let config = {ip: 'ip',port: 'port'}() which is a type error because it tries to call a function.
...