ArtemSmirnov Apr 16 2011 at 21:12

Эмуляция блокировки видимости с помощью with в JavaScript

1 min

982

JavaScript*

+37

Comments 36

librarian Apr 16 2011 at 21:29

Плюсик чисто из-за картинки, спасибо, схоронил

slamer Apr 16 2011 at 22:25

А зачем вообще это нужно?
Почему не создать новую переменную? И путаницы меньше будет.

Masterkey Apr 17 2011 at 00:05

фантазия закачивается чаще чем способы с ограничением области видимости

vanxant Apr 16 2011 at 22:28

Замените костыль на велосипед плз)

ArtemSmirnov Apr 16 2011 at 22:50

Долго искал что нибудь побредовей в итоге остановился на огромной классике.

ant99 Apr 16 2011 at 22:52

Или так:
img-fotki.yandex.ru/get/4802/velimir-j.2/0_303d7_85a93840_XL

ArtemSmirnov Apr 16 2011 at 22:59

Спасибо, то что нужно!

rootools Apr 16 2011 at 23:02

Отличный пикчр!)

ant99 Apr 16 2011 at 23:15

Только это не моя картинка, а чья-то ещё, поэтому спасибо за неё не мне, а фотографу и модели (ай, подлинный Печкин!).

azproduction Apr 16 2011 at 23:30

Это именно костыль, притом, костыль стоит в углу.

да, я знаю, что она причислена к Bad Parts из-за ненужности и неэффективности, но вот прямо сейчас я опровергну первое утверждение

не убедили

Чем писать вот такой изврат с песевдо let и let в частности:

foo = 10;
bar = 20;
with({
  foo:20,
  bar:10
}){
  console.log(foo,bar); //20 10
}
console.log(foo,bar); //10 20

я лучше дам «локальным» именам доходчивые названия — сделаю вот так:

var foo = 10,
    bar = 20,
    localFoo = 100,
    localBar = 200;

console.log(foo, bar); //10 20
console.log(localFoo, localBar); //100 200

Просто, наглядно, дебажить безусловно проще.

let is a Mozilla extension, not part of any standard

Let нет ни ECMAScript 3 ни в ECMAScript 5 потому, что let как и with портит всю суть программирования на JavaScript, let нужен только тем, кто перешел на JavaScript с других языков — тому пример C++.

Let как и yield занесен в список Future Reserved Keywords, ну и в будущем он может войти в стандарт потому, что JavaScript является дополнительным языком и чтобы другим программистам было проще на нем писать он впитывает популярные конструкции из других языков. А тем кто писал на нем изначально и пишет 95% своего времени на JavaScript все эти дополнительные прибамбахи добавят хлопот. Я поддерживаю итераторы, а вот let, я уверен, будущая головная боль.

PS вот ещё вспомнил Delete Unmasks Globals

var foo = 10,
    bar = 20;

with({
  foo: 100,
  bar: 200
}){
  console.log(foo, bar); // 100 200

  delete foo; // Ха-ха я злой хакер!
  foo = 100500;

  console.log(foo, bar); // 100500 200
}
console.log(foo,bar); // 100500 20

ArtemSmirnov Apr 16 2011 at 23:38

Ну в последнем примере все как ни странно должно именно так и работать ведь после удаления из локальной области видимости ищется во внешней.
Ну и в общем то вы правы на счет того что let это изврат, но он есть в JavaScript, и меня не оставляла мысль о том что это не работает в других браузерах.

azproduction Apr 16 2011 at 23:56

Он есть только в движке от Mozilla. А остальные не допилили потому, что это не нужно либо не так необходимо как какая-нибудь новая фича WHATWG. Я надеюсь, что let не попадет в стандарт.

TheShock Apr 20 2011 at 07:50

А что за наприязнь к лэт? Я к нему отношусь нейтрально, но почему бы и не принять в стандарт? Чем он плох?
Я много мозилловских вещей жду, особенно Expression closures:

// JavaScript 1.7 and older:
function(x) { return x * x; }

// JavaScript 1.8:
function(x) x * x

И это не потому что я увидел такое в другом языке программирования, а потому что реально удобно было бы.

azproduction Apr 20 2011 at 15:50

Let по идее должен заменить Immediately-Invoked Function Expression (IIFE), но врятли кто-то будет использовать его всегда по прямому назначению. Я какраз боюсь проблем с этими не прямыми назначениями. Как мы видим JavaScript впитывает много из других языков пример тому Expression closures — это хорошее нововведение.

TheShock Apr 20 2011 at 16:59

Таки я не могу понять. У меня let работает так же, как var. Что я делаю не так? Или оно нужно для чего-то другого? Или я его неправильно применяю?

<!DOCTYPE html>
<html>
   <head>
      <meta charset="utf-8" />
      <title>Let</title>
   </head>
   <body>
      <div id="var">var</div>
      <div id="let">let</div>
      <div id="iife">iife</div>
      <script type="application/javascript;version=1.7">
         var elem = document.getElementById('var');
         for (var i = 0; i < 10; i++) {
            var span = document.createElement('span');
            elem.appendChild(span);
            span.innerHTML = i;
            span.onclick = function () { alert(i) };
         }
         
         var elem = document.getElementById('let');
         for (let k = 0; k < 10; k++) {
            let span = document.createElement('span');
            elem.appendChild(span);
            span.innerHTML = k;
            span.onclick = function () { alert(k) };
         }
         
         var elem = document.getElementById('iife');
         for (let m = 0; m < 10; m++) {
            let span = document.createElement('span');
            elem.appendChild(span);
            span.innerHTML = m;
            span.onclick = function (m) {
               return function () { alert(m) };
            }(m);
         }
      </script>
   </body>
