Почему при попытке вывести значение объекта через точку выводится undefined?

Question

[The_XXI]

const object = {
    num: 1,
    str: "строка",
}
function showKeyAndValues(obj) {
    for (let key in obj) {
        if (obj.hasOwnProperty(key)) {
            console.log('key: ' + key + ', value: ' + obj.key);  //obj[key]); 
        }
    }value: undefined
}
showKeyAndValues(object);

В данном варианте будет value: undefined, если же заменить обращение через точку на квадратные скобки, то значения выводятся, почему это работает именно так?

Comments

[Сергей delphinpro]

Потому что в объекте нет ключа "key"

Answer 1

[M K]

obj.<name> ищет свойство с именем name. В вашем случае obj.key будет искать поле key.

Когда мы используем квадратные скобки, то работает другой механизм, JS обрабатывает код внутри скобок и берет его значение. Давайте посмотрим на следующий пример:
obj['hello' + 'world'].
Что тут происходит?
Запускается код внутри квадратных скобок 'hello' + 'world', вычисляется значение 'helloworld' и потом ищется поле helloworld.

Когда мы запускаем obj[key] происходят аналогичные вычисления. Смотрим, что находится внутри [] - там key, key - это переменная, берем её значение и ищем поле с таким названием.

Кароче говоря, скобки что-то вычисляют, а точка - это просто обращение по имени