Monthly Archives: Червень 2013

JavaScript, this, call, apply

Тут піде мова про елементарні речі, про які обов’язково розповідає будь-який підручник JavaScript, але я все одно забуваю. Тому запишу аби запам’ятати легше було. Спершу – яка різниця між call та apply?

Як apply, так і call дозволяють нам викликати нашу функцію зі зміненим контекстом, незалежно від того звідки ми її взяли. Єдина відмінність у способі виклику. f.apply(context, arg_array) приймає два аргументи: контекст, та масив аргументів. f.call(context, arg1, arg2, ...) приймає n+1 аргумент – контекст, та n аргументів з якими треба викликати функцію.

Що таке контекст? Контекст, це те що кожна функція отримує за допомогою спеціальної змінної this. За замовчуванням this містить посилання на глобальний об’єкт window. Ось нехай ми маємо таку функцію:

function hello() {
    console.log('Hello ' + this.name);
}
hello()
// отримаємо: Hello
// тому що this.name - undefined
name = 'world' // те саме що window.name = window 
// Всі змінні за замовчуванням створюються в глобальному об’єкті
hello()
// отримаємо: Hello world
// тому що this.name, це те саме що window.name
// а hello() це те саме що window.hello(). Он як!

Тепер подивимось які ще бувають контексти. Створимо об’єкт з атрибутом та методом:

x = {name: 'x', hello: hello}
x.hello()
// отримаємо: Hello x

Значить всі функції описуються як методи об’єкта window, якщо вони не прив’язані до якогось іншого об’єкта. Ах, ще функції – самі по собі об’єкти, тому можна зробити якось так:

hello.hello = hello // атрибутом hello функції hello буде функція hello
hello.hello()
// отримаємо: Hello hello
// Тому що атрибут name функції містить її ім’я

Хоча останній хак – не описаний в стандартах.

А взагалі, в кінці дня я вже трішки плутаюсь між this та self, та між прототипним ООП і метакласами…


Filed under: Кодерство, Павутина Tagged: JavaScript

Це не так просто – розуміти.

Публікація про те як це, коли код доводиться читати а не писати, і що тоді робити. Тобто, як читати код?

Neo: Do you always look at it encoded? Cypher: Well you have to. The image translators work for the construct program. But there's way too much information to decode the Matrix. You get used to it. I...I don't even see the code. All I see is blonde, brunette, red-head. Hey, you uh... want a drink?

Нео: Ви завжди дивитесь не неї зашифрованою?

Сайфер: Ну, ми змушені. Транслятори зображення працюють над програмою конструювання. Але тут надто багато інформації щоб розкодувати Матрицю. Ти звикнеш. Я… Я навіть не бачу код. Все що я бачу – блондинка, брюнетка, руденька. Ей, ти еее… не хочеш випити?

Передмова

На моїй новій роботі (я не впевнений що мені дозволяє розповідати договір про нерозголошення, тому абстрагуватимусь як можу), проект задля якого мене найняли (там має бути Python, який як відомо легко читати і який я знаю досить добре, і проект новий) ще не почався. Але тим часом аби я не нудьгував, мені дали задачу з іншого проекту, там JavaScript, LeafLet (о, він чудовий), але моя задача – не така проста як видавалась спочатку.

Проблема перша – я не знаю ООП в JavaScript. Дякуючи документації до LeafLet, і тому що ООП там реалізовано через нього – проблема майже розв’язана. Ну й звісно JavaScript я в терміновому порядку підтягую.

Проблема друга – проект з галузі Business Intelligence. А я про схему даних “сніжинка”, OLAP-куб та інші подібні речі чую вперше. Але я почитав вікіпедію, подивився всілякі відеопояснення і тепер маю певне поняття. Якось ним поділюсь, може хтось скаже що моє поняття про BI хибне.

Третя, і головна проблема – купа коду без жодної документації. І на відміну від попередньої роботи (prom.ua), де проект пишуть роками і далі будуть, тут проект писали пів року (судячи з логів СКВ), дедлайн вже в кінці місяця, тому рефакторингом мене попросили не займатись. Ще до того як я запитав чи можна. Про документацію я не питав, тому що документація – це нереально, якщо ви звісно не пишете якусь бібліотеку з відкритим кодом. Зовсім нереально. Але юніт тести – в нашому випадку теж дуже важко, через специфіку середовища. Хоча менеджер сказав “Хочеш тести? Дуже добре!”, і при цьому якось дуже підозріло посміхнувся.

Хоча код знадобилось би трішки підчистити, тому що:

