Типовые обороты

18.09.2013

Я очень не люблю javaScript, мне кажется, он ужасен, но, тем не менее, без него никуда. Тут я приведу некоторые типовые конструкции языка, и раскрою некоторые подводные камни. Планирую дописывать эту статью по мере накопления странностей javaScript

Массивы


var ar1 = [];//Так создается массив
var ar2 = ['элемент1',2,ar1];//Так тоже можно создавать массив
ar1.push('элемент1 массива1'); //так добавляются элементы в конец массива
ar1.push(22);
ar1.push(33);

alert(ar1.length); //вернет последний индекс массива + 1 именно так!
                   //сейчас ar1.length=3
ar1[5]=55; //Присваиваем элементу массива с индексом 5 значение 55 
          //(даже если нет такого индекса)
alert(ar1.length); //теперь это уже 6, красота, правда?

console.log(ar1); //Так выводим в консоль (если в браузере такая есть) 
console.log(ar2); //содержимое массива, объекта, да хоть чего

В итоге имеем:


ar1 = ["элемент1 массива1", 22, 33, undefined, undefined, 55]
ar2 = ["элемент1", 2, ["элемент1 массива1", 22, 33, ["элемент1 массива1", 22, 33, undefined, undefined, 55]]

Заметим, что массив ar2 содержит уже заполненный массив ar1, хотя мы передавали пустой. Т.е. передаются ссылки, с одной стороны это удобно, но про это надо помнить.

Объекты, они же ассоциативные массивы, они же классы


//ассоциативный массив
var obj1 = {
    param1:'value1',
    param2:'value2' //в конце запятую не ставить!!! - будет ошибка   
}
obj1.param1; //Обращение к свойству
obj1['param2']; //Так тоже можно

Обход массива или объекта


for (var i in obj1){
    if (!obj1.hasOwnProperty(i)) continue; //Проверка обязательна, иначе,
    //если используется prototype, то при обходе вылезет левая хрень, вот так вот...
    var value = obj1[i];
    alert(value);
}

Объект - класс

Здесь, точнее, экземпляр класса. По классам в js есть хорошая статья на хабре


var obj1 = {//создаем объект
    param1:'value1',//параметр, как у ассоциативного массива
    param2:'value2',
    func1: function(num){//сюда же добавим функцию
        var self = this;//this - это текущий объект, но он может переопределяться в
                        // различных функциях (jquery например)
                        // поэтому будем хранить его в self
        if (num>0&&num<3){ //если на вход пришло 1 или 2
             alert(self['param'+num]); // выведем значение параметра
        } else {
             alert(num); //Иначе выведем то, что пришло
        }
    }
}
obj1.func1(5);

Некоторые приемы

Переадресация или rewrite на js


    document.location.href = 'http://site.ru';

Обновление страницы


    window.location.reload(true);

Добавление элемента истории, изменение адресной строки


    history.pushState('','', 'http://site.ru/addpage/');