Основываясь на книгах, которые я прочитал — я сделал этот обзор.
- Моя шпаргалка по Javascript:
- Строки Javascript
- Доступ:
- Поиск:
- Регулярные выражения:
- Базовый регекс:
- Функции RegExp:
- Объекты:
- Base64 Encoding:
- Сокращение строки:
- Javascript Массивы:
- Итерация:
- forEach():
- Вспомогательные функции массива:
- Оператор Spread:
- Функциональные методы массива:
- Cookies:
- Чтение cookie:
- Веб-рабочие:
Моя шпаргалка по Javascript:
Строки Javascript
Доступ:
-
Доступ к символам
.chartAt()
,'dog'.chartAt(1)
возвращает 0. -
.chartAt(index);
принимает индекс, начинающийся с 0, и возвращает символ с этим индексом. -
.chartAt(start, finish)
возвращает символ в позиции от начала до конца.
Поиск:
-
.indexOf(searchValue[fromIndex])
поможет вам найти подстроку внутри строки. -
Эта функция принимает строку для поиска и необязательный параметр для начального индекса поиска & -1, если ничего не найдено.
-
функция
.startsWith(?)
поможет узнать, с чего начинается строка. -
функция
.endsWith(?)
вернет true, если строка заканчивается строкой-параметром. -
Для замены строки используется функция ‘ .replace(‘str1′,’str2′)’.
-
Для проверки встречаемости искомой строки достаточно проверить, было ли возвращено значение -1 из
.indexOf(?)
.
var str = 'hey there Batch';
var count = 0;
var pos = str.indexOf('a');
while(pos != -1){
count++;
pos = str.indexOf('a', pos + 1)
}
Регулярные выражения:
Базовый регекс:
Функции RegExp:
var str = 'hey there Batch';
var cn = str.search(/here/);
console.log(cn);
Объекты:
Base64 Encoding:
- Функция
btoa(?)
создает из строки ASCII строку в кодировке base64. - Функция
atob(?)
декодирует строку в кодировке base64.
Сокращение строки:
var Dictionary = "sjhlksafhjksdhfjkdsflsdjlifhisdoncmx.nvmcx,grdj".split("");
function encoded(num) {
var base = DICTIONARY.length
var encoded="";
if(num == 0){
return DICTIONARY[0];
}else{
while(num > 0){
encoded += DICTIONARY[(num % base)];
num = Math.floor(num /base);
}
}
return reverseWord(encoded);
}
function reverseWord(str){
var reversed ="";
for ( var i= str.length - 1; i >=0; i-- ){
reversed +=str.charAt(i);
}
return reversed;
}
function decodeId(){
var base = DICTIONARY.length;
var decoded = 0;
for (var index =0; index < id.split('').length; index++ ){
decoded = decoded*base + DICTIONARY;
indexOf(id.chartAt(index));
}
return decoded;
}
Javascript Массивы:
var arr = [1, 2, 3 . 4]
.
-
Для доступа к элементам массива мы используем его индекс
arr[?]
. -
Для вставки элемента массива
arr.push(?)
-
Для удаления элемента в конец
arr.pop(?)
другой вариант удаления —arr.shift(?)
.
Итерация:
- этот метод итерации будет вызывать индексы по отдельности, и вы получите доступ к данным внутри них.
var arr = [1,2,3];
for(var index in arr){
console.log(arr[index]);
}
- этот метод позволит вам получать доступ и использовать объекты массива по отдельности каждый раз, когда вы получаете один, вы можете выполнять проверки таким образом.
var arr = [1,2,3];
for(var element of arr){
console.log(element);
}
forEach():
- этот метод лучше других методов итерации, поскольку он может выходить из итерации или пропускать определенные элементы массива.
var arr = [1,2,3];
arr.forEach((el, in) => {
console.log(el);
}
)
Вспомогательные функции массива:
var arr = [1, 2, 3, 4, 5];
arr.slice(1, 2); // returns [2]
arr.slice(2, 4); // returns [3, 4]
var arr = [1, 2, 3, 4, 5];
var arr2 = Array.from(arr);
var arr = [1, 2, 3, 4, 5];
arr.splice(); // returns []
arr.splice(1, 2); // returns [2, 3], modifying arr = [1,4]
arr.splice(1,2,5,6,7) // returns [2, 3], arr = [1, 5, 6, 7, 4]
var arr = [1, 2, 3, 4, 5];
arr.concat([1, 2]); // returns [1, 2, 3, 4, 5, 1, 2] and arr still remains the same
Оператор Spread:
- этот оператор позволит получить доступ ко всем элементам по отдельности.
var arr = [1, 2, 3, 4, 5];
function printNumz(a, b, c, d){
return a + b + c + d;
}
console.log(printNumz(...arr))
Функциональные методы массива:
- Метод
.filter()
используется для фильтрации элементов или проверки условия, как в следующем примере:
var arr = [1, 2, 3, 4, 5];
arr.filter(function (item) {
return item > 2;
}); // returns [3,4,5]
-
Этот метод может позволить вам выполнять другие операции с элементами, когда вы достигаете их в массиве.
-
У нас также есть функция
.reduce()
, которая объединит все элементы в массиве в одно значение, используя переданную функцию.
var sum = [1, 2, 3, 4, 5].reduce(function(prevVal, currVal, index, array){
return prevVal + currVal;
});
Cookies:
- чтобы проверить, включены ли cookies, мы используем шаблон с соответствующим кодом для установки cookie, обратите внимание, что он может не работать в старых браузерах.
if(navigation.cookieEnabled === False) {
// Do something...
}
var COOKIE_NAME = 'Example cookie'; // naming the cookie.
var COOKIE_VALUE = 'Something '; // the value of the cookie.
var COOKIE_PATH = '/foo/bar'; // GIVE THE COOKIE A PATH.
var COOKIE_EXPIRES;
COOKIE_EXPIRES = (new Date(Date.new() + 6000 )). toUTCString();
document.cookie += COOKIE_NAME + "=" + COOKIE_VALUE + "; expires=" + COOKIE_EXPIRES + "; path=" + COOKIE_PATH;
Чтение cookie:
var name = name + "=" + cookie_array = document.cookie.split(';'),
cookie_value;
for (var i = 0; i<cookie_array[i].length; i++){
var cookie = cookie_array[i];
while(cookie.charAt(0) == ''){
cookie = cookie.substring(1, cookie.length);
}
if(cookie.indexOf(name) == 0){
cookie_value = cookie.substring(name.length, cookie.length);
}
}
- LocalStorage, sessionStorage похожи на js объекты, поэтому мы можем использовать их как они есть:
localStorage.greet = 'hey there'; // window.localStorage.setItem('')
localStorage.greet; // window.localStorage.getItem('')
delete localStorage.greet; // Same as: window.localStorage.removeItem('')
- sessionStorage использует то же хранилище, что и localStorage, но оно будет доступно только для сессии или для данного окна.
Веб-рабочие:
-
Веб-рабочий — это способ запуска скриптов в фоновых потоках
var webworker = new Worker("./path/to/webworker.js");
. -
Вы также можете внедрить скрипт в качестве рабочего в строку, которая используется в
URL.createObjectURL()
:
var workerData = "function someFunction() {}; console.log('More code');";
var blobURL = URL.createObjectURL(new Blob(["(" + workerData + ")"], { type: "text/javascript" }));
var webworker = new Worker(blobURL);
-
service worker — это управляемый событиями рабочий, привязанный к исходному сайту, он может управлять сайтом и использовать его ресурсы.
-
ЭТО ПРОГРАММИРУЕМЫЙ СЕТЕВОЙ ПРОКСИ,
-
ОН БУДЕТ ЗАВЕРШЕН, ЕСЛИ НЕ ИСПОЛЬЗУЕТСЯ.
-
У НЕГО ЕСТЬ ЖИЗНЕННЫЙ ЦИКЛ, НЕ СВЯЗАННЫЙ С ВЕБ-СТРАНИЦЕЙ.
-
ЕМУ НУЖЕН HTTPS.