В этом уроке мы поговорим о прототипировании. Прототипирование — это возможность объекта javascript унаследовать свойства и методы от другого объекта. В уроке мы рассмотрим два способа протипирования объектов.

Если вы выведите в консоль объект, включая пустой, то вы увидите, что у любого объекта есть свойство __proto__. Через это свойство и указывается прототип объекта.

Пример прототипирования через свойство proto

object.__proto__ = anotherObject;

Свойство __proto__ поддерживается, начиная с Internet Explorer 10, т.е оно не кроссбраузерное.
Поэтому в реальной разработке используется ключевое слово prototype, которое к тому же, как правило, работает в связке с функциями-конструкторами. Поэтому старайтесь использовать именно prototype.

В конце урока я сделал несколько важных объявлений:
1. Я обновил свой сайт. Он стал более информативным и функциональным.
2. Недавно мною был приобретен хостинг и доменное имя http://codetogether.ru/. Приобретен он для ваc, ваших экспериментов и личных проектов. Как получить доступ к данному хостингу? Очень просто — вы оставляете мне заявку (имя, фамилия, email, ваши комментарии), а я создаю для вас поддомен вида http://вашафамилия.codetogether.ru/, и вы получаете безлимитное место на диске + базу данных при необходимости.

Код урока. Свойство proto

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
    </head>
    <body>

    <script>

    /*
    1.Постоянное свойство _proto
    2. Поиск свойств в другом объекте
    3. Если имеется свойство, оно будет читаться у объекта
    4. Дополнение (добавление свойства к объекту)
    5. Прототип только от одного объекта
    */


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

    var kamil = new Programmer("Камиль", "javascript");
    var ivan = {};

    console.log(kamil);
    console.log(ivan);        //(1)

    ivan.__proto__ = kamil;    //kamil - прототип объекта ivan

    console.log(ivan.name);    //(2)

    var alex = {
        name: "Александр",
        lang: "php"
    };

    alex.__proto__ = kamil;

    console.log(alex.name); // (3)

    alex.mail = "mail@kamil-abzalov.ru";    // (4)

    console.log(alex);

    console.log("\n\n");

    console.log(kamil);
    console.log(ivan);
    console.log(alex);

    var peter = {};

    peter.__proto__ = kamil;
    console.log(peter);

    peter.__proto__ = alex;
    console.log(peter); // (5)

    </script>

    </body>
</html>

Код урока. Свойство prototype

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
    </head>
    <body>


        <script>

            var ivan = {
                name: "Иван",
                lang: "php",
                likeSport: true
            };

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

            Programmer.prototype = ivan;

            var kamil = new Programmer("kamil", "javascript");
            console.log(kamil);

        </script>


    </body>
</html>

JavaScript. Прототипирование

Пример прототипирования через свойство proto

Код урока. Свойство proto

Код урока. Свойство prototype

0 Comments