Примери за обекти на JavaScript

Обектите са крайъгълният камък на javascript. Вградените типове данни са представени като обекти. За да бъдете успешен разработчик на JavaScript, трябва да имате ясна представа как работят. Строителните блокове на обекта се наричат ​​свойства на полетата на обекта на javascript. Те се използват за описване на всеки аспект на даден обект. Имотът може да опише дължината на списъка, цвета на небето или датата на раждане на лицето. Създаването на обекти е лесен процес. Езикът осигурява синтаксис, известен като буквален обект, който е представен с фигурни скоби.

Достъп до свойства

Езикът предоставя два записа за достъп до свойства. Първият и най-известен като точкова маркировка. С точковата нотация, достъпът до ресурса може да се получи чрез посочване на името на хоста на обекта, последвано от периода и името на имота. Например, когато object.foo първоначално е присвоен стойност от една, тогава неговата стойност ще бъде 2 след изпълнение на оператора на обекта на javascript.


Алтернативен синтаксис за достъп е известен като запис в скоби. В нотацията за името на обекта следва набор от квадратни скоби. В тях името на свойството е посочено като низ: object ["foo"] = object ["foo"] + 1. Той е по-изразен от point-notation, защото позволява на променливата да посочи цялото име или част от него. Това е възможно, защото интерпретаторът на JavaScript обект автоматично преобразува израза в низ и след това получава съответното свойство. Имената на свойствата се създават "в движение" чрез свързване на съдържанието на променливата f с "oo" низ: var f = "f"; обект [f + "oo"] = "лента". Осигурява маркировкаИмената на свойствата съдържат знаци, които са забранени от точкова нотация. Например, следващият оператор е напълно легален в скоби. Въпреки това, ако потребителят се опита да създаде същото име на свойството на нотацията, той ще срещне синтактична грешка:

