Меню
✘Скрыть меню
Меню заработка
✘Скрыть меню
Загрузка.. nostroma.online from NOSTROMA - best life and beautiful workЭто ужасно тяжелая работа — ничего не делать – Оскар УайльдРешающую роль в работе играет не всегда материал, но всегда мастер – Максим ГорькийЯ слишком энергичен, чтобы работать – Марсель АшарЧто привлекло меня в карьере писателя? Отсутствие бумажной работы.Одни люди работают только для того чтобы работать, другие – для того, чтобы иметь возможность не работать в будущем.Занятие ерундой на рабочем месте развивает боковое зрение, слух и бдительность в целомСтоит статýя в лучах заката с огромным буем, в руках - граната.Друзья, если вы попались на лохотрон, не будьте эгоистами - предупредите других о таком сайте!Секрет гения — это работа, настойчивость и здравый смысл. Томас Эдисон
Меню заработка

Курсы JavaScript

Урок 13. Свёртка и разворачивание массива. Объекты


Свёртка и разворачивание массива

В предыдущем уроке нами был изучен метод reduce. Благодаря этому методу можно осуществлять самую популярную операцию из арсенала функционального программирования - свёртку и разворачивание массивов. Рассмотрим эти операции на двух самых простых примерах:

Пример1: создадим массив из 5-и числовых значений, а затем свернём его, суммируя все его значения методом reduce:

/*Создаём массив из 5-и числовых значений*/
var total = [5, 15, 55, 43, 12];

/*Сворачиваем массив, суммируя все его значения*/
var res = total.reduce(function(prevValue, currentItem){
	
	/*В теле функции указываем возврат суммы*/
	return prevValue + currentItem;
}, 0);

/*Выводим результат в консоль*/
console.log(res);

/*Выведет 130*/

Пример 2: создадим массив, внутри которого находятся ещё массивы, а затем развернём его методом reduce

/*Создаём массив из 3-х массивов, внутри которых по 2 числовых значения*/
var multiArray = [[5, 15], [55, 43], [12, 17]];

/*Разворачиваем массив multiArray методом reduce*/
var res = multiArray.reduce(function(prevValue, currentItem){
	
	/*В теле функции указываем возврат значения cuurentItem
	после обработки методом concat*/
	return prevValue.concat(currentItem);
});

/*Выводим результат в консоль*/
console.log(res);

/*Выведет:
(6) [5, 15, 55, 43, 12, 17]*/

Метод concat

Метод concat - создаёт новый массив, копируя в него исходный объект и переданные значения value.

Синтаксис метода: var newArray = array.concat(value1, value2, ..., valueN); где -

array - исходный массив
value1, value2, ..., valueN - массивы или значения, которые будут присоединены. Если все или некоторые из value являются массивами, то в результат попадут все значения этих массивов, в отличии от метода push

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

Мэппинг (отображение)

Мэппинг - явление, когда исходный массив отображается в новый. Мы рассмотрели несколько методов, позволяющих это реализовать.

Сейчас закрепим полученные знания примерами, в которых происходит явление мэппинга. В этом примере 4-мя различными способами делается одно и то же: исходный массив с набором символов отображается в новый, где эти символы превращаются в числовые значения своих кодов:

/*Создадим массив из 5-ти символов*/
var chars = ['a', 'b', 'c', 'd', 'e'];

/*Способ 1: получаем коды символов методом charCodeAt и
 записываем их в новый массив методом map*/
var nums = chars.map(function(item){
	return item.charCodeAt(0);
	});
	
/*Выводим результат в консоль*/
console.log(nums);

/*Способ 2: создаём новый пустой массив, а затем добавляем
 в него коды символов (метод charCodeAt) методом forEach*/
 var newArr = [];
 chars.forEach(function(item){
	 
	  /*Здесь, в теле функции получаем коды
	 символов и добавляем их в новый пустой массив
	 методом push*/
	 newArr.push(item.charCodeAt(0));
 });
 
/*Выводим результат методом alert*/
alert(newArr);