nested_code

Тому мій єдиний вихід – ввімкнути щось схоже на “Push it to the limit“, і поринути в читання. Але код – це не книжки (я читав книжку про те як читати книжки, а про те як читати код – не читав), крім того автор книжки зазвичай хоче аби ви прочитали книжку, а автор коду – лише аби комп’ютер той код зміг виконати, та й досвіду читання коду в мене набагато менше, тому думаю треба дізнатись як це роблять інші. Переберу-но я кілька статтей:

Мотивація

Елі Бендерський пише про те як розуміти власний код. Код який неможливо зрозуміти, на його думку – це такий самий, або можливо ще більший гріх, ніж код який не працює. А програмісту який з гордістю заявляє що не розуміє код який писав тиждень тому, треба давати в писок аби вибити з нього ту гордість. За цим посиланням мені “дають в писок”. Хоча я гордився не тим що написав незрозумілий код, а тим що я його таки зрозумів і навіть трішки спростив. :)

Методи написання коду який буде вам зрозумілим – регулярно його перечитувати і переписувати.

Якийсь невідомий чувак пише про те що тупо прокручувати чужі лістинги вирячившись на них з кислою міною – тупо. Потрібно полюбити читати код, і розглядати це не як каторгу – а як можливість. Тому що написання коду – як і література. Ви не навчитесь писати класний код, якщо не будете читати класний код. Ви не навчитесь читати код якщо не будете намагатись його побільше читати. Тому й поганим кодом не варто нехтувати. Хоча б для того аби розуміти який код поганий, а який – ні.

Зібрані поради

  • Зрозуміти що від програми вимагається і для чого її пишуть. Перед тим як робити все інше.
  • Спитати автора.
  • Пройтись за допомогою зневадника.
  • Вставляти багато print та assert.
  • Записувати всі відкриття в письмовій формі.
  • Спробувати щось змінити і подивитись що зміниться, а що зламається.
  • Парне програмування з розумним колегою чи автором. Спробуйте думати вголос. Може виявитись що в вас різні думки і почнеться продуктивна суперечка.
  • Код не читають рядок за рядком. Якщо щось не розумієте – можливо ви ще не прочитали код в кінці який потрібен для того щоб розуміти код посередині. Пропускаємо, ставимо закладку і повертаємось до нього потім.
  • Знайти функцію main, чи як там називається точка входу і читати з неї. Якщо точок входу багато (наприклад багато обробників подій) – виписати їх список.
  • Прочитати документацію викликів зовнішніх бібліотек. (На щастя сторонні бібліотеки документуються частіше.)
  • Починати з простих частин. Якщо ти не можеш розуміти навіть ті частини що здаються простими – код або занадто заплутаний, або ти недостатньо знаєш мову чи фреймворк.
  • Рефакторинг. Наприклад дайте нормальні імена ідентифікаторам, кілька разів застосуйте extractMethod
  • Додавання коментарів туди ж… Тільки будьте певні що вони не введуть когось хто прийде після вас в оману.
  • Якщо поняття не маєте як почати писати коментарі – описуйте для функції трійки Хоара.
  • Почати читати з тестів. Якщо таких нема – покривати тестами. (А тих хто написав код без тестів – покривати матами :D ). Подивитись чи тести проходяться. Якщо не проходяться – значить ви неправильно зрозуміли як повинна працювати програма (і добре що ви це дізнались раніше поки ще є час зрозуміти її правильно), або вона працює неправильно (Співчуваю ви знайшли баг. Якщо ще не впевнені що зможете пофіксити – додайте в багтрекер.)
  • Намалювати граф викликів.
  • Роздрукувати код на кольоровому принтері з підсвіткою синтаксису, розкласти його на підлозі, взяти в руки кілька маркерів та олівців і лазити виділяючи точки входу, важливі виклики, дописуючи коментарі на полях і позначаючи важкодоступні місця.
  • Намагатись зрозуміти лише необхідний мінімум і припускати що решта коду працює так як і повинна. (А як дізнатись як повинна? :) )
  • Згенерувати за допомогою ctags та cscope чи що там у вас є, індекс для прискорення навігації по коду. Хороше IDE – головний інструмент програміста-археолога. Також є інший софт, на зразок LXR (для читання коду Linux), Doxygen, Resharper, купа всякого…
  • Намагатись поміщати елементи в чорний ящик, тобто старатись зрозуміти ЩО вони роблять, а не ЯК вони це роблять. Правда тут є виверт 22 – код містить опис того як щось робиться, а що робиться – нам якраз потрібно зрозуміти. Тим не менш – треба абстрагуватись як тільки зрозуміємо якусь частину і переходити до наступної.
  • Спитати досвідчених користувачів програми, які не обов’язково повинні бути її творцями. Можливо якщо повністю зрозуміти як люди працюють з програмою – не доведеться її читати, можна буде написати свою версію. :)
  • Виділити найважливіші прецеденти, зрозуміти їх.

