ТОП 10:

Объявление классов в языке программирования Javascript.



Для создание класса достаточно объявить имя класса и присвоить ему объект
Пример создания пустого класса:

classes.Class("EmptyClass", {} ); //создали пустой класс classes.EmptyClass

alert( classes.EmptyClass ); //увидим [classEmptyClass]

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

classes.Class("PrivatePropertyClass"), function(){

//наши приватные переменные/свойства

Var privateProp = "tratata",

twoPrivateProp = "lalala";

// возвращаем объект самого класса

return {

}

});

//Создадим экземпляр класса

var privateTest = new classes.PrivatePropertyClass();

//пробуем получить приватные свойства

alert(privateTest.privateProp ); //увидим undefined

Создавать классы можно не только в контексте classes но и в любом другом.
Для примера я покажу несколько способов как это делается.
Вот способы создания класса в любом удобном контексте:

// создание класса например в контексте window

classes.Class.call( window, "GlobalClass", {} );

// создание класса в текущем контексте

Var CurrentContextClass = classes.Class( {} );

// создать класс в текущем контексте но при этом он будет

// доступен и в контексте classes c именем ClassesContextClass

var CurrentContextClass = classes.Class( "ClassesContextClass", {} );

 

29) Использование ключевого слова this в языке программирования javascript.

Описание, примеры

Оператор this возвращает ссылку на объект, являющийся текущим контекстом вызова. Это позволяет обращаться к свойствам "текущего" объекта: this.property.

Текущий объект не является жестко фиксированным и зависит от контекста вызова функции. Он является, своего рода, скрытым параметром.

Есть четыре различных варианта его передачи.

Тип Способ this
неявно, через вызов метода object.method(...) object
явно, через call function.call(object,...) object
явно, через apply function.apply(object,...) object
неявно, через вызовnew new constructor(...) новый, создаваемый объект

Если ни один из этих способов не задействован, то this указывает на глобальный объект: в браузере это window.

Это происходит при вызове функции без объекта: myFunc(params).

При манипуляциях с DOM при помощи javascript, this обычно используется для работы с событиями. При этом значение this указывает на текущий DOM-элемент, в контексте которого вызван обработчик.

Привязка методов

Так как this не привязано жестко к объекту, то можно привязывать один и тот же метод к любым классам.

walk = function() { this.isWalking = true }
 

 

function Bird() { /*...*/ }
function Rabbit() { /*...*/ }

 

 
Bird.prototype.walk = Rabbit.prototype.walk = walk

 

 
new Bird().walk() // в обоих случаях

 

new Rabbit().walk() // this будет указывать на текущий объект

 

 

30) Работа с массивами в языке программирования Javascript.

Создание

/* обычный синтаксис */

Var array = [ elem0, elem1, elem2, ... ]

Var empty = [] /* Синтаксис с newArray() */

var array = new Array( elem0, elem1, elem2, ...)

var empty = new Array() /* Редкий синтаксис: аргумент new Array – одно число.При этом создается массив заданной длины,все значения в котором undefined */

var array = newArray(10)

Аргументы elem0, elem1, ...

· Если ни один из параметров elem0, elem1, ... не указан, то инициализируется пустой массив.

· Если указан лишь один числовой параметр elem0 и массив объявлен через new Array, то будет инициализирован пустой массив длины, равной данному числу. При этом все элементы являются undefined.

· В ином случае создается массив из перечисленных элементов.

Массив пронумерованных элементов, также может служить стеком или очередью. Для ассоциативных массивов используйте Object.

Описание, примеры

Объект Array предоставляет функционал

1. Массива с любыми числовыми индексами (разреженного)

2. Стека/очереди

Для задания массива, как правило, используется синтаксис с квадратными скобками. Объявление через new Array тоже возможно, но почти не используется.

Пример: Создать пустой массив

var arr = []

Пример: добавить элемент в конец