/*Способ 3: используем цикл for и метод push,
 также предварительно создавая новый пустой массив*/
 var newArr = [];
 
 for(var i = 0; i<chars.length; ++i){
	 
	/*В теле цикла добавляем элементы в новый пустой
	массив методом push*/
	 newArr.push(chars[i].charCodeAt(0))
 };
 
/*Выводим результат методом document.write - запись
 в документ html*/
document.write(newArr);

/*Способ 4: используем цикл for-in*/
 var newArr = [];
 
 for(var i in chars){
	 newArr.push(chars[i].charCodeAt(0));
 };

/*Выводим результат в консоль*/
console.log('Способ 4: ' + newArr);

Во всех 4-х способах в приведённом примере ответ будет 97,98,99,100,101.

Объекты

Объекты - это коллекция свойств; если свойство ссылается на функцию, то оно называется методом.

Объекты - фундаментальный тип данных в JavaScript. Создавать объекты проще всего литералами - при помощи фигурных скобок {свойство: "значение"}:

var object = {name: 'Александр', age: '33'};

Для обращения к конкретному свойству объекта используйте квадратные скобки (оператор уточнения):

var object = {name: 'Александр', age: '33'};
console.log(object["name"]);

/*Выведет: Александр*/

Процедура сериализации объекта заключается в его превращении в последовательность строк и осуществляется методом JSON.stringify():

var object = {name: 'Александр', age: '33'};
JSON.stringify(object);

/*Выведет: 
"{"name":"Александр","age":"33"}"*/

Обратите внимание, что при сериализации удаляются все пробелы.

Объявление var создаёт неудаляемое свойство глобального объекта. У обычных объектов и массивов свойства можно удалять оператором delete. Попытка обращения к удалённому свойству объекта вернет значение undefined:

obj = {name: "Виктор", age: "31", surname: "Иванов"};
delete obj['surname'];

console.log(obj);

/*Выведет: 
{name: "Виктор", age: "31"}*/

Методы объектов

Метод - это свойство объекта, которое ссылается на функцию. Слово this внутри тела такой функции обозначает объект, в котором определена функция.

/*Создаём простой объект*/
obj = {name: "Виктор", age: "31", surname: "Иванов"};

/*Создаём метод объекта, который ссылается на функцию. Эта функция вернёт
 нам имя и фамилию (свойства name и surname)*/
obj.fullName = function(){
	return this.name + ' ' + this.surname;
};

/*Выведем fullName в консоль браузера*/
console.log(obj.fullName());

/*Выведет:
Виктор Иванов*/

Для вызова чужого метода можно использовать метод call, который позволяет вызвать чужой метод от имени текущего объекта. В следующем примере создадим два объекта. У объекта obj опишем метод, ссылающийся на функцию, а затем вызовем этот метод от имени объекта obj2, применив call:

/*Создаём два объекта*/
var obj = {name: "Виктор", age: "31", surname: "Иванов"};
var obj2 = {name: "Василий", age: "34", surname: "Пупкин"};

/*Создаём у объекта obj метод, который ссылается на функцию. Эта функция
 вернёт нам имя и фамилию (свойства name и surname)*/
obj.fullName = function(){
	return this.name + ' ' + this.surname;
};

/*Выведем fullName в консоль браузера, для объекта obj2 используем
 метод call*/
console.log(obj.fullName());
console.log(obj.fullName.call(obj2));

/*Выведет:
Виктор Иванов
Василий Пупкин*/

Оператор new

Оператор new - оператор экземплификации делает следующее: он берёт встроенную функцию JavaScript, которая спроектирована как конструктор объекта и вызывает её таким образом, что происходит создание и инициализация нового объекта.

Запись вида var arr = new Array[]; вызывает встроенный конструктор и эффект её такой же, как создание литералом - var arr = [];

Функция + свойство

В JavaScript можно сохранять данные через свойство объекта с каждым вызовом функции. Типичным примером такой возможности является счётчик, который увеличивается на нужное число при каждом вызове функции:

var count = function() {return count.v++}
count.v = 0;

console.log(count()); // 0
console.log(count()); // 1
console.log(count()); // 2

Комментарии

Введите Ваше имя:*

Введите e-mail:

Ваш комментарий:*

* Обязательные поля