Посилання

Також варто сказати про те що тут – як з підтягуванням. Знання про те що не варто скрипіти зубами, напружувати прес чи інші м’язи (якщо в вас коліна підтягуються до грудей – це не добре). І не забувати видихати при скороченнях і видихати при розслабленні. І мати стабільний ритм. Але тільки це не допоможе вам підтягуватись 20 разів поки ви не спробуєте 2, потім 3, потім 4 і так далі, регулярно та постійно.

Література


Filed under: Кодерство, Нещоденник Tagged: книжки, робота, розробка

В JavaScript плоске теж краще ніж вкладене, чи ні?

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

Наприклад коли треба завантажити десять бібліотек одну за іншою… Але багато вкладень доводять до того що код не влізається в 80 символів, і хоча в екрани в наш час дуже широкі, та все одно читати неприємно. Тому я взяв і написав таке:

   
/*
    callbackStack is function which
    trasforms nested callbacks from this form:

    load('lib1', function() {
        load('lib2', function() {
            load('lib3', function() {
                ...
                    finally_execution();
                ...
            });
        });
    });
    
    to this form:

    callbackStack(['lib1', 'lib2', 'lib3', ... ], load, finally_execution);
*/
var callbackStack = function(param_list, func_to_call, final_callback) {
    var stack = final_callback;
    var stack_this = function(param, stack) {
        return function () {
            func_to_call(param, stack);
        };
    };
    for(var i = param_list.length - 1; i >= 0;i--) {
        stack = stack_this(param_list[i], stack);
    }
    stack();
};
 
// Example:
var function_with_callback = function (param, cb) {
    console.log(param);
    cb();
};
var ok = function() {
    console.log('ok!');
};
var param_list = ['lib1', 'lib2', 'lib3', 'lib4', 'main'];
var test = function () {
    callbackStack(param_list, function_with_callback, ok);
};
test();

Цей код ще не рев’ювили, тому вирішив поділитись тут. А то раптом я пропустив якийсь підводний камінь з замиканнями і написав якусь цікаву багу, яку хтось помітить…


Filed under: Кодерство, Павутина Tagged: JavaScript

Python на Windows 7 (і можливо інших версіях)

Тут трішки розповім про установку і налаштування Python під цю досить поширену систему, може аудиторія мого блогу і користувачів моїх скриптів трішки розшириться. Ну й аби запам’ятати до наступного разу, хто зна, може ще колись знадобиться. Про cygwin не розповідатиму, там все занадто просто для мене, і напевне надто складно для тих хто ще не пройшов курс “Shell-fu” на Memrise.

Перше що потрібно знати – на системі якої розрядності ми сидимо. Для цього натискаємо меню пуск, знаходимо пункт “Computer”, правий клік в контекстне меню, вибираємо пункт “Properties”. Або контекстне меню каталогу “Computer” де б ви його не знайшли. Відкривається вікно з адресою "Control Panel\All Control Panel Items\System". Також можна цю адресу в провіднику ввести. Якщо в цьому вікні написано:

System type: 64 bit Operating System

Значить ми 64 розрядні. В 32-розрядних певне буде написано про те що вона 32 розрядна.

Далі на офіційному сайті знаходимо файлик “Python 3.3.2 Windows X86-64 MSI Installer” (чи яка там версія для вас більше підходить), качаємо, запускаємо. З цього місця можете перервати читання цієї інструкції і поринути в Python 3 на один розділ. Після того повертайтесь сюди, то ще не все.

Далі нам потрібно перейти в командну оболонку. Натискаємо Win+R, в вікні що виринає набираємо cmd і натискаємо Enter. Запуститься огидний термінал який використовує кодову сторінку 866. І це на хваленому Windows 7! Але ми цю проблему відкладемо на потім, спершу перевіримо чи python запускається. Пишемо команду “python”, і якщо все ок, то ми повинні побачити таке привітання:

python_in_windows

Якщо ні – доведеться редагувати $PATH. Та навіть якщо й все ок, його все одно доведеться редагувати. Тому знову переходимо в провіднику за адресою "Control Panel\All Control Panel Items\System". Там десь зліва натискаємо “Advanced system settings”. Вискочить вікно:

