Как можно объяснить это странное поведение console.log () в vue.js?

Когда я использую первый пример кода, по какой-то причине console.log() дает мне обработанную переменную HighData. Как будто console.log() были в конце сценария.

console.log( "data", this.data['diagram'] );
var HighData = this.data['diagram'];

minSerieHeight = getMin( HighData[3] );
HighData[0] = mkSerie( HighData[0] );
HighData[1] = mkSerie( HighData[1] );
HighData[2] = mkSerie( HighData[2] );
HighData[3] = mkSerie( HighData[3] );

Что еще более странно, когда я использую array.map() (который делает то же самое, что и код выше), он возвращает переменную this.data['diagram'] правильно, как и ожидалось.

console.log( "data", this.data['diagram'] );
var HighData = this.data['diagram'];

minSerieHeight = getMin( HighData[ HighData.length - 1 ] );
HighData = HighData.map( e => {
    return mkSerie( e );
});

Код находится в компоненте Vue в функции mounted(). getMin() и mkSerie() также входят в функцию mounted().


javascript vue.js google-developer-tools console.log
person Silvan    schedule 28.06.2019    source источник
comment
Вы можете добавить 2 полученных журнала?   -  person ishay m    schedule 28.06.2019
comment
Я не уверен, что правильно понимаю - если этот код находится в функции mounted(), почему он заключен в теги <script>?   -  person Lewis    schedule 28.06.2019
comment
@Lewis для stackoverflow. Без него язык не получится.   -  person Silvan    schedule 28.06.2019
comment
@Silvan Для этого не нужно включать теги <script>. Поместите тройные обратные кавычки до и после вашего кода и укажите желаемый язык после открывающих обратных кавычек.   -  person skirtle    schedule 28.06.2019

Ответы (1)


arrow_upward
8
arrow_downward

Консоль, регистрирующая объект / массив, является «живым». Консоль просто хранит ссылку на объект. Значения свойств не фиксируются, пока вы не развернете объект в консоли, и к этому времени ваш объект изменится.

JSON.stringify может быть полезным для захвата строковой версии объекта. Поскольку это строка, ее можно регистрировать без риска ее изменения. Для этого требуется, чтобы объект можно было преобразовать в JSON, что не всегда возможно.

Пример map немного отличается. Вы не изменяете тот же объект, который был зарегистрирован. Простое присвоение нового значения HighData не изменит значение, отображаемое в консоли, поскольку оно все еще указывает на исходный объект.

person skirtle    schedule 28.06.2019
comment
Работает с JSON.parse( JSON.stringify( this.data['diagram'] ) ). - person Silvan; 28.06.2019