Лекция
Привет, сегодня поговорим про массивы в js, обещаю рассказать все что знаю. Для того чтобы лучше понимать что такое массивы в js , настоятельно рекомендую прочитать все из категории Выполнение скриптов на стороне клиента JavaScript, jqvery, JS фреймворки (Frontend).
Object.keys(obj)splitjoinspliceslicesort(fn)
reverseconcatindexOf/lastIndexOf
В этой главе мы рассмотрим встроенные методы массивов JavaScript.
Object.keys(obj)В JavaScript есть встроенный метод Object.keys(obj), который возвращает ключи объекта в виде массива. Он поддерживается везде, кроме IE<9:
1 |
var user = { |
2 |
name: "Петя", |
3 |
age: 30 |
4 |
} |
5 |
6 |
var keys = Object.keys(user); |
7 |
8 |
alert(keys); // name, age |
В более старых браузерах аналогом будет цикл:
var keys = []; |
for(var key in user) keys.push(key); |
splitСитуация из реальной жизни. Мы пишем сервис отсылки сообщений и посетитель вводит имена тех, кому его отправить: Маша, Петя, Марина, Василий.... Но нам-то гораздо удобнее работать с массивом имен, чем с одной строкой.
К счастью, есть метод split(s), который позволяет превратить строку в массив, разбив ее по разделителю s. В примере ниже таким разделителем является строка из запятой и пробела.
1 |
var names = 'Маша, Петя, Марина, Василий'; |
2 |
3 |
var arr = names.split(', '); |
4 |
5 |
for (var i=0; i |
6 |
alert('Вам сообщение ' + arr[i]); |
7 |
} |
splitУ метода split есть необязательный второй аргумент — ограничение на количество элементов в массиве. Если их больше, чем указано — остаток массива будет отброшен:
1 |
alert( "a,b,c,d".split(',', 2) ); // a,b |
Вызов str.split('') разобьет строку на буквы:
1 |
var str = "тест"; |
2 |
3 |
alert( str.split('') ); // т,е,с,т |
joinВызов arr.join(str) делает в точности противоположное split. Он берет массив и склеивает его в строку, используя str как разделитель.
Например:
1 |
var arr = ['Маша', 'Петя', 'Марина', 'Василий']; |
2 |
3 |
var str = arr.join(';'); |
4 |
5 |
alert(str); // Маша;Петя;Марина;Василий |
Код для повторения строки 3 раза:
1 |
alert( new Array(4).join("ля") ); // ляляля |
Как видно, new Array(4) делает массив без элементов длины 4, который joinобъединяет в строку, вставляя между его элементами строку "ля".
В результате, так как элементы пусты, получается повторение строки. Такой вот небольшой трюк.
Важность: 3
Напишите функцию camelize(str), которая преобразует строки вида «my-short-string» в «myShortString».
То есть, дефисы удаляются, а все слова после них получают заглавную букву.
Например:
camelize("background-color") == 'backgroundColor'; |
camelize("list-style-image") == 'listStyleImage'; |
Такая функция полезна при работе с CSS.
P.S. Вам пригодятся методы строк charAt, split и toUpperCase.
Задача может быть решена несколькими способами. Один из них — разбить строку по дефису str.split('-'), затем последовательно сконструировать новую.
Разобьем строку в массив, а затем преобразуем его элементы и сольем обратно:
01 |
function camelize(str) { |
02 |
var arr = str.split('-'); |
03 |
04 |
for(var i=1; i |
05 |
// преобразовать: первый символ с большой буквы |
06 |
arr[i] = arr[i].charAt(0).toUpperCase() + arr[i].slice(1); |
07 |
} |
08 |
09 |
return arr.join(''); |
10 |
} |
К сожалению, в одной статье не просто дать все знания про массивы в js. Но я - старался. Если ты проявишь интерес к раскрытию подробностей,я обязательно напишу продолжение! Надеюсь, что теперь ты понял что такое массивы в js и для чего все это нужно, а если не понял, или есть замечания, то не стесняйся, пиши или спрашивай в комментариях, с удовольствием отвечу. Для того чтобы глубже понять настоятельно рекомендую изучить всю информацию из категории Выполнение скриптов на стороне клиента JavaScript, jqvery, JS фреймворки (Frontend)
Комментарии
Оставить комментарий
Выполнение скриптов на стороне клиента JavaScript, jqvery, JS фреймворки (Frontend)
Термины: Выполнение скриптов на стороне клиента JavaScript, jqvery, JS фреймворки (Frontend)