arr[arr.length] = 5 /* или arr.push(5) */
JavaScript не поддерживает непосредственно многомерные массивы, но внутри элементов массива можно хранить любые данные, включая другие массивы. Таким образом можно получить многомерные массивы, храня массивы внутри элементов другого массива. Например, следующий код создает таблицу умножения чисел до 5: JavaScript Var iMaxNum = 5;var i, j;var MultiplicationTable = newArray(iMaxNum + 1); for (i = 1; i <= iMaxNum; i++){ MultiplicationTable[i] = new Array(iMaxNum + 1); for (j = 1; j <= iMaxNum; j++){ MultiplicationTable[i][j] = i * j; }} document.write(MultiplicationTable[3][4]);document.write("<br/>"); document.write(MultiplicationTable[5][2]); document.write("<br/>");document.write(MultiplicationTable[1][4]);

31) DOM (объектная модель документа).

В Web трудно найти пример полезного кода JavaScript, который не взаимодействует некоторым образом с документом HTML. Говоря в общем, коду необходимо прочитать значения со страницы, обработать их некоторым образом, и затем сгенерировать вывод в форме видимых изменений информационного сообщения.

Объектный модель документа (DOM -Document Object Model)- предоставляет механизм для проверки и управления создаваемыми слоями семантики и представления.

Большинство действий в javascript выполняется с HTML-страницей. В javascript страница представлена в виде объектной модели DOM (Document Object Model).

Любые действия со страницей требуют вызова соответствующего метода DOM.

Основным инструментом работы и динамических изменений на странице является DOM (Document Object Model) - объектная модель, используемая для XML/HTML-документов.

Согласно DOM-модели, документ является иерархией.
Каждый HTML-тег образует отдельный элемент-узел, каждый фрагмент текста - текстовый элемент, и т.п.

Проще говоря, DOM - это представление документа в виде дерева тегов. Это дерево образуется за счет вложенной структуры тегов плюс текстовые фрагменты страницы, каждый из которых образует отдельный узел.

Построим, для начала, дерево DOM для следующего документа.

<html> <head>

<title>Заголовок</title>

</head> <body> Прекрасныйдокумент </body></html>

Самый внешний тег - <html>, поэтому дерево начинает расти от него.

Внутри <html> находятся два узла: <head> и <body> - они становятся дочерними узлами для <html>.

Рассмотрим чуть более сложный документ.

01<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html> <head>

<title>Документ</title>

</head> <body>

<div id="dataKeeper">Data</div>

<ul> <li style="background-color:red">li text</li>

<li class="info">li text 2</li> </ul>

<div id="footer">footer</div> </body></html>

Верхний тег - html, у него дети head и body, и так далее. Получается дерево тегов:

Каждый DOM-элемент является объектом и предоставляет свойства для манипуляции своим содержимым, для доступа к родителям и потомкам.

Для манипуляций с DOM используется объект document.
Используя document, можно получать нужный элемент дерева и менять его содержание.Например, этот код получает первый элемент с тэгом ol, последовательно удаляет два элемента списка и затем добавляет их в обратном порядке:

var ol = document.getElementsByTagName('ol')[0]

var ol1 = ol.removeChild(ol.firstChild)var ol2 = ol.removeChild(ol.firstChild)

ol.appendChild(ol2) ol.appendChild(ol1)

У каждого элемента в DOM-модели есть тип. Его номер хранится в атрибуте elem.nodeType

Всего в DOM различают 12 типов элементов.

Обычно используется только один: Node.ELEMENT_NODE, номер которого равен 1. Элементам этого типа соответствуют HTML-теги.

Иногда полезен еще тип Node.TEXT_NODE, который равен 3. Это текстовые элементы.

Остальные типы в javascript программировании не используются.

С вершины дерева можно пойти дальше вниз. Для этого каждый DOM-узел содержит массив всех детей, отдельно - ссылки на первого и последнего ребенка и еще ряд полезных свойств.Все дочерние элементы, включая текстовые находятся в массиве childNodes.В следующем примере цикл перебирает всех детей document.body.

for(var i=0; i<document.body.childNodes.length; i++) {

var child = document.body.childNodes[i]

alert(child.tagName)







Последнее изменение этой страницы: 2017-02-10; Нарушение авторского права страницы

infopedia.su Все материалы представленные на сайте исключительно с целью ознакомления читателями и не преследуют коммерческих целей или нарушение авторских прав. Обратная связь - 18.232.188.251 (0.01 с.)