обект ["! Достъпът до свойствата на вложени обекти на javascript може да се получи чрез свързване на точки и /или скоби. Например, следният обект съдържа вграден обект с име baz, съдържащ друг обект с име foo, който има свойството с лентата с име от пет: var object = {baz: {foo: {bar: 5}}}. Следните изрази получават достъп до вложеното свойство на лентата. Първият израз използва точкова нотация, докато вторият израз използва квадратна нотация. Третият израз комбинира двата записа за постигане на същия резултат:
  • object.baz.foo.bar;
  • обект ["baz"] ["foo"] ["bar"];
  • обект ["baz"] Foo ["bar"].
  • Изрази, подобни на показаните в предишния пример, могат да доведат до влошаване на производителността в случай на злоупотреба и да доведат до неуспех на обекта на javascript. Оценяването на всяка точка или израз в скоби изисква време. Ако същото свойство се използва няколко пъти, тогава има смисъл да се осъществи достъп до имота веднъж и след това да се запише стойността на локалната променлива за всички бъдещи цели.

    Функция като метод

    Когато дадена функция се използва като свойство на обект, тя се нарича метод. Подобно на свойствата, те са посочени в обозначението на обектни литерали. Например: var object = {сума: функция (foo bar) {return foo + bar;}}. Методите на javascript обект могат да бъдат извикани отизползване на тагове и скоби. Следният пример извиква метода sum () от предишния пример, използвайки двата записа:
  • object.sum (1 2);
  • обект ["sum"] (1 2). Обозначението на обекта е полезно за създаване на нови обекти, но не може да добавя съществуващи свойства или методи. За щастие добавянето на нови данни е толкова лесно, колкото и създаването на оператор за присвояване. Създава се празен обект. След това, като се използват операторите за присвояване, се добавят две свойства, foo и bar, както и метода baz:
  • var object = {};
  • object.foo = 1;
  • object.bar = нула;
  • object.baz = function () {return "hello from baz ()";}.
  • Инкапсулиране на програми

    Основната идея на обектно-ориентираното програмиране е да се разделят програмите на по-малки части и всеки от тях отговаря за управлението на собствената си държава. Следователно, някои познания за това как част от работните програми могат да бъдат локални за тази част. Някой, който работи по останалата част от програмата, не трябва да помни или дори да знае за него. Когато тези местни данни се променят, трябва само да актуализирате кода директно около него. Различните части на такива програми взаимодействат помежду си чрез интерфейси, ограничени набори от функции или свързвания, които осигуряват полезна функционалност на по-абстрактно ниво, скривайки точното им изпълнение. Такива части на програмата са моделирани с помощта на обекти. Техният интерфейс се състои от определен набор от методи и свойства. Свойствата, които са част от интерфейса, се наричат ​​публични. Други, които не го правяттрябва да се отнася за външния код, наречен частен.
    Много езици предоставят възможност за разграничаване на публични и частни имоти и не позволяват външен код за достъп до частни. javascript, отново взе минималистичен подход, все още не е постигнат. В момента се работи за добавяне на този език. Ето защо, JavaScript-програмистите успешно ще използват тази идея. По принцип достъпният интерфейс е описан в документация или коментари. Също така е обичайно в началото на имената на свойствата да се поставя символ за подчертаване (_), за да се посочи, че тези свойства са частни. Разделянето на интерфейса от изпълнението е чудесна идея. Обикновено се нарича капсулиране.

    Имоти

    [палец] http://hi-news.pp.ua/uploads/posts/2018-09/obyekti-javascript-prikladi_1.jpeg
    с скоби {} се нарича литерал на обекта. Можете веднага да поставите някои свойства в такива скоби {}. Например двойките "ключ: стойност и т.н.": нека потребител = {//име на обект: "Джон", //по ключ "име" съхранява стойността "Джон" възраст: 30 //по ключ "възраст" съхранява стойността 30}. Свойството има ключ (наричан още "name" или "id") преди двоеточие ":" и стойността вдясно от него. Потребителският обект има две свойства. Полученият потребителски JavaScript обект с два подписани файла с надпис "име" и "възраст". Можете да добавяте, изтривате и четете файлове от него по всяко време. Стойностите на свойствата са достъпни с помощта на точкова нотация. Тя може да бъде от всякакъв вид. Можете да добавите логическа стойност. За да изтриете свойство, използвайте delete в случай на JavaScript обект Error.

    Всички обекти на javascript грешки са потомци на обекта Error илинаследен обект:
  • Синтаксис Грешка обектът се наследява от грешката на обекта.
  • JSON парс Грешка на определен тип на синтактичната грешка на обект.
  • За да се задълбочи разбирането за това как приложенията се справят с JavaScript грешките, е по-добре да се запознаете с Airbrake javascript, инструмента за проследяване на грешки в реално време и веднага да разберете какво се е случило с javascript кода. Съобщения за грешки, които потребителят може да получи, преди да изтрие обекта на javascript:
  • Лош контролен символ в литерала на низа.
  • Лош знак в буквален литерал.
  • Лош изход Unicode.
  • Лош бягство.
  • Непрекъснат низ.
  • Неочакван не-цифров код.
  • Няма цифри след десетичната запетая.
  • Непрекъснат фракционен номер.
  • Не са показани цифри след показателя за степен.
  • След знака на експонента няма цифри.
  • Експоненциалната част няма числа.
  • Неочакван край на данните.
  • Неочаквана ключова дума.
  • Неочакван символ.
  • Край на данните при четене на съдържанието на даден обект.
  • Очаквано име на собственост или '}'.
  • Изчислителни свойства

    Можете да използвате квадратни скоби в буквален обект. Това се нарича изчислени свойства. По-долу е даден пример. Стойността на собствеността на vichislima е проста: [плод] означава, че наименованието на имота трябва да бъде взето от плодове. Така че, ако посетителят влезе "ябълка", чантата ще бъде {apple: 5}. Можете да използвате по-сложни изрази в квадратни скоби: нека fruit = 'apple'; нека чанта = {[плод + 'Компютри']: 5 //bag.appleComputers = 5};Квадратните скоби са много по-мощни от точковите етикети. Те позволяват имената и променливите на свойствата. Но те също са по-тромави за писане. Тъй като през повечето време, когато имената на свойствата са известни и прости, се използва точка. И ако имате нужда от нещо по-сложно, тогава превключете на квадратни скоби.

    Резервиране на думи

    Променлива не може да има име, равно на едно от резервираните думи, като например за, нека, връщане и т.н. Но при сортиране на JavaScript обекти няма такова ограничение. ,
    [thumb] http://hi-news.pp.ua/uploads/posts/2018-09/obyekti-javascript-prikladi_2.jpeg
    По принцип всяко име е позволено , но има и специална: "__proto__" получава специално обжалване по исторически причини. Например, можете да зададете неговата стойност, различна от обекта: let obj = {}; obj .__ proto__ = 5; сигнал (obj .__ proto__); //[object Object], не работи както е планирано Както е ясно от кода, целта на примитив 5 се игнорира. Това може да бъде източник на грешки и дори уязвимости, ако операторът възнамерява да съхранява произволни двойки ключ-стойност в обекта и да позволи на посетителя да определи ключовете. В този случай посетителят може да избере "proto" като ключ и да добави към обекта на javascript. Има начин да направим обектите, третирани от __proto__ като редовно свойство. Има и друга карта с данни, която поддържа произволни клавиши.

    Целочислени свойства

    Терминът "цяло числово свойство" тук означава низ, който може да бъде трансформиран от цялото без модификация. Така например, "49" е цялото име на собственост, защото когато се преобразува в цяло число и обратно, то е същото. Но "+49" и "1.2" не сатакова. От друга страна, ако ключовете не са цели числа, те се преобразуват в реда на създаване. Пример по-долу.
    [thumb] http://hi-news.pp.ua/uploads/posts/2018-09/obyekti-javascript-prikladi_3.jpeg
    За да разрешите проблема с помощта на телефонни кодове, можете да измама, като направи кодовете недопустими. Добавянето на "+" (знак плюс) е достатъчно преди всеки код. Сега ще работи като среща. Разликата между обекти от примитиви е, че те се съхраняват и копират "от връзката". Примитивните стойности се присвояват и копират "като цяло число". Променливата съхранява "адрес в паметта", а не самия обект или "връзка" към него. Можете да използвате всяка променлива за достъп и промяна на нейното съдържание.
    [thumb] http://hi-news.pp.ua/uploads/posts/2018-09/obyekti-javascript-prikladi_4.jpeg
    В горния пример е показано, че има само един обект и администратор, за да го въведете. След това, ако по-късно ще използва друг ключ (потребител), потребителят ще открие промените. Операторите на равенство == и стриктното равенство === за обектите работят по същия начин. Двата обекта са равни, само ако са един и същ обект. За сравнения като obj1 & gt; obj2 или за сравнение с примитивните obj == 5 обекти се преобразуват в примитиви. Честно казано, подобни сравнения са много редки и обикновено са резултат от грешки при кодирането.

    Проверка на обекта на JavaScript

    Обектите имат достъп до всяко свойство. Но ако изобщо не съществува, това няма да бъде грешка. Неопределен е само достъпът до несъществуващи свойства. Той осигурява много често срещан начин за тестване на имота и сравнение с него.По-долу е даден пример.
    [thumb] http://hi-news.pp.ua/uploads/posts/2018-09/obyekti-javascript-prikladi_5.jpeg
    Използване на „in“ за имоти, които не се дефинират , Обикновено се извършва строга проверка на "=== undefined" сравнение. Има специален случай, когато той се провали и "в" работи правилно. Това е, когато има свойство на обект, но то остава неопределено.
    В горния код, обектът на obj.test съществува технически. , Следователно операторът работи правилно. Подобни ситуации възникват много рядко, тъй като недефинираните обикновено не са предназначени. Обикновено се използват нулеви "неизвестни" или "празни" стойности. Така операторът в действителност е гост в кода.

    Forin цикъл

    За да навигирате всички ключове от обект към обект, има специална форма на цикъла: forin. Това е съвсем различно нещо за дизайна (;;). По-долу е даден пример.
    [thumb] http://hi-news.pp.ua/uploads/posts/2018-09/obyekti-javascript-prikladi_7.jpeg
    Необходимо е да се обърне внимание, че всички строители «за» ви позволява да обявите цикълна променлива вътре в цикъла като ключ за пускане. Като алтернатива можете да използвате различен ключ с име на променлива вместо това. Например, за (нека prop в obj) също е широко използван. Има алтернативна "квадратна скоба", която работи с всяка линия.
    [thumb] http://hi-news.pp.ua/uploads/posts/2018-09/obyekti-javascript-prikladi_8.jpeg
    Обектът е валиден идентификатор на променлива, т.е. няма интервали или други ограничения. Необходимо е да се обърне внимание, че линията вътре в скобите е правилно цитирана. Квадратните скоби също осигуряват начин да го получитеиме на имота в резултат на всеки израз, за ​​разлика от литералната линия - с променливата: let key = "харесва птиците"; //същото като потребител ["likes birds"] = true; user [ключ] = true Тук ключът на променливата може да се изчисли по време на изпълнение и зависи от потребителския вход и след това ще се използва за достъп до имота. Това дава на програмистите по-голяма гъвкавост. Петниста нотация не може да се използва по същия начин, тъй като ще има разбор на обекта на javascript. По-долу е даден пример.
    [thumb] http://hi-news.pp.ua/uploads/posts/2018-09/obyekti-javascript-prikladi_9.jpeg

    Const object

    Обявеният const обект може да бъде променен. По-долу е даден пример.
    [thumb] http://hi-news.pp.ua/uploads/posts/2018-09/obyekti-javascript-prikladi_10.jpeg
    Може да изглежда, че обектът javascript върху линията (*) ще предизвика грешка, но това не е така. Това е така, защото const улавя стойността на самия потребител. И тогава потребителят поддържа връзка към същия обект през цялото време. Линията (*) влиза вътре в обекта, не заема потребителя. Const ще направи грешка, ако се опитате да инсталирате потребителя и нещо друго. Клониране и сливане, Object.assign създава друга връзка към същия обект, ако искате да я дублирате. Това също е възможно, но малко по-сложно, защото javascript няма вграден метод. Всъщност това е рядкост. Копирането от връзката се използва в повечето случаи. Но ако наистина имате нужда, тогава трябва да създадете обект на javascript и да копирате структурата на съществуващ, като копирате неговите свойства на примитивно ниво. По-долу е даден пример.
    [thumb] http://hi-news.pp.ua/uploads/posts/2018-09/obyekti-javascript-prikladi_11.jpeg
    И за това можете да използвате метода Object.assign. , Аргументи dest и src1, srcN са обекти.Копира свойствата на всички обекти src1, srcNINTO dest. С други думи, свойствата на всички аргументи, започвайки от второто, се копират в 1-ви. После се връща в деста. Например, можете да го използвате, за да обедините няколко обекта в едно.
    [thumb] http://hi-news.pp.ua/uploads/posts/2018-09/obyekti-javascript-prikladi_12.jpeg
    И можете да използвате Object.assign, за да замените цикъла просто клониране. Той копира всички свойства на потребителя в празен обект и го връща, точно като цикъл, но по-кратък. Досега се приема, че всички потребителски свойства са примитивни. Но свойствата могат да бъдат връзки към други обекти. За да поправите това, трябва да използвате клониращ цикъл, който проверява всяка стойност на потребителя [key] и, ако е обект, повтаря структурата му. Това се нарича "дълбоко клониране". Съществува стандартен алгоритъм за дълбоко клониране, който обработва горепосочения случай и по-сложни случаи, наречени Структуриран клонингов алгоритъм. За да не изобретявате колелото, можете да използвате работеща реализация от библиотеката javascript lodash, методът се нарича _.cloneDeep (obj).

    Разширени техники

    Ако програмист се срине върху обект и се стреми да получи всички свойства в същия ред, в който са били добавени, той може да разчита на "подреждане по специален начин", когато се сортират целочислени свойства и други в реда на създаване на javascript-обект. Разширените обектни техники се справят с понятия, които рядко се използват в javascript. Това се дължи на факта, че в нормални ситуации тези мощни функции не са необходими. Някои от тези методи не могатработа в по-стари браузъри, като ранните версии на Netscape 4. Използването на прототипа може да се използва за създаване на JavaScript обекти и всички методи на mycircle, а не само на нови. Това дава смесен товар на производителността. Те не трябва да държат отделни копия на методите за всеки случай на обекта, така че може да отнеме по-малко памет за работа, но за да ги търсят, браузърът трябва да търси текущите и родителските области. Това може да доведе до максимално забавяне. Като правило, потребителят трябва да използва това, което е подходящо за кода, вместо да го базира върху изпълнението, освен ако не притежава много специфична контролирана среда.
    [thumb] http://hi-news.pp.ua/uploads/posts/2018-09/obyekti-javascript-prikladi_13.jpeg

    Return true в някои случаи може да е необходимо собствеността на обекта да бъде свързана със самия обект или някъде по веригата на прототипа. В javascript всички обекти използват метода hasOwnProperty, който връща true, ако това свойство е свързано с потребителския модел на отделен обект. В този случай е възможно да се провери дали конструкторът на обекта има същото свойство със същата стойност като инстанцията на самия обект. Това може да даде невалиден резултат, ако има отделни свойства на обекта на javascript с една и съща стойност както за инстанцията на обекта, така и за прототипа на веригата. Методът hasOwnProperty приема един параметър - име на свойство под формата на низ.

    По същия начин можете да създавате частни методи. Това е само създадена функциявътрешна конструкторна функция. Може да изглежда объркващо за някого, но така работи. Частната функция може да бъде извиквана само от самия конструктор или от методи, дефинирани в реда. Те могат да се използват като публични методи, ако са присвоени на публичен конструктор и са достъпни чрез отворени методи на обекти на javascript. функция myob () {функция cantBeSeen () {alert (secretValue); } може да бъде privateValue = "; this.method1 = function () {secretValue = 'без изненади'; cantBeSeen ();} this.method2 = cantBeSeen;} може единOb = new myob (); oneOb.method1 (); //сигнали "няма изненади" oneOb.method2 (); //предупреждава "няма изненади".

    Шаблон за команди

    Командните обекти позволяват свободно свързани системи, като разделят тези, които издават заявки от обекти и, всъщност, процес Заявка: Тези заявки се наричат ​​събития и кодът обработва заявките се нарича обработващи събития. Да предположим, че създавате програми, които поддържат действията на клипа, клипа и поставянето на клипборда. например едно кликване Кликнете с десния бутон върху текстово поле или комбинация от ключове.Обектните команди ви позволяват да централизирате обработката на тези действия, по една за всяка операция, когато е необходима само една команда за обработка на всички заявки за рязане, една за всички заявки за копиране и една за всички заявки за поставяне. Тъй като екипите централизират цялата обработка, те също често участват в обработката на функциите за анулиране на цялата програма. Значителни подобрения могат да бъдат направени чрез прилагане на съвременни техники на javascript, което води до по-ефективни, надеждни и поддържани приложения. За да разберете как еможете да използвате javascript + jQuery шаблони. Този уникален пакет включва оптимизиран javascript за всички шаблони на GoF, използвайки по-усъвършенствани функции като пространства от имена, прототипи, модули, функционални обекти, затваряне, анонимни функции и др. Ако потребителите се нуждаят от най-новите притурки и шаблонни техники за javascript, jQuery шаблони и шаблонни архитектури, това е най-добрият вариант. Този пакет съдържа ценна и актуална информация за разработчиците на javascript. Ето какво включва:
  • оптимизирани с JavaScript шаблони на GoF.
  • Шаблони за модерен дизайн за javascript.
  • Шаблони за дизайн на моделен изглед.
  • jQuery шаблони за проектиране.
  • Архитектурни шаблони javascript-идиоми.
  • Примери за приложения (MVC, SPA и др.)
  • Предложените основи на синтаксиса на JavaScript обекта са много важни за начинаещите програмисти. Първо трябва да разберете обектите, след това ще има познания за обектно-ориентирано програмиране. Изключително важно е да имаме дълбоко разбиране на този материал, тъй като той служи като основа за останалата част от езика на javascript.

    Свързани публикации

    Трансформирайте CSS: теория и примери за трансформация на обекти Разпределено поколение: дизайн, обекти, тенденции и развитие, описание на обекти Dynamic CSS: Преобразувайте обекти PHP обекти и масиви: масив push & pop ООП, обекти, класове. Наследяване и интерфейси ООП, обекти, класове. Наследяване и интерфейси