</html>

Правильно алерты выводятся только в последнем, созданном при помощи Immediately-Invoked Function Expression. Я ожидал такого же поведения от let, но не судьба.

ps. Firefox 4

ArtemSmirnov Apr 22 2011 at 21:31

Либералы и консерваторы, одни против нововведение и держатся старых традиций а другие не против нового

TheShock Apr 23 2011 at 01:23

Я скорее либерал, но таки не понял, почему мой пример не работает, разве для этого он и не нужен, этот let?

azproduction Apr 23 2011 at 08:29

Вот реальный пример:

<!DOCTYPE html>
<html>
   <head>
      <meta charset="utf-8" />
      <title>Let</title>
   </head>
   <body>
      Alerts a, b, c: <button class="a">1</button>
      <button class="a">2</button>
      <button class="a">3</button>
<hr/>
      Alerts c, c, c: <button class="b">4</button>
      <button class="b">5</button>
      <button class="b">6</button>
      <script type="application/javascript;version=1.7">
var GLOBAL = ['a', 'b', 'c'];
// Let
(function () {
    var buttons = document.querySelectorAll('button.a');
    for (var i = 0; i < buttons.length; i++) {
       let a = GLOBAL[i]; // << Let
       buttons[i].addEventListener('click', function (){alert(a)}, false);
    }
}());
// Var
(function () {
    var buttons = document.querySelectorAll('button.b');
    for (var i = 0; i < buttons.length; i++) {
       var a = GLOBAL[i];
       buttons[i].addEventListener('click', function (){alert(a)}, false);
    }
}());
      </script>
   </body>
</html>

azproduction Apr 22 2011 at 13:49

Да да да! Let приписали к Bad parts!

Language Reform, the “better carrots” needed to lead users away from bad forms:
— let, const, function in block scope

ES Wiki

azproduction Apr 23 2011 at 00:19

… не то написал… IIFE приписали к Bad parts, Let должен её заменить bit.ly/dQgE4b, как я и писал выше. Против эволюции не стоит бороться иначе она столкнет тебя в обрыв, придется мириться и с Let :)

TheShock Apr 23 2011 at 01:24

azproduction, ответь на счёт let повыше, я так и не разобрался, как с помощью let заменить iife

azproduction Apr 23 2011 at 07:59

Вот видео с ECMAScript.Next (там показано как его надо использовать) тут обсудим

tenshi Apr 17 2011 at 04:36

for( let i= 0; i < 3; ++i ) console.log( i )
console.log( i )

0
1
2
error

по моему, логично. но никак не похоже на с++ и иже с ним.

azproduction Apr 17 2011 at 13:06

я про

C-style block-level scoping… JavaScript 1.7, however, supports block-level scoping with the let keyword

serf Apr 17 2011 at 00:27

Я не совсем понял зачем нужно использовать переменные с одним названием, но раз хочется то можно впихнуть в замыкание:

foo = 10;
bar = 20;
(function(fooGlobal, barGlobal) {
var foo = 10;
var bar = 20;
console.log(foo,bar); //10 20
delete foo; // Ха-ха я злой хакер!
foo = 100500;
console.log(foo, bar); // 100500 200
fooGlobal // Ха-ха я действительно злой хакер!
})(foo, bar);
console.log(foo,bar); //20 10

Повторяюсь, возможно я не правильно понял что именно требуется, поздно уже у нас :)

serf Apr 17 2011 at 00:33

Не заметил что курсор на textarea с комментом, думал нахожусь в firebug console, нажал ctrl+enter — отправилось сырое сообщение :)

DmitryBabokin Apr 17 2011 at 01:15

Заголовок — «Эмуляция блокировки видимости с помощью в JavaScript». С помощью чего?
Все татаре кроме я.

burzilov Apr 17 2011 at 01:25

Когда я пишу об опечатках в личку, мне частенько плюсуют карму ;)

sky_lord Apr 17 2011 at 01:35

Поддерживаю тех, кто не вкуривает, зачем это нужно. :-) И не забываем о том, что «причислена к Bad Parts» — это все лирика, но на практике код с with не будет нравится ни одному оптимизатору — ни GCC, ни YUI Compressor…

glebmachine Apr 17 2011 at 10:43

Хочу напомнить, что я не иду против управления областью видимости с помощью функции, но иногда функцию для небольшой области видимости просто слишком громоздко

Коты выходят из под контроля — слишком много усов! Перечитали бы текст прежде)
Никогда не видел острой необходимости в подобных костылях

Latobco Apr 17 2011 at 11:59

www.veloblog.com.ua/wp-content/uploads/2011/03/velosiped_london.jpg

Latobco Apr 17 2011 at 12:00

Я сначала подумал, что на картинке из топика — Лукашенко…

glazs Apr 17 2011 at 12:47

А ещё Google Closure Compiler очень не любит with. И не только он.

Xpeh Apr 17 2011 at 19:15

С with проблема вовсе не в неэффективности или ненужности, а в опасности: при изменениях значений переменных внутри блока with то, в каком именно scope произойдут изменения, зависит от набора уже объявленных переменных в иерархии scope, и поэтому можно понять, только обозрев всю программу целиком.

bolk Apr 17 2011 at 20:40

я тоже как-то об этом думал: bolknote.ru/2009/11/10/~2305/

kirilloid Apr 18 2011 at 00:51

На самом деле то же самое можно сделать анонимной функцией — код будет как-то более привычным, что ли.