<?xml version="1.0" encoding="windows-1251"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
	<channel>
		<atom:link href="https://js.mybb.ru/export.php?type=rss" rel="self" type="application/rss+xml" />
		<title>Программирование на js</title>
		<link>http://js.mybb.ru/</link>
		<description>Программирование на js</description>
		<language>ru-ru</language>
		<lastBuildDate>Wed, 30 Nov 2011 00:05:30 +0400</lastBuildDate>
		<generator>MyBB/mybb.ru</generator>
		<item>
			<title>Маленькие да удаленькие</title>
			<link>http://js.mybb.ru/viewtopic.php?pid=8#p8</link>
			<description>&lt;p&gt;Итак, Lettering.js — помощник «радикального» веб-типографа, Cryptico.js — помощник Штирлица и Rasta.js — такой простой ajax get/set помощник. Далее ссылки на сайты разработчиков этих библиотек и инструкций по их использованию. &lt;/p&gt;
						&lt;p&gt;&lt;a href=&quot;http://letteringjs.com/&quot; rel=&quot;nofollow&quot; target=&quot;_blank&quot;&gt;&lt;strong&gt;Lettering.js&lt;/strong&gt;&lt;/a&gt;&lt;br /&gt;&lt;img class=&quot;postimg&quot; loading=&quot;lazy&quot; src=&quot;http://uploads.ru/t/B/M/A/BMAU1.gif&quot; alt=&quot;http://uploads.ru/t/B/M/A/BMAU1.gif&quot; /&gt;&lt;br /&gt;Так вот Lettering.js позволяет разбить слова на буквы, предложения на слова и абзацы на строки, а разбитые фрагменты оформить интересным образом c помощью css. В общем, к чему слова — смотрите на примеры на сайте letteringjs.com.&lt;/p&gt;
						&lt;p&gt;&lt;a href=&quot;http://cryptico.wwwtyro.net/&quot; rel=&quot;nofollow&quot; target=&quot;_blank&quot;&gt;&lt;strong&gt;Cryptico.js&lt;/strong&gt;&lt;/a&gt;&lt;br /&gt;&lt;img class=&quot;postimg&quot; loading=&quot;lazy&quot; src=&quot;http://uploads.ru/t/T/J/G/TJGLH.gif&quot; alt=&quot;http://uploads.ru/t/T/J/G/TJGLH.gif&quot; /&gt;&lt;br /&gt;Библиотека JavaScript для шифровки текста. Используются методы RSA и AES. Текст может быть зашифрован ключом с заданной длиной (512, 1024, 2048, 4096, 8192).&lt;/p&gt;
						&lt;p&gt;&lt;a href=&quot;http://rastajs.errorjs.com/&quot; rel=&quot;nofollow&quot; target=&quot;_blank&quot;&gt;&lt;strong&gt;Rasta.js&lt;/strong&gt;&lt;/a&gt;&lt;br /&gt;&lt;img class=&quot;postimg&quot; loading=&quot;lazy&quot; src=&quot;http://uploads.ru/t/J/I/V/JIV1n.gif&quot; alt=&quot;http://uploads.ru/t/J/I/V/JIV1n.gif&quot; /&gt;&lt;br /&gt;Доступ к данным онлайн по ключу. Указываете url откуда брать/давать данные и обмениваетесь оными при необходимости. Все происходит на уровне GET-запросов.&lt;/p&gt;</description>
			<author>mybb@mybb.ru (dimaz)</author>
			<pubDate>Wed, 30 Nov 2011 00:05:30 +0400</pubDate>
			<guid>http://js.mybb.ru/viewtopic.php?pid=8#p8</guid>
		</item>
		<item>
			<title>Javascript наследование</title>
			<link>http://js.mybb.ru/viewtopic.php?pid=7#p7</link>
			<description>&lt;p&gt;Проблема в том, что в javascript нет привычного наследования. Максимум что можно сделать, это создать конструктор класса:&lt;/p&gt;&lt;div class=&quot;code-box&quot;&gt;&lt;strong class=&quot;legend&quot;&gt;Код:&lt;/strong&gt;&lt;div class=&quot;blockcode&quot;&gt;&lt;div class=&quot;scrollbox&quot; style=&quot;height: 4.5em&quot;&gt;&lt;pre&gt;function Class(){/*тут инициализируем поля *}&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;p&gt;А потом, через прототип, добавить методы, константы и статические переменные, которые будут одни на все экземпляры.&lt;/p&gt;&lt;div class=&quot;code-box&quot;&gt;&lt;strong class=&quot;legend&quot;&gt;Код:&lt;/strong&gt;&lt;div class=&quot;blockcode&quot;&gt;&lt;div class=&quot;scrollbox&quot; style=&quot;height: 4.5em&quot;&gt;&lt;pre&gt;Class.prototype = {/*Методы*/}&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;p&gt;Этого в большинстве случаев хватает, но иногда хочется большего.&lt;/p&gt;
						&lt;p&gt;&lt;strong&gt;А если очень хочется...&lt;/strong&gt;&lt;/p&gt;
						&lt;p&gt;… то можно это реализовать. Классический способ выглядит так:&lt;/p&gt;&lt;div class=&quot;code-box&quot;&gt;&lt;strong class=&quot;legend&quot;&gt;Код:&lt;/strong&gt;&lt;div class=&quot;blockcode&quot;&gt;&lt;div class=&quot;scrollbox&quot; style=&quot;height: 16.5em&quot;&gt;&lt;pre&gt;function inherit_A(Child, Parent)
{
    var F = function () { };
    F.prototype = Parent.prototype;

    Child.prototype = new F();
    Child.prototype.constructor = Child;
    Child.super = Parent.prototype;
}&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;p&gt;И его даже можно использовать:&lt;/p&gt;
						&lt;p&gt;&lt;strong&gt;$(document).ready(function ()&lt;br /&gt;{&lt;br /&gt;&amp;#160; &amp;#160; function Man(name) { this.name = name }&lt;br /&gt;&amp;#160; &amp;#160; Man.prototype.say = function () { console.log(&amp;quot;My name is &amp;quot; + this.name) }&lt;/p&gt;
						&lt;p&gt;&amp;#160; &amp;#160; function Gentleman(name) { Man.call(this, name); }&lt;br /&gt;&amp;#160; &amp;#160; inherit_A(Gentleman, Man);&lt;br /&gt;});&lt;/strong&gt;&lt;/p&gt;
						&lt;p&gt;У меня с ним, правда, есть одна маленькая проблема — обычно, для создания прототипа, я использую объектную нотацию, как было показано немного выше:&lt;/p&gt;
						&lt;p&gt;&lt;strong&gt;Class.prototype = &lt;br /&gt;{&lt;br /&gt;&amp;#160; &amp;#160; /*Методы*/&lt;br /&gt;}&lt;/strong&gt;&lt;/p&gt;
						&lt;p&gt;А, с этим наследованием, таким методом не очень попользуешься — или мои функции полностью затрут унаследованный прототип, или унаследованный прототип полностью затрет мои функции. К счастью, наследовать можно и по-другому.&lt;/p&gt;
						&lt;p&gt;&lt;strong&gt;Метод посвящается всем любящим объектные литералы&lt;/strong&gt;&lt;/p&gt;
						&lt;p&gt;Вот и он:&lt;/p&gt;&lt;div class=&quot;code-box&quot;&gt;&lt;strong class=&quot;legend&quot;&gt;Код:&lt;/strong&gt;&lt;div class=&quot;blockcode&quot;&gt;&lt;div class=&quot;scrollbox&quot; style=&quot;height: 18em&quot;&gt;&lt;pre&gt;function inherit_B(Child, Parent)
{
    var F = function () { };
    F.prototype = Parent.prototype;
    var f = new F();
    
    for (var prop in Child.prototype) f[prop] = Child.prototype[prop];
    Child.prototype = f;
    Child.prototype.super = Parent.prototype;
}&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;p&gt;Он просто берет, и копирует все свойства из прототипа родителя в прототип наследника, так что теперь мой любимый объектный литерал работает как надо:&lt;/p&gt;&lt;div class=&quot;code-box&quot;&gt;&lt;strong class=&quot;legend&quot;&gt;Код:&lt;/strong&gt;&lt;div class=&quot;blockcode&quot;&gt;&lt;div class=&quot;scrollbox&quot; style=&quot;height: 35em&quot;&gt;&lt;pre&gt;$(document).ready(function ()
{

    function Man(name) { this.name = name }
    Man.prototype =
    {
        cosntructor: Man,
        THOUGHTS: &amp;quot;wanna beer!&amp;quot;,
        say: function ()
        {
            console.log(&amp;quot;My name is &amp;quot; + this.name + &amp;quot; and i think:&#039;&amp;quot; + this.THOUGHTS + &amp;quot;&#039;&amp;quot;)
        }
    }

    function Gentleman(name, prefered_beverage)
    {
        Man.call(this, name);
        this.prefered_beverage = prefered_beverage;
    }
    Gentleman.prototype = { cosntructor: Gentleman, THOUGHTS: &amp;quot;it&#039;s teatime!&amp;quot; }
    inherit_B(Gentleman, Man)

    function Programmer(name, prefered_lang)
    {
        Gentleman.call(this, name, &amp;quot;Cofee&amp;quot;);
        this.prefered_lang = prefered_lang;
    }
    Programmer.prototype =
    {
        cosntructor: Programmer,
        THOUGHTS: &amp;quot;runtime error 138? wanna debug XD!&amp;quot;
    }
    inherit_B(Programmer, Gentleman)

    var man = new Man(&amp;quot;Jack&amp;quot;);
    var gentleman = new Gentleman(&amp;quot;John&amp;quot;, &amp;quot;Orange pekoe&amp;quot;);
    var programmer = new Programmer(&amp;quot;James&amp;quot;, &amp;quot;C++&amp;quot;);

    man.say();
    gentleman.say();
    programmer.say();
});&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;p&gt;И консоль со мной согласна:&lt;/p&gt;&lt;div class=&quot;code-box&quot;&gt;&lt;strong class=&quot;legend&quot;&gt;Код:&lt;/strong&gt;&lt;div class=&quot;blockcode&quot;&gt;&lt;div class=&quot;scrollbox&quot; style=&quot;height: 7.5em&quot;&gt;&lt;pre&gt;sample.js:11 My name is Jack and i think:&#039;wanna beer!&#039;
sample.js:11 My name is John and i think:&#039;it&#039;s teatime!&#039;
sample.js:11 My name is James and i think:&#039;runtime error 138? wanna debug!&#039;&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;p&gt;Отлично. А теперь представим гипотетическую ситуацию, когда родительских классов много, и нужно, например, вызвать какой-нибудь метод, который был перегружен 2-3 класса назад. В такой ситуации, конечно, лучше еще раз хорошенько присмотреться к архитектуре своего приложения. Теперь допустим, что там все работает, как задумано, тогда чертовски неудобно писать, например, так:&lt;/p&gt;&lt;div class=&quot;code-box&quot;&gt;&lt;strong class=&quot;legend&quot;&gt;Код:&lt;/strong&gt;&lt;div class=&quot;blockcode&quot;&gt;&lt;div class=&quot;scrollbox&quot; style=&quot;height: 4.5em&quot;&gt;&lt;pre&gt;this.super.super.super.someMethod.apply(this)&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;p&gt;&lt;strong&gt;Но это тоже решаемо&lt;/strong&gt;&lt;/p&gt;&lt;div class=&quot;code-box&quot;&gt;&lt;strong class=&quot;legend&quot;&gt;Код:&lt;/strong&gt;&lt;div class=&quot;blockcode&quot;&gt;&lt;div class=&quot;scrollbox&quot; style=&quot;height: 18em&quot;&gt;&lt;pre&gt;function inherit_C(Child, Parent)
{
    var F = function () { };
    F.prototype = Parent.prototype;
    var f = new F();

    for (var prop in Child.prototype) f[prop] = Child.prototype[prop];
    Child.prototype = f;
    Child.prototype[Parent.prototype.__class_name] = Parent.prototype;
}&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;p&gt;Эта функция в прототип потомка добавляет объект с ссылкой на прототип родителя. Чтобы она заработала как надо, в прототип каждого класса нужно добавить поле&lt;/p&gt;&lt;div class=&quot;code-box&quot;&gt;&lt;strong class=&quot;legend&quot;&gt;Код:&lt;/strong&gt;&lt;div class=&quot;blockcode&quot;&gt;&lt;div class=&quot;scrollbox&quot; style=&quot;height: 4.5em&quot;&gt;&lt;pre&gt;__class_name&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;p&gt;Вот, например, предположим, что в нашей иерархии появился класс BadProgrammer, которому как раз понадобился удобный доступ к прототипу далекого предка. Немного модифицируем предыдущий пример:&lt;/p&gt;&lt;div class=&quot;code-box&quot;&gt;&lt;strong class=&quot;legend&quot;&gt;Код:&lt;/strong&gt;&lt;div class=&quot;blockcode&quot;&gt;&lt;div class=&quot;scrollbox&quot; style=&quot;height: 35em&quot;&gt;&lt;pre&gt;$(document).ready(function ()
{
     function Man(name) { this.name = name }
    Man.pro
        THOUGHTS: &amp;quot;wanna beer!&amp;quot;,
        say: function ()
        {
            console.log(&amp;quot;My name is &amp;quot; + this.name + &amp;quot; and i think:&#039;&amp;quot; + this.THOUGHTS + &amp;quot;&#039;&amp;quot;)
        }
    }

    function Gentleman(name, prefered_beverage)
    {
        Man.call(this, name);
        this.prefered_beverage = prefered_beverage;
    }
    Gentleman.prototype =
    {
        __class_name: &amp;quot;Gentleman&amp;quot;,
        cosntructor: Gentleman,
        
        THOUGHTS: &amp;quot;it&#039;s teatime!&amp;quot;
    }
    inherit_C(Gentleman, Man)

    function Programmer(name, prefered_lang)
    {
        Gentleman.call(this, name, &amp;quot;Cofee&amp;quot;);
        this.prefered_lang = prefered_lang;
    }
    Programmer.prototype =
    {
        __class_name: &amp;quot;Programmer&amp;quot;,
        cosntructor: Programmer,

        THOUGHTS: &amp;quot;runtime error 138? wanna debug XD!&amp;quot;
    }
    inherit_C(Programmer, Gentleman)

    function BadProgrammer(name)
    {
        Programmer.call(this, name, &amp;quot;brainfuck&amp;quot;);
    }
    BadProgrammer.prototype =
    {
        __class_name: &amp;quot;BadProgrammer&amp;quot;,
        cosntructor: BadProgrammer,

        THOUGHTS: &amp;quot;runtime error 138? wanna debug XD!&amp;quot;,
        say: function () { this.THOUGHTS = this.Man.THOUGHTS; this.Man.say.apply(this); }
    }
    inherit_C(BadProgrammer, Programmer)

    var man = new Man(&amp;quot;Jack&amp;quot;);
    var gentleman = new Gentleman(&amp;quot;John&amp;quot;, &amp;quot;Orange pekoe&amp;quot;);
    var programmer = new Programmer(&amp;quot;James&amp;quot;, &amp;quot;C++&amp;quot;);
    var badprogrammer = new BadProgrammer(&amp;quot;Jake&amp;quot;);

    man.say();
    gentleman.say();
    programmer.say();
    badprogrammer.say();
});totype =
    {
        __class_name: &amp;quot;Man&amp;quot;,
        cosntructor: Man,

        THOUGHTS: &amp;quot;wanna beer!&amp;quot;,
        say: function ()
        {
            console.log(&amp;quot;My name is &amp;quot; + this.name + &amp;quot; and i think:&#039;&amp;quot; + this.THOUGHTS + &amp;quot;&#039;&amp;quot;)
        }
    }

    function Gentleman(name, prefered_beverage)
    {
        Man.call(this, name);
        this.prefered_beverage = prefered_beverage;
    }
    Gentleman.prototype =
    {
        __class_name: &amp;quot;Gentleman&amp;quot;,
        cosntructor: Gentleman,
        
        THOUGHTS: &amp;quot;it&#039;s teatime!&amp;quot;
    }
    inherit_C(Gentleman, Man)

    function Programmer(name, prefered_lang)
    {
        Gentleman.call(this, name, &amp;quot;Cofee&amp;quot;);
        this.prefered_lang = prefered_lang;
    }
    Programmer.prototype =
    {
        __class_name: &amp;quot;Programmer&amp;quot;,
        cosntructor: Programmer,

        THOUGHTS: &amp;quot;runtime error 138? wanna debug XD!&amp;quot;
    }
    inherit_C(Programmer, Gentleman)

    function BadProgrammer(name)
    {
        Programmer.call(this, name, &amp;quot;brainfuck&amp;quot;);
    }
    BadProgrammer.prototype =
    {
        __class_name: &amp;quot;BadProgrammer&amp;quot;,
        cosntructor: BadProgrammer,

        THOUGHTS: &amp;quot;runtime error 138? wanna debug XD!&amp;quot;,
        say: function () { this.THOUGHTS = this.Man.THOUGHTS; this.Man.say.apply(this); }
    }
    inherit_C(BadProgrammer, Programmer)

    var man = new Man(&amp;quot;Jack&amp;quot;);
    var gentleman = new Gentleman(&amp;quot;John&amp;quot;, &amp;quot;Orange pekoe&amp;quot;);
    var programmer = new Programmer(&amp;quot;James&amp;quot;, &amp;quot;C++&amp;quot;);
    var badprogrammer = new BadProgrammer(&amp;quot;Jake&amp;quot;);

    man.say();
    gentleman.say();
    programmer.say();
    badprogrammer.say();
});&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;p&gt;Класс BadProgrammer воспользовался мыслями самого первого звена нашей эволюционной цепочки классов, и, теперь, думает совсем не о том, о чём обычно думают программисты ;)&lt;/p&gt;&lt;div class=&quot;code-box&quot;&gt;&lt;strong class=&quot;legend&quot;&gt;Код:&lt;/strong&gt;&lt;div class=&quot;blockcode&quot;&gt;&lt;div class=&quot;scrollbox&quot; style=&quot;height: 9em&quot;&gt;&lt;pre&gt;My name is Jack and i think:&#039;wanna beer!&#039;
My name is John and i think:&#039;it&#039;s teatime!&#039;
My name is James and i think:&#039;runtime error 138? wanna debug!&#039;
My name is Jake and i think:&#039;wanna beer!&#039;&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;p&gt;&lt;strong&gt;И еще кое что&lt;/strong&gt;&lt;/p&gt;
						&lt;p&gt;Не представляю в какиx случаях это может пригодится, но, возможно, когда-нибудь, кому-нибудь может понадобится множественное наследование. Его тоже вполне можно реализовать:&lt;/p&gt;&lt;div class=&quot;code-box&quot;&gt;&lt;strong class=&quot;legend&quot;&gt;Код:&lt;/strong&gt;&lt;div class=&quot;blockcode&quot;&gt;&lt;div class=&quot;scrollbox&quot; style=&quot;height: 21em&quot;&gt;&lt;pre&gt;function inhertit_multiple(child)
{
    for( var i = 1; i &amp;lt; arguments.length; ++i )
    {
       var parent = arguments[i]
       for (var prop in parent.prototype)
       {
           if (!child.prototype[prop]) child.prototype[prop] = parent.prototype[prop];
       }
       child.prototype[parent.prototype.__class_name] = parent.prototype;
    }
}&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;p&gt;Не очень-то и сильно отличается от предыдущей версии.&lt;br /&gt;Для того, чтобы показать как оно работает, я придумал еще один вполне реалистичный пример:&lt;/p&gt;&lt;div class=&quot;code-box&quot;&gt;&lt;strong class=&quot;legend&quot;&gt;Код:&lt;/strong&gt;&lt;div class=&quot;blockcode&quot;&gt;&lt;div class=&quot;scrollbox&quot; style=&quot;height: 35em&quot;&gt;&lt;pre&gt;$(document).ready(function ()
{
    function Mammy() { this.mammy_message = &amp;quot;You Dont love me!&amp;quot; }
    Mammy.prototype =
    {
        __class_name: &amp;quot;Mammy&amp;quot;,
        say_something_wise: function () { console.log(this.mammy_message) }
    }

    function Daddy() { this.daddy_message = &amp;quot;I just don&#039;t want to be a dad!&amp;quot; }
    Daddy.prototype =
    {
        __class_name: &amp;quot;Daddy&amp;quot;,
        say_something_wise: function () { console.log(this.daddy_message) }
    }

    function Lad()
    {
        this.lad_message = &amp;quot;And i want a candy!&amp;quot;;
        Mammy.apply(this);
        Daddy.apply(this);
    }
    Lad.prototype =
    {
        __class_name: &amp;quot;Lad&amp;quot;,
        say_something_wise: function ()
        {
            this.Daddy.say_something_wise.call(this);
            this.Mammy.say_something_wise.call(this);
            console.log(this.lad_message);
        }
    }
    inhertit_multiple(Lad, Mammy, Daddy)


    var lad = new Lad();
    lad.say_something_wise();
});&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;p&gt;Если это запустить, то в консоли появится примерно то что мы и ожидаем&lt;/p&gt;&lt;div class=&quot;code-box&quot;&gt;&lt;strong class=&quot;legend&quot;&gt;Код:&lt;/strong&gt;&lt;div class=&quot;blockcode&quot;&gt;&lt;div class=&quot;scrollbox&quot; style=&quot;height: 7.5em&quot;&gt;&lt;pre&gt;I just don&#039;t want to be a dad!
You Dont love me!
And i want candy!&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;</description>
			<author>mybb@mybb.ru (dimaz)</author>
			<pubDate>Tue, 29 Nov 2011 23:47:05 +0400</pubDate>
			<guid>http://js.mybb.ru/viewtopic.php?pid=7#p7</guid>
		</item>
		<item>
			<title>Javascript примеси</title>
			<link>http://js.mybb.ru/viewtopic.php?pid=6#p6</link>
			<description>&lt;p&gt;Примесь (mixin) — это объект с набором функций, который сам по себе (отдельно от других объектов) не используется.&lt;/p&gt;
						&lt;p&gt;Вот, например, прекрасная примесь:&lt;/p&gt;&lt;div class=&quot;code-box&quot;&gt;&lt;strong class=&quot;legend&quot;&gt;Код:&lt;/strong&gt;&lt;div class=&quot;blockcode&quot;&gt;&lt;div class=&quot;scrollbox&quot; style=&quot;height: 15em&quot;&gt;&lt;pre&gt;var Mixin_Babbler =  
{
    say: function () 
    { 
        console.log(&amp;quot;My name is &amp;quot; + this.name + &amp;quot; and i think:&#039;&amp;quot; + this.THOUGHTS + &amp;quot;&#039;&amp;quot;);
    },
    argue: function() { console.log(&amp;quot;You&#039;re totally wrong&amp;quot;); }
};&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;p&gt;При попытке вызвать метод say просто так, нас ждет облом, потому что ни this.name, ни this.THOUGHTS в нашем объекте, почему-то, просто нет.&lt;br /&gt;На самом деле все правильно, чтобы использовать примесь по назначению нам нужен другой объект, и метод, который копирует все свойства переданных ему объектов-примесей в прототип функции конструктора — обычно такой метод называют extend, или mix, или как-нибудь в этом духе:&lt;/p&gt;&lt;div class=&quot;code-box&quot;&gt;&lt;strong class=&quot;legend&quot;&gt;Код:&lt;/strong&gt;&lt;div class=&quot;blockcode&quot;&gt;&lt;div class=&quot;scrollbox&quot; style=&quot;height: 24em&quot;&gt;&lt;pre&gt;function extend(object)
{
    var mixins = Array.prototype.slice.call(arguments, 1);
    for (var i = 0; i &amp;lt; mixins.length; ++i)
    {
        for (var prop in mixins[i])
        {
            if (typeof object.prototype[prop] === &amp;quot;undefined&amp;quot;)
            {
                object.prototype[prop] = mixins[i][prop];
            }
        }
    }
}&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;p&gt;Ну и как это использовать?&lt;/p&gt;
						&lt;p&gt;Легко и не напрягаясь — допустим, у нас есть парочка примесей:&lt;/p&gt;&lt;div class=&quot;code-box&quot;&gt;&lt;strong class=&quot;legend&quot;&gt;Код:&lt;/strong&gt;&lt;div class=&quot;blockcode&quot;&gt;&lt;div class=&quot;scrollbox&quot; style=&quot;height: 18em&quot;&gt;&lt;pre&gt;var Mixin_Babbler =  
{
    say: function () { console.log(&amp;quot;My name is &amp;quot; + this.name + &amp;quot; and i think:&#039;&amp;quot; + this.THOUGHTS + &amp;quot;&#039;&amp;quot;); },
    argue: function() { console.log(&amp;quot;You&#039;re totally wrong&amp;quot;); }
};

var Mixin_BeverageLover =
{
    drink: function () { console.log(&amp;quot;* drinking &amp;quot; + this.FAVORITE_BEVERAGE + &amp;quot; *&amp;quot;); }
};&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;p&gt;И, кому-то, возможно, уже знакомая, эволюционная цепочка:&lt;/p&gt;&lt;div class=&quot;code-box&quot;&gt;&lt;strong class=&quot;legend&quot;&gt;Код:&lt;/strong&gt;&lt;div class=&quot;blockcode&quot;&gt;&lt;div class=&quot;scrollbox&quot; style=&quot;height: 35em&quot;&gt;&lt;pre&gt;function Man(name)
{
    this.name = name;
}
Man.prototype =
{
    constructor: Man,
     
    THOUGHTS: &amp;quot;I like soccer&amp;quot;
}
extend(Man, Mixin_Babbler);

function Gentleman(name)
{
    this.name = name;
}
Gentleman.prototype =
{
    constructor: Gentleman,

    THOUGHTS: &amp;quot;I like Earl Grey&amp;quot;,
    FAVORITE_BEVERAGE: &amp;quot;Tea&amp;quot;
}
extend(Gentleman, Mixin_Babbler, Mixin_BeverageLover);

function Programmer(name)
{
    this.name = name;
}

Programmer.prototype =
{
    constructor: Programmer,

    THOUGHTS: &amp;quot;MVC, MVVM, MVP *___* like it!&amp;quot;,
    FAVORITE_BEVERAGE: &amp;quot;Cofee&amp;quot;,

    write_good_code: function () { console.log(&amp;quot;*writing best code ever*&amp;quot;); this.drink(); }
}
extend(Programmer, Mixin_Babbler, Mixin_BeverageLover);&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;p&gt;Каждый «класс» теперь не зависит от другого, а весь повторяющийся функционал реализован с помощью примесей.&lt;/p&gt;
						&lt;p&gt;Теперь стоит все проверить — вдруг заработает:&lt;/p&gt;&lt;div class=&quot;code-box&quot;&gt;&lt;strong class=&quot;legend&quot;&gt;Код:&lt;/strong&gt;&lt;div class=&quot;blockcode&quot;&gt;&lt;div class=&quot;scrollbox&quot; style=&quot;height: 21em&quot;&gt;&lt;pre&gt;var man = new Man(&amp;quot;Bob&amp;quot;);
var gentleman = new Gentleman(&amp;quot;Bill&amp;quot;);
var programmer = new Programmer(&amp;quot;Benjamin&amp;quot;);

man.say();
man.argue();

gentleman.say();
gentleman.drink();

programmer.say();
programmer.write_good_code();&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;p&gt;И консоль говорит что таки да, все как надо: &lt;/p&gt;&lt;div class=&quot;code-box&quot;&gt;&lt;strong class=&quot;legend&quot;&gt;Код:&lt;/strong&gt;&lt;div class=&quot;blockcode&quot;&gt;&lt;div class=&quot;scrollbox&quot; style=&quot;height: 13.5em&quot;&gt;&lt;pre&gt;My name is Bob and i think:&#039;I like soccer&#039;
*You&#039;re totally wrong*
My name is Bill and i think:&#039;I like Earl Grey&#039;
*drinking Tea*
My name is Benjamin and i think:&#039;MVC, MVVM, MVP like *__* it!&#039;
*writing best code ever*
*drinking Cofee*&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;p&gt;Собственно все. В отличие от «классического» наследования, реализация примесей очень простая и понятная. Существуют конечно некоторые вариации, но так или иначе ядро выглядит именно так.&lt;/p&gt;</description>
			<author>mybb@mybb.ru (dimaz)</author>
			<pubDate>Tue, 29 Nov 2011 23:38:51 +0400</pubDate>
			<guid>http://js.mybb.ru/viewtopic.php?pid=6#p6</guid>
		</item>
		<item>
			<title>Moment.js: легкая работа с датами</title>
			<link>http://js.mybb.ru/viewtopic.php?pid=5#p5</link>
			<description>&lt;p&gt;Moment.js это отличная библиотека для работы с датами в JavaScript.&lt;/p&gt;&lt;div class=&quot;code-box&quot;&gt;&lt;strong class=&quot;legend&quot;&gt;Код:&lt;/strong&gt;&lt;div class=&quot;blockcode&quot;&gt;&lt;div class=&quot;scrollbox&quot; style=&quot;height: 9em&quot;&gt;&lt;pre&gt;var now = moment();
moment.lang(&#039;ru&#039;);
console.log(now.format(&#039;dddd, MMMM DD YYYY, h:mm:ss&#039;));
// вторник, ноябрь 15 2011, 3:31:03&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;div class=&quot;code-box&quot;&gt;&lt;strong class=&quot;legend&quot;&gt;Код:&lt;/strong&gt;&lt;div class=&quot;blockcode&quot;&gt;&lt;div class=&quot;scrollbox&quot; style=&quot;height: 9em&quot;&gt;&lt;pre&gt;var halloween = moment([2011, 9, 31]); // October 31st
moment.lang(&#039;ru&#039;);
console.log(halloween.fromNow());
// 16 дней назад&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;div class=&quot;code-box&quot;&gt;&lt;strong class=&quot;legend&quot;&gt;Код:&lt;/strong&gt;&lt;div class=&quot;blockcode&quot;&gt;&lt;div class=&quot;scrollbox&quot; style=&quot;height: 9em&quot;&gt;&lt;pre&gt;var now = moment().add(&#039;days&#039;, 9);
moment.lang(&#039;ru&#039;);
console.log(now.format(&#039;dddd, MMMM DD YYYY&#039;));
// четверг, ноябрь 24 2011&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;div class=&quot;code-box&quot;&gt;&lt;strong class=&quot;legend&quot;&gt;Код:&lt;/strong&gt;&lt;div class=&quot;blockcode&quot;&gt;&lt;div class=&quot;scrollbox&quot; style=&quot;height: 9em&quot;&gt;&lt;pre&gt;var now = moment();
moment.lang(&#039;ru&#039;);
console.log(now.format(&#039;LLLL&#039;));
// вторник, 15 ноябрь 2011 15:27&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;</description>
			<author>mybb@mybb.ru (dimaz)</author>
			<pubDate>Tue, 29 Nov 2011 23:29:12 +0400</pubDate>
			<guid>http://js.mybb.ru/viewtopic.php?pid=5#p5</guid>
		</item>
		<item>
			<title>Попытка просто объяснить сложные, для новичков</title>
			<link>http://js.mybb.ru/viewtopic.php?pid=4#p4</link>
			<description>&lt;p&gt;Я попытаюсь просто объяснить, как работают замыкания в Javascript, как работает this, как создавать конструкторы для своих классов и чем различаются различные подходы к их созданию.&lt;br /&gt;Статья не претендует на новаторство, но достаточно доступные объяснения how it works для новичков я не видел, и на мой взгляд — это три самых узких места в Javascript (не привязанному к какому либо контексту, серверу или браузеру, например).&lt;/p&gt;
						&lt;p&gt;&lt;strong&gt;&lt;span style=&quot;font-size: 14px&quot;&gt;Замыкания&lt;/span&gt;&lt;/strong&gt;&lt;/p&gt;
						&lt;p&gt;Википедия нам говорит — замыканиями являются функции, определенные в других функциях.&lt;br /&gt;Замыканиями в javascript являются все функции, потому что они неявно лежат в теле «Главной функции».&lt;br /&gt;Что они из себя представляют? Что значит «замыкание»?&lt;br /&gt;За терминологией лежит очень простой смысл, который так же просто можно объяснить.&lt;br /&gt;Функции замыкания имеют возможность обращаться к переменным, созданным не только в контексте самой функции, но и на всех уровнях выше.&lt;br /&gt;Проиллюстрирую кодом:&lt;/p&gt;&lt;div class=&quot;code-box&quot;&gt;&lt;strong class=&quot;legend&quot;&gt;Код:&lt;/strong&gt;&lt;div class=&quot;blockcode&quot;&gt;&lt;div class=&quot;scrollbox&quot; style=&quot;height: 30em&quot;&gt;&lt;pre&gt;var a = 1;
var b = 2;
function closureFirstLevel() {
   return a + b;
}
function createrOfSecondLevelClosure() {
   var c = a + b;
   return function() {
        return c + closureFirstLevel() + a + b;
   }
}
var c = createrOfSecondLevelClosure();
function runCInAnotherContext() {
    return c();
}
console.log(a,b);
console.log(&#039;Сумма переменных a &amp;amp; b объявленных вне функции которая считает их сумму:&#039;,closureFirstLevel());
console.log(&#039;Сумма переменных c (объявленной на уровень выше), возвращаемого значения функции объявленной на два уровня выше, и переменных a и b объявленных так же на два уровня выше:&#039;,c());&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;p&gt;Теперь немного разберемся, если что-то стало непонятно.&lt;br /&gt;closureFirstLevel обращается к переменным объявленным вне этой функции(внешним переменным) и возвращает их сумму.&lt;br /&gt;createrOfSecondLevelClosure обращается к переменным a и b, сохраняет их сумму в переменной, объявленную в этой функции и возвращает функцию, которая считает сумму c, результата возвращаемого функцией closureFirstLevel и переменных a и b, объявленных на два уровня ниже.&lt;/p&gt;
						&lt;p&gt;Если запустить runCInAnotherContext он запустит функцию &#039;c&#039; (ведь createrOfSecondLevelClosure возвращает нам функцию, которую можно сохранить, и переменная &#039;c&#039;, объявленная в глобальной области видимости записывает эту функцию), которая будет работать как и задуманно: возвращать сумму переменных и результата функции, объявленных вне контекста функции runCInAnotherContext, так как при инициализации она замкнула на себя эти переменные.&lt;/p&gt;
						&lt;p&gt;Замыкания в массовом создании событий.&lt;br /&gt;Обращение к переменной, использующейся в цикле как счетчик, всегда передается как ссылка (хоть обычно и является числом), пока работает цикл. В итоге все созданные функции будут иметь последнее значение этой переменной.&lt;br /&gt;См. пример&lt;/p&gt;&lt;div class=&quot;code-box&quot;&gt;&lt;strong class=&quot;legend&quot;&gt;Код:&lt;/strong&gt;&lt;div class=&quot;blockcode&quot;&gt;&lt;div class=&quot;scrollbox&quot; style=&quot;height: 13.5em&quot;&gt;&lt;pre&gt;var elem = document.getElementsByTagName(&#039;a&#039;);
for (var n = 0, l = elem.length; n &amp;lt; l; n++ ) {
    elem[n].onclick = function() {
        alert(n);
        return false;
    }
} //Все время будет выдавать порядковый номер последнего эллемента в alert&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;p&gt;Можно замкнуть функцию:&lt;/p&gt;&lt;div class=&quot;code-box&quot;&gt;&lt;strong class=&quot;legend&quot;&gt;Код:&lt;/strong&gt;&lt;div class=&quot;blockcode&quot;&gt;&lt;div class=&quot;scrollbox&quot; style=&quot;height: 16.5em&quot;&gt;&lt;pre&gt;var elem = document.getElementsByTagName(&#039;a&#039;);
for (var n = 0, l = elem.length; n &amp;lt; l; n++ ) {
    elem[n].onclick = function(x) {
        return function() {
            alert(x);
            return false;
        }
    }(n); //Создаем функцию, сразу же её вызываем она возвращает нам порядковый номер элемента в alert при событии click на элементе.
}&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;p&gt;А так же можно использовать совершенно другой подход. У массивов метод forEach (является частью стандарта EcmaScript5) работает не совсем как цикл for.&lt;br /&gt;Он принимает один аргумент — функцию, которая будет обрабатывать элементы и которая принимает аргументы: elementOfArray, positionInArray, Array. И каждый раз эта функция вызывается, естественно, в своем контексте.&lt;br /&gt;Где-то достаточно принимать только первый аргумент, где-то больше.&lt;br /&gt;Мы можем эту функцию вызвать для нашего NodeList объекта, с помощью подмены контекста исполнения. (Для более полного разъяснения как это работает смотри часть статьи про this и про прототипы).&lt;/p&gt;&lt;div class=&quot;code-box&quot;&gt;&lt;strong class=&quot;legend&quot;&gt;Код:&lt;/strong&gt;&lt;div class=&quot;blockcode&quot;&gt;&lt;div class=&quot;scrollbox&quot; style=&quot;height: 13.5em&quot;&gt;&lt;pre&gt;var elem = document.getElementsByTagName(&#039;a&#039;);
Array.prototype.forEach.call(elem,function(el,position) {
    el.onclick = function() {
        alert(position);
        return false;
    }
})&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;p&gt;&lt;strong&gt;&lt;span style=&quot;font-size: 14px&quot;&gt;Ключевое слово this&lt;/span&gt;&lt;/strong&gt;&lt;br /&gt;Это слово ссылается на текущий объект, вызывающий функцию.&lt;br /&gt;Все функции, объявленные в глобальном контексте, являются методами (в браузере) объекта window, так же все функции, вызванные без контекста в this, ссылаются на window.&lt;br /&gt;Все довольно просто, пока не начинаешь разбираться с асинхронным программированием.&lt;/p&gt;&lt;div class=&quot;code-box&quot;&gt;&lt;strong class=&quot;legend&quot;&gt;Код:&lt;/strong&gt;&lt;div class=&quot;blockcode&quot;&gt;&lt;div class=&quot;scrollbox&quot; style=&quot;height: 30em&quot;&gt;&lt;pre&gt;var a = {
    property1: 1,
    property2: 2,
    func: function() {
        console.log(this.property1 + this.property2, &#039;test&#039;);
        return this.property1 + this.property2;
    }
}
console.log(a.func());
//this ссылается на объект &#039;a&#039;, которому принадлежит вызываемый метод.
setTimeout(function() {
console.log(a.func());
//this все так же ссылается на объект &#039;a&#039;, потому что функция, переданная в таймаут, замкнула на себя объект &#039;a&#039;
},100);

setTimeout(a.func,101);
//результат будет уже другой, NaN (как результат сложения undefined + undefined)
//потому, как здесь мы передаем лишь функцию, а сама по себе она не хранит ссылку на объект, к которому принадлежит&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;p&gt;Вместо setTimeout можно подставить setInterval или привязку обработчика события (например: elem.onclick или addEventListener), или любой другой способ выполнять отложенные вычисления, все они так или иначе вызывают потерю контекста исполнения. И чтобы сохранить this есть несколько путей.&lt;br /&gt;Можно просто обернуть это в анонимную функцию, можно создать переменную var that = this и использовать that вместо this (переменную создать вне вызываемой функции, естественно), а также воспользоваться самым правильным способом — насильно привязать. Для этого у функций есть встроенный метод bind (стал доступен в стандарте EcmaScript 5, поэтому для старых браузеров нужно реализовывать его поддержку), который возвращает новую функцию, привязанную к нужному контексту и аргументам. &lt;br /&gt;Примеры:&lt;/p&gt;&lt;div class=&quot;code-box&quot;&gt;&lt;strong class=&quot;legend&quot;&gt;Код:&lt;/strong&gt;&lt;div class=&quot;blockcode&quot;&gt;&lt;div class=&quot;scrollbox&quot; style=&quot;height: 35em&quot;&gt;&lt;pre&gt;function logCurrentThisPlease() {
   console.log(this);
}
logCurrentThisPlease(); //window

var a = {}
a.logCurrentThisPlease = logCurrentThisPlease;
a.logCurrentThisPlease(); //a
setTimeout(a.logCurrentThisPlease, 100); //window, так как мы передаем только ссылку на функцию
setTimeout(function() {
   a.logCurrentThisPlease();
}, 200);//a
setTimeout(function() {
   this.logCurrentThisPlease();
}.bind(a), 200);//a

var that = a;
function logCurrentThatPlease() {
   console.log(that);
}
logCurrentThatPlease(); //a
setTimeout(logCurrentThatPlease, 200);//a

var logCurrentBindedContextPlease = logCurrentThisPlease.bind(a); //первый аргумент — контекст, к которому нужно привязать, остальные аргументы — аргументы функции
logCurrentBindedContextPlease(); //a
setTimeout(logCurrentBindedContextPlease, 200); //a&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;p&gt;Ну и посложнее пример.&lt;br /&gt;Потеря в рекурсивных функциях, работающих через определенные интервалы времени.&lt;/p&gt;&lt;div class=&quot;code-box&quot;&gt;&lt;strong class=&quot;legend&quot;&gt;Код:&lt;/strong&gt;&lt;div class=&quot;blockcode&quot;&gt;&lt;div class=&quot;scrollbox&quot; style=&quot;height: 33em&quot;&gt;&lt;pre&gt;var a = {
    i: 0,
    infinityIncrementation: function() {
        console.log( this.i++ );
        if (this.i &amp;lt; Infinity) setTimeout(this.infinityIncrementation,500);
    }
}
a.infinityIncrementation(); // 0,undefined — не работает, потому что теряется контекст исполнения
a.infinityIncrementation = a.infinityIncrementation.bind(a); //не правильный но работающий способ
a.infinityIncrementation(); //0,1,2,3,4,5,6,7,8,9,10...Infinity-1
    
//правильный способ
var b = {
    i: 0,
    infinityIncrementation: function() {
        console.log( this.i++ );
        if (this.i &amp;lt; Infinity) setTimeout(function() {this.infinityIncrementation}.bind(this),500);
    }
}
b.infinityIncrementation(); //0,1,2,3,4,5,6,7,8,9,10...Infinity-1&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;p&gt;Почему второй работающий способ правильный, а первый неправильный, смотри в часть статьи про прототипы.&lt;/p&gt;
						&lt;p&gt;&lt;strong&gt;Методы функций, позволяющие менять контекст исполнения — bind,call,apply&lt;/strong&gt;&lt;/p&gt;
						&lt;p&gt;Function.bind — метод, принимающий первый аргумент как контекст, в котором он будет исполняться (каким будет this), и остальные как неограниченное количество аргументов, с которыми будет вызываться возвращаемая функция.&lt;br /&gt;Function.apply — метод, вызывающий функцию, первый аргумент – аргумент, который будет являться this в функции, второй — массив аргументов, с которыми будет вызвана функция.&lt;br /&gt;Function.call — то же самое, что и apply, только вместо второго аргумента, неограниченное количество аргументов, которые будут переданы в функцию.&lt;/p&gt;
						&lt;p&gt;&lt;strong&gt;&lt;span style=&quot;font-size: 14px&quot;&gt;Конструкторы объектов&lt;/span&gt;&lt;/strong&gt;&lt;/p&gt;
						&lt;p&gt;Многие создают конструкторы так:&lt;/p&gt;&lt;div class=&quot;code-box&quot;&gt;&lt;strong class=&quot;legend&quot;&gt;Код:&lt;/strong&gt;&lt;div class=&quot;blockcode&quot;&gt;&lt;div class=&quot;scrollbox&quot; style=&quot;height: 13.5em&quot;&gt;&lt;pre&gt;function SuperObjectConstructor() {
    this.a = 1;
    this.b = 2;
    this.summ = function() {
        return this.a + this.b;
    }
}&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;p&gt;И это не очень правильно. Что здесь неправильно? В данном примере неправильно только одно то, что функция объявлена в теле конструктора. Чем же это плохо?&lt;br /&gt;Во-первых, переопределить такую функцию через изменение прототипа функции не получится, то есть всем объектам сразу, инициализировавшимся через данный конструктор не получится изменить метод на другой. Пропадает возможность нормально наследоваться.&lt;br /&gt;Во-вторых — лишний расход памяти:&lt;/p&gt;&lt;div class=&quot;code-box&quot;&gt;&lt;strong class=&quot;legend&quot;&gt;Код:&lt;/strong&gt;&lt;div class=&quot;blockcode&quot;&gt;&lt;div class=&quot;scrollbox&quot; style=&quot;height: 7.5em&quot;&gt;&lt;pre&gt;var a = new SuperObjectConstructor();
var b = new SuperObjectConstructor();
console.log(a.summ == b.summ); //false&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;p&gt;Так как каждый раз заново создается функция.&lt;br /&gt;По хорошему тону (и для лучшего понимания кода) в конструкторах нужно определять только переменные (точнее поля объекта), которые только для него будут уникальны.&lt;br /&gt;Остальное лучше определять через прототип, в любом случае если только для конкретного объекта нужно переопределить общее свойство или метод, это можно сделать напрямую, не затрагивая прототип.&lt;br /&gt;Как это делается:&lt;/p&gt;&lt;div class=&quot;code-box&quot;&gt;&lt;strong class=&quot;legend&quot;&gt;Код:&lt;/strong&gt;&lt;div class=&quot;blockcode&quot;&gt;&lt;div class=&quot;scrollbox&quot; style=&quot;height: 35em&quot;&gt;&lt;pre&gt;function SuperObjectConstructorRightVersion(a,b) {
    this.a = a || this.constructor.prototype.a; //Берем дефолтное значение из прототипа конструктора
    this.b = b || this.constructor.prototype.b;
}
SuperObjectConstructorRightVersion.prototype = { //изменяем прототип полностью
    constructor: SuperObjectConstructorRightVersion, //так как мы его полностью заменяем нужно переопределить и конструктор
    a: 1,
    b: 2,
    summ: function() {
        return this.a + this.b;
    }
}
    /*или такой способ
SuperObjectConstructorRightVersion.prototype.a = 1;
SuperObjectConstructorRightVersion.prototype.b = 2;
SuperObjectConstructorRightVersion.prototype.summ = function() {....};
Но он менее элегантный и занимает больше места.
*/
var abc = new SuperObjectConstructorRightVersion();
console.log(abc.summ());//3
var bfg = new SuperObjectConstructorRightVersion(5,20);
console.log(bfg.summ());//25&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;p&gt;Многим не хватает в javascript возможностей, которые и так практически всегда нужны лишь для самоконтроля, таких как приватные методы и функции, к которым сможет напрямую обращаться только сам объект и его методы, и часто реализуют их как переменные и функции, объявленные в теле функции-конструктора. Так же многие говорят, что это — плохой тон, но мало где говорится, почему это плохой тон.&lt;br /&gt;Причина одна, то, что если в этом конструкторе нужно будет что-то изменить, нужно будет лезть в исходник и менять там, а не через прототип.&lt;br /&gt;Так же наследоваться от данного конструктора с целью расширить использование этих «приватных» свойств и методов будет крайне трудно.&lt;/p&gt;
						&lt;p&gt;Ещё один тонкий момент. Не привязывайте с помощью bind методы к контексту объекта (в конструкторе при инициализации, вне его в принципе можно), если хотите получить возможность переносить этот метод на другие объекты или просто использовать его в другом контексте.&lt;br /&gt;Это нам позволяют делать встроенные объекты.&lt;br /&gt;Например, можно использовать метод массивов forEach для других enumerable(перечисляемых) объектов. Например, для всех видов NodeList (живых и не живых) (как было показано выше).&lt;/p&gt;
						&lt;p&gt;Вывод&lt;/p&gt;
						&lt;p&gt;А теперь напишем не большой конструктор, как пример, объединяющий содержимое статьи.&lt;/p&gt;&lt;div class=&quot;code-box&quot;&gt;&lt;strong class=&quot;legend&quot;&gt;Код:&lt;/strong&gt;&lt;div class=&quot;blockcode&quot;&gt;&lt;div class=&quot;scrollbox&quot; style=&quot;height: 35em&quot;&gt;&lt;pre&gt;function Monster(name, hp, dmg) {
    this.name = name || this.constructor.prototype.name();
    this.hp = hp || this.constructor.prototype.hp;
    this.dmg = dmg || this.constructor.prototype.dmg;
}
Monster.prototype = {
    constructor: Monster,
    hp: 10,
    dmg: 3,
    name: function() {
        return &#039;RandomMonster&#039;+(new Date).getTime();
    },
    offerFight: function(enemy) {
        if (!enemy.acceptFight) {
            alert(&#039;this thing cant fight with me :(&#039;);
            return;
        }
        enemy.acceptFight(this);
        this.acceptFight(enemy);
    },
    acceptFight: function(enemy) {
        var timeout = 50 + this.diceRollForRandom();
        this.attack(enemy,timeout);
    },
    diceRollForRandom: function() {
        return (Math.random() &amp;gt;= 0.5 ? 50 : 20);
    },
    takeDmg: function(dmg) {
        console.log(this.name,&#039; was damaged (&#039;,dmg,&#039;),current HP is &#039;,this.hp-dmg);
        return this.hp -= dmg;
    },
    attack: function(enemy,timeout) {
        if (enemy.takeDmg(this.dmg) &amp;lt;= 0) {
            enemy.die();
            this.win();
            return;
        }
        this.to = setTimeout(function() {this.attack(enemy)}.bind(this),timeout);
    },
    win: function() {
        alert(&#039;My name is &#039; + this.name + &#039;, and Im a winner&#039;);
    },
    die: function() {
        alert(&#039;I died, &#039; + this.name);
        clearTimeout(this.to);
    }
}
var ChuckNorris = new Monster(&#039;Chuck Norris&#039;, 100, 100);
var MikhailBoyarsky = new Monster(&#039;Misha Boyarsky&#039;, 200, 50);
MikhailBoyarsky.offerFight(ChuckNorris);&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;p&gt;В этом нелепом примере в принципе есть все: сохранение контекста вызова, замыкания, и создание конструктора.&lt;/p&gt;</description>
			<author>mybb@mybb.ru (dimaz)</author>
			<pubDate>Wed, 23 Nov 2011 02:07:42 +0400</pubDate>
			<guid>http://js.mybb.ru/viewtopic.php?pid=4#p4</guid>
		</item>
		<item>
			<title>Всё что вы хотели знать о функциях но боялись спросить</title>
			<link>http://js.mybb.ru/viewtopic.php?pid=3#p3</link>
			<description>&lt;p&gt;&lt;span style=&quot;font-size: 14px&quot;&gt;&lt;strong&gt;Объявление функции&lt;/strong&gt;&lt;/span&gt;&lt;br /&gt;Если не обращать внимание на всякие извращения, то объявить функцию можно всего двумя способами:&lt;/p&gt;&lt;div class=&quot;code-box&quot;&gt;&lt;strong class=&quot;legend&quot;&gt;Код:&lt;/strong&gt;&lt;div class=&quot;blockcode&quot;&gt;&lt;div class=&quot;scrollbox&quot; style=&quot;height: 10.5em&quot;&gt;&lt;pre&gt;//создать именованную функцию
function a() { console.log(1); }

//создать анонимную функцию, а затем присвоить ее переменной
b = function() { console.log(2); }&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;p&gt;Разница между ними кажется небольшой, но это только кажется.&lt;br /&gt;&lt;span style=&quot;color: gray&quot;&gt;Что будет если выполнить этот код?&lt;/span&gt;&lt;/p&gt;&lt;div class=&quot;code-box&quot;&gt;&lt;strong class=&quot;legend&quot;&gt;Код:&lt;/strong&gt;&lt;div class=&quot;blockcode&quot;&gt;&lt;div class=&quot;scrollbox&quot; style=&quot;height: 9em&quot;&gt;&lt;pre&gt;console.log( &amp;quot;sample b&amp;quot; );
b();

function b() { console.log(1); }&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;p&gt;правильно — в консоли появится сначала текст с названием примера, а потом единичка, потому что все именованные функции переносятся в начало области видимости, и вызывать их можно когда угодно.&lt;br /&gt;&lt;span style=&quot;color: gray&quot;&gt;Усложняем задачу&lt;/span&gt;&lt;/p&gt;&lt;div class=&quot;code-box&quot;&gt;&lt;strong class=&quot;legend&quot;&gt;Код:&lt;/strong&gt;&lt;div class=&quot;blockcode&quot;&gt;&lt;div class=&quot;scrollbox&quot; style=&quot;height: 13.5em&quot;&gt;&lt;pre&gt;console.log( &amp;quot;sample c&amp;quot; );

function c() { console.log(1); }
    
c();

function c() { console.log(2); }&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;p&gt;Но нас ведь так просто не запутать. Функции переносятся в начало ровно в том порядке, в котором они были созданы, то есть в консоли будет 2.&lt;br /&gt;&lt;span style=&quot;color: gray&quot;&gt;Ладно, а так?&lt;/span&gt;&lt;/p&gt;&lt;div class=&quot;code-box&quot;&gt;&lt;strong class=&quot;legend&quot;&gt;Код:&lt;/strong&gt;&lt;div class=&quot;blockcode&quot;&gt;&lt;div class=&quot;scrollbox&quot; style=&quot;height: 7.5em&quot;&gt;&lt;pre&gt;console.log( &amp;quot;sample d&amp;quot; );
d();
var d = function() { console.log(2); }&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;p&gt;Ответ: а тут правила другие — это вообще не заработает, потому что значение переменной на момент вызова — undefined.&lt;/p&gt;
						&lt;p&gt;&lt;span style=&quot;color: gray&quot;&gt;А если так?&lt;/span&gt;&lt;/p&gt;&lt;div class=&quot;code-box&quot;&gt;&lt;strong class=&quot;legend&quot;&gt;Код:&lt;/strong&gt;&lt;div class=&quot;blockcode&quot;&gt;&lt;div class=&quot;scrollbox&quot; style=&quot;height: 12em&quot;&gt;&lt;pre&gt;console.log( &amp;quot;sample e&amp;quot; );
var e = function(){ console.log(1); } 
    
e();

e = function() { console.log(2); }&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;p&gt;Ну тут уже все ясно, да — на момент вызова е содержит в себе первую функцию, так что в консоли будет единичка. &lt;br /&gt;А теперь настало время для самого сложного вопроса *барабанная дробь*&lt;/p&gt;
						&lt;p&gt;&lt;span style=&quot;color: gray&quot;&gt;А что будет тут ?&lt;/span&gt;&lt;/p&gt;&lt;div class=&quot;code-box&quot;&gt;&lt;strong class=&quot;legend&quot;&gt;Код:&lt;/strong&gt;&lt;div class=&quot;blockcode&quot;&gt;&lt;div class=&quot;scrollbox&quot; style=&quot;height: 12em&quot;&gt;&lt;pre&gt;console.log( &amp;quot;sample f&amp;quot; );
var f = function() { console.log(1); }
f();

function f(){ console.log(2); } 
f();&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;p&gt;правильный ответ: два раза единичка. После своего объявления, переменные перекрывают функции.&lt;br /&gt;Всегда.&lt;/p&gt;
						&lt;p&gt;&lt;span style=&quot;font-size: 14px&quot;&gt;&lt;strong&gt;Immediate functions&lt;/strong&gt;&lt;/span&gt;&lt;/p&gt;
						&lt;p&gt;За этим названием скрываются «одноразовые» функции — они не имеют имени, и выполняются сразу после своего объявления.&lt;/p&gt;
						&lt;p&gt;Зачем это нужно? По большей части за тем, чтобы не засорять глобальное пространство имен. Например, если надо проинициализировать что-нибудь, и при инициализации нам потребуется парочка переменных которые потом вообще совсем не нужны. &lt;/p&gt;
						&lt;p&gt;Объявить такую функцию можно двумя, по сути, эквивалентными способами.&lt;/p&gt;&lt;div class=&quot;code-box&quot;&gt;&lt;strong class=&quot;legend&quot;&gt;Код:&lt;/strong&gt;&lt;div class=&quot;blockcode&quot;&gt;&lt;div class=&quot;scrollbox&quot; style=&quot;height: 19.5em&quot;&gt;&lt;pre&gt;console.log(&amp;quot;//immidiate function&amp;quot;);

//sample a
(function(){
    console.log( &amp;quot;a&amp;quot; );
})();

//sample b
(function(){
    console.log( &amp;quot;b&amp;quot; );
}());&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;p&gt;Отличий между ними нет никаких.&lt;/p&gt;
						&lt;p&gt;&lt;strong&gt;&lt;span style=&quot;font-size: 14px&quot;&gt;Init time branching&lt;/span&gt;&lt;/strong&gt;&lt;/p&gt;
						&lt;p&gt;Иногда случается, что значение функции зависит от какого-нибудь значения, которое после инциализации не меняется. ну что-нибудь вроде этого:&lt;/p&gt;&lt;div class=&quot;code-box&quot;&gt;&lt;strong class=&quot;legend&quot;&gt;Код:&lt;/strong&gt;&lt;div class=&quot;blockcode&quot;&gt;&lt;div class=&quot;scrollbox&quot; style=&quot;height: 19.5em&quot;&gt;&lt;pre&gt;// ПЛОХОЙ пример
function saySomethingClever(){
    var appleTest = /Apple/i;
    var googleTest = /Google/i;

    if( appleTest.test(navigator.vendor) ) console.log(&amp;quot;I love apples &amp;lt;3&amp;quot;)
    else if( googleTest.test(navigator.vendor) ) console.log(&amp;quot;android is everything for me &amp;lt;3&amp;quot;)
    else console.log(&amp;quot;i love this unpopular corporation too&amp;quot;)
}

saySomethingClever();&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;p&gt;Все здорово, кроме того, что каждый раз при вызове мы делаем ставшую уже абсолютно ненужной проверку. Переписать функцию можно так:&lt;/p&gt;&lt;div class=&quot;code-box&quot;&gt;&lt;strong class=&quot;legend&quot;&gt;Код:&lt;/strong&gt;&lt;div class=&quot;blockcode&quot;&gt;&lt;div class=&quot;scrollbox&quot; style=&quot;height: 24em&quot;&gt;&lt;pre&gt;// Хороший пример
var saySomethingClever = (function(){
    var appleTest = /Apple/i;
    var googleTest = /Google/i;

    if( appleTest.test(navigator.vendor) ) 
        return function(){ console.log(&amp;quot;I love apples &amp;lt;3&amp;quot;); }
    if( googleTest.test(navigator.vendor) )
        return function(){ console.log(&amp;quot;android is everything for me &amp;lt;3&amp;quot;); }
    
    return function(){ console.log(&amp;quot;i love this unpopular corporation too&amp;quot;); }
})();

saySomethingClever();&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;p&gt;Как мог заметить внимательный читатель, здесь используется ещё и immidiate function. Теперь проверка выполняется ровно один раз.&lt;/p&gt;
						&lt;p&gt;&lt;span style=&quot;font-size: 14px&quot;&gt;&lt;strong&gt;Self defining function&lt;/strong&gt;&lt;/span&gt;&lt;/p&gt;
						&lt;p&gt;Иногда бывает так, что при первом вызове функции нужно выполнить какие-нибудь дополнительные действия. Реализовать это можно следующим образом:&lt;/p&gt;&lt;div class=&quot;code-box&quot;&gt;&lt;strong class=&quot;legend&quot;&gt;Код:&lt;/strong&gt;&lt;div class=&quot;blockcode&quot;&gt;&lt;div class=&quot;scrollbox&quot; style=&quot;height: 18em&quot;&gt;&lt;pre&gt;var selfDefining = function()
{
    console.log(&amp;quot;some really heavy initialization occured&amp;quot;);
    console.log(&amp;quot;f*ck yeah!&amp;quot;);
    selfDefining = function(){
        console.log(&amp;quot;job done!&amp;quot;);
    }
}
selfDefining();
selfDefining();&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;p&gt;Такой прием помогает сэкономить одну переменную за пределами функции, по которой мы бы проверяли вызывалась функция или нет.&lt;/p&gt;
						&lt;p&gt;&lt;strong&gt;&lt;span style=&quot;font-size: 14px&quot;&gt;Currying&lt;/span&gt;&lt;/strong&gt;&lt;/p&gt;
						&lt;p&gt;С помощью этого приема можно создать частный вариант какой-нибудь довольно общей функции. Реализация выглядит так:&lt;/p&gt;&lt;div class=&quot;code-box&quot;&gt;&lt;strong class=&quot;legend&quot;&gt;Код:&lt;/strong&gt;&lt;div class=&quot;blockcode&quot;&gt;&lt;div class=&quot;scrollbox&quot; style=&quot;height: 16.5em&quot;&gt;&lt;pre&gt;function curry( fn ){
    var slice = Array.prototype.slice,
        storedArgs = slice.call( arguments, 1 );

    return function() {
        var args = storedArgs.concat( slice.call( arguments ) );
        return fn.apply( this, args );
    }
}&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;p&gt;Пока конечно нифига непонятно, но это нормально. Сейчас все объясню.&lt;br /&gt;Допустим у нас есть функция которая печатает сообщение.&lt;/p&gt;&lt;div class=&quot;code-box&quot;&gt;&lt;strong class=&quot;legend&quot;&gt;Код:&lt;/strong&gt;&lt;div class=&quot;blockcode&quot;&gt;&lt;div class=&quot;scrollbox&quot; style=&quot;height: 7.5em&quot;&gt;&lt;pre&gt;function printMessage( author, message ){
    console.log( author + &amp;quot; say: &amp;quot; + message )
}&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;p&gt;Но в данном модуле проекта в качестве значения author всегда используют me, так что нам очень желательна более частная её версия принимающая только строчку с сообщением, а автора вписывающая сама.&lt;/p&gt;&lt;div class=&quot;code-box&quot;&gt;&lt;strong class=&quot;legend&quot;&gt;Код:&lt;/strong&gt;&lt;div class=&quot;blockcode&quot;&gt;&lt;div class=&quot;scrollbox&quot; style=&quot;height: 6em&quot;&gt;&lt;pre&gt;var printMyMessage = curry( printMessage, &amp;quot;me&amp;quot; );
printMyMessage( &amp;quot;I would like to tell you about birds and bees in js world&amp;quot; );&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;p&gt;И теперь она у нас есть.&lt;/p&gt;</description>
			<author>mybb@mybb.ru (dimaz)</author>
			<pubDate>Wed, 23 Nov 2011 01:52:22 +0400</pubDate>
			<guid>http://js.mybb.ru/viewtopic.php?pid=3#p3</guid>
		</item>
		<item>
			<title>Роль javascript в природе</title>
			<link>http://js.mybb.ru/viewtopic.php?pid=2#p2</link>
			<description>&lt;p&gt;Что такого в этом javascript, почему javascript, и что есть еще полезного кроме него?&lt;/p&gt;
						&lt;p&gt;&lt;span style=&quot;font-size: 14px&quot;&gt;&lt;strong&gt;Что такое javascript?&lt;/strong&gt;&lt;/span&gt;&lt;br /&gt;Javascript - скриптовый язык, предназначенный для создания интерактивных веб-страниц.&lt;br /&gt;Javascript не требуется компилировать, он подключается к HTML-странице и работает &amp;quot;как есть&amp;quot;.&lt;br /&gt;Javascript - НЕ java, а совсем другой язык. Он похоже называется, но не более того. У javascript есть свой стандарт: ECMAScript, спецификация которого находится на сайте в разделе стандарт языка.&lt;br /&gt;Кто-то говорит, что javascript похож на Python, кто-то говорит о схожести с языками Ruby, Self. Правда заключается в том, что javascript сам по себе. Это действительно особенный язык.&lt;br /&gt;&lt;span style=&quot;font-size: 14px&quot;&gt;&lt;strong&gt;Что умеет javascript?&lt;/strong&gt;&lt;/span&gt;&lt;br /&gt;Изменять страницу, писать на ней текст, добавлять и удалять теги, менять стили элементов.&lt;br /&gt;Реагировать на события: скрипт может ждать, когда что-нибудь случится (клик мыши, окончание загрузки страницы) и реагировать на это выполнением функции.&lt;br /&gt;Выполнять запросы к серверу и загружать данные без перезагрузки страницы. Это иногда называют &amp;quot;AJAX&amp;quot;.&lt;br /&gt;Устанавливать и считывать cookie, валидировать данные, выводить сообщения и многое другое.&lt;/p&gt;
						&lt;p&gt;&lt;span style=&quot;font-size: 14px&quot;&gt;&lt;strong&gt;Уникальность javascript&lt;/strong&gt;&lt;/span&gt;&lt;br /&gt;Прелесть и соль Javascript заключаются всего в нескольких пунктах.&lt;/p&gt;
						&lt;p&gt;Полная интеграция с браузером&lt;br /&gt;Простые вещи делаются просто&lt;br /&gt;Поддерживается почти везде&lt;br /&gt;Этот компот преимуществ нельзя найти ни в одной из других технологий.&lt;/p&gt;
						&lt;p&gt;Например, такие технологии как ActiveX, VBScript, XUL - поддерживаются не в каждом браузере (не кросс-браузерны). Такие технологии как Flash, Silverlight, Java - не полностью интегрированы с браузером, работают в своем окружении.&lt;/p&gt;
						&lt;p&gt;Поэтому Javascript - уникальная технология, и таковой останется. Сейчас она развивается, создается язык Javascript 2 и новый интерпретатор.&lt;/p&gt;
						&lt;p&gt;Учите javascript.&lt;/p&gt;
						&lt;p&gt;&lt;span style=&quot;font-size: 14px&quot;&gt;&lt;strong&gt;Другие технологии. Альтернативы javascript.&lt;/strong&gt;&lt;/span&gt;&lt;br /&gt;Возможности javascript в некоторых областях, к сожалению, ограничены.&lt;br /&gt;Поэтому используются альтернативные технологии.&lt;/p&gt;
						&lt;p&gt;&lt;strong&gt;Java&lt;/strong&gt;&lt;br /&gt;Java - по сравнению с javascript, java-applet&#039;ы тяжелые, долго загружаются, но могут все. Они, как правило, используются там, где требуется почти-десктоп приложение. Очень сильно java&#039;у потеснила технология Flash.&lt;/p&gt;
						&lt;p&gt;Java - один из наиболее распространенных в мире языков. На нем существует громадное количество библиотек, с помощью которых можно описывать сложные интерфейсы и алгоритмы. Но на интернет-сайтах это нужно редко.&lt;/p&gt;
						&lt;p&gt;&lt;strong&gt;Flash&lt;/strong&gt;&lt;br /&gt;Flash изначально появился как кроссбраузерная платформа и язык для мультимедии, для оживления веба красочной анимацией, аудио и видео. Но не только это вкусно в технологии Flash.&lt;/p&gt;
						&lt;p&gt;Мощные средства для создания сетевых соединений(сокеты)&lt;br /&gt;Объекты для работы с мультимедиа: изображениями, аудио, видео&lt;br /&gt;Внутреннее хранилище объектов, которые не посылаются на сервер при каждом запросе, как куки.&lt;br /&gt;Удобные графические средства разработки для Flash&lt;br /&gt;Ну и для баланса - недостатки, по сравнению с javascript.&lt;/p&gt;
						&lt;p&gt;Отдельный контейнер. Например, нельзя выделить участок текста, частично находящегося в контейнере Flash.&lt;br /&gt;Плохо индексируется поисковиками. Поисковики ходят по HTML-ссылкам, но(пока?) не кликают по ссылкам внутри Flash-приложения.&lt;br /&gt;Из Flash можно легко вызвать javascript. Наоборот - сложнее, но тоже возможно, поэтому целесообразно знать обе технологии и применять их вместе.&lt;/p&gt;
						&lt;p&gt;&lt;strong&gt;JavaFX, Silverlight, XUL, vbscript&lt;/strong&gt;&lt;br /&gt;Эти технологии призваны дополнять javascript в области коммуникации и построения интерфейсов.&lt;/p&gt;
						&lt;p&gt;Пока они все далеки по распространенности от javascript и flash.&lt;/p&gt;
						&lt;p&gt;JavaFX - &amp;quot;легкая&amp;quot; надстройка над Java, будет работать только с Java на компьютере клиента.&lt;br /&gt;XUL - язык описания интерфейсов, удобен если писать планируете только под Mozilla. Также используется для написания десктоп-приложений.&lt;br /&gt;Silverlight - конкурент Flash от Microsoft на основе .NET. Другими OS, кроме Windows, поддерживается слабо. Не имеет широкого распространения.&lt;br /&gt;vbscript - попытка Microsoft сделать подобие javascript на основе Visual Basic. Не развивается, сильно уступает по возможностям, и, как следствие - практически не используется в современном веб-программировании.&lt;/p&gt;</description>
			<author>mybb@mybb.ru (dimaz)</author>
			<pubDate>Wed, 23 Nov 2011 01:36:06 +0400</pubDate>
			<guid>http://js.mybb.ru/viewtopic.php?pid=2#p2</guid>
		</item>
	</channel>
</rss>
