Понимание затенения переменных в javascript?
я создал криптообъект следующим образом:
var crypto = {
encrypt: function(s) {
}
};
crypto.encrypt("cat");я бы получил следующую ошибку
Uncaught TypeError:
crypto.encryptis not a function
var crypt = {
encrypt: function(s) {
}
};
crypt.encrypt("cat");это сработает. Я понял, что уже есть встроенный объект crypto, поэтому криптообъект, который я определил, не распознавался.
Насколько я понимаю, переменные, объявленные позже, будут скрывать переменную, объявленную ранее.
Например, когда я создаю два объекта следующим образом:
var test = {
testing2: function() {
return "there";
}
}
var test = {
testing: function() {
return "hey";
}
}
test.testing2()и я вызываю test.testing2(), тогда возникает аналогичная ошибка, потому что вторая тестовая переменная затеняет первую. Итак, если затенение переменных работает с самостоятельно созданными переменными, то почему крипто не затеняется? Это тот случай, когда предопределенные объекты всегда имеют более высокий приоритет, поэтому любые созданные вами объекты не будут затенять объекты окна. Я ценю любое понимание этого. Спасибо!
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 1
Как правило, да, переменные, объявленные позже (с var), просто перезапишут var, объявленные ранее с тем же именем. Разница в том, что переменные, объявленные с помощью var на верхнем уровне, присваиваются window свойствам, а window.crypto — это свойство с геттером, но без сеттера:
console.info(
Object.getOwnPropertyDescriptor(window, 'crypto')
);Поэтому, когда вы присваиваете window.crypto с var crypto, сеттера нет, поэтому ничего не происходит. Многие другие свойства window ведут себя так же.
Попробуйте вместо этого использовать const или let:
const crypto = {
encrypt: function(s) {
}
};
crypto.encrypt("cat");Или поместите его в IIFE:
(() => {
var crypto = {
encrypt: function(s) {
}
};
crypto.encrypt("cat");
})();Вы также можете использовать use strict, чтобы сделать ошибку явной:
'use strict';
var crypto = {
encrypt: function(s) {
}
};
console.info('successfully defined crypto');
crypto.encrypt("cat");Именно так работают const и let — они не присваиваются свойствам на window, в отличие от var, даже если они находятся на верхнем уровне.
Понимаю. поэтому var устарел. мы всегда должны использовать let? что ты говоришь? и вроде как с введением let, iffe тоже устарел. Каково твое мнение?
Да, я бы определенно посчитал var устаревшим — в современном коде почти нет причин использовать его. У него слишком много ошибок. Используйте транспилятор, такой как Babel, для преобразования в ES5, если вам нужна совместимость с устаревшими браузерами. Тем не менее, IIFE не устарели — это очень распространенный шаблон, и у него много полезных применений. Немного может сказать, что они в некотором роде устарели, если вы используете модульную систему, что в некоторой степени верно, но не полностью, IMO
Благодарю. я все еще не понимаю, почему использование let вместо var решило проблему. Даже при использовании let мы по-прежнему находимся на верхнем уровне, так почему же это не конфликтует с криптографией окна. Я понимаю, что let имеет область действия блока, а var - область действия функции. можем ли мы предположить, что код javascript, который мы пишем, находится внутри блока { }, так что любые объявления let находятся в этой области. Спасибо за помощь!