advanced_system_settings

В вікні натискаємо кнопку “Environment Variables”, в таблиці “System variables” знаходимо змінну Path, та переконуємось в тому що десь в ній є підрядок “C:\Python33\;C:\Python33\Scripts;“. Не обов’язково буквально такий, але він повинен містити шлях до каталогу в якому міститься файл python.exe тої версії яку ви встановили. Якщо в тому каталозі нема підкаталогу Scripts – не переживаємо, скоро буде.

Далі скачуємо скрипт для встановлення distribute. Запускаємо його:

python distribute_setup.py

Якщо все ок, то коли ми наберемо easy_install, то побачимо таке:

C:\Users\tbunyk>easy_install
error: No urls, filenames, or requirements specified (see --help)

Якщо каже що не знає easy_install, хоча запуск distribute_setup.py був успішнм, і C:\Python33\Scripts\pip.exe присутній – значить ви забули додати каталог Scripts в змінну середовища Path.

Тільки от використання easy_install вже давно не схвалюється, тому його використовують як і IE – лише один раз:

easy_install pip

Далі нарешті ви можете встановити мою улюблену програмку:

pip install bwikibot

В мене при інсталяції виникали страшнющі помилки:

 Downloading from URL https://pypi.python.org/packages/source/m/mwparserfromhell/mwparserfromhell-0.1.1.tar.gz#md5=5fb2c8b992bce12c6a1c31e5158b6662 (from https://pypi.python.org/simple/mwparserfromhell/)
Exception:
Traceback (most recent call last):
  File "C:\Python33\lib\site-packages\pip\basecommand.py", line 139, in main
    status = self.run(options, args)
...... трішки пропущено ......
  File "C:\Python33\lib\ssl.py", line 327, in read
    v = self._sslobj.read(len, buffer)
ConnectionResetError: [WinError 10054] An existing connection was forcibly closed by the remote host

Я спочатку гуглив що це означає, нічого не знайшов, але при другій спробі запуску все встановилось до кінця.

bwikibot.exe (ого, його скомпілювали!) з’являється в C:\Python33\Scripts\ і повинен запускатись простою командою bwikibot.

Правда звісно ця версія має купу проблем:

C:\Users\tbunyk>bwikibot read book
Exception No module named 'bulk_actions' in extension bulk_actions.py
Exception No module named 'check_uploads' in extension check_uploads.py
Exception No module named 'films' in extension films.py
Exception No module named 'translator' in extension translator.py
Traceback (most recent call last):
  File "C:\Python33\Scripts\bwikibot-script.py", line 9, in <module>
    load_entry_point('bwikibot==0.4.13', 'console_scripts', 'bwikibot')()
  File "C:\Python33\lib\site-packages\bwikibot\cli.py", line 12, in main
    run(*sys.argv)
  File "C:\Python33\lib\site-packages\bwikibot\cli.py", line 22, in run
    action(*argv[2:])
  File "C:\Python33\lib\site-packages\bwikibot\cli.py", line 94, in read_page1
    read_page(SESSION_FILE, *args)
  File "C:\Python33\lib\site-packages\bwikibot\cli.py", line 89, in read_page
    print(wiki.page(name).read())
  File "C:\Python33\lib\encodings\cp866.py", line 19, in encode
    return codecs.charmap_encode(input,self.errors,encoding_map)[0]
UnicodeEncodeError: 'charmap' codec can't encode character '\u014d' in position
1846: character maps to <undefined>

І знаєте, я тут подумав що писати консольні програми для Windows – невдячна справа. Напевне доведеться дописати ще якусь гуйовину. Тому скоро очікуйте bwikibot 0.5.0!

Ах, і ще одна проблема Python на Windows – тут не все так просто з пакетами що містять бінарники. Наприклад при встановленні lxml я отримав:

error: Unable to find vcvarsall.bat

З PySide – йому бракувало програми nmake. PyQt теж чогось бракувало. Я погуглив і з’ясував що що vcvarsall.bat, що nmake не знайдеш без Visual Studio. Ну, Visual Studio я люблю і напевне поставлю, але що робити потенційним користувачам моїх програм, які і так вже повинні були витерпіти довгий процес інсталяції який включав редагування змінної Path я не знаю…

Ви лише погляньте який модний інтерфейс встановника Visual Studio і яка там досі огидна консоль.

Ви лише погляньте який модний інтерфейс встановника Visual Studio і яка там досі огидна консоль.


Filed under: Інструменти, Кодерство, Конспекти Tagged: Python, windows