Strings vars and literals - garevna/js-course GitHub Wiki
:mortar_board: Методы работы со строками
:file_folder: Операции со строками
:file_folder: Методы строк
indexOf()slice()substring()substr()toLowerCase()toUpperCase()split()trim()charAt()charCodeAt()repeat()replace()padStart & padEnd
:file_folder: Дополнительно
Переменные в литералах
:heavy_exclamation_mark: Литерал строки заворачивается в символы обратных кавычек ( ` )
Литерал может содержать многострочный текст,
т.е. в литерал можно вставлять символ перевода строки
:coffee: :one:
var str = "\nПривет,\nменя зовут Дима\n"
var lit = `
Привет,
меня зовут Дима
`
console.log ( str )
console.log ( lit )
console.log ( str.charCodeAt (0) )
console.log ( lit.charCodeAt (0) )
Результат в консоли:
10 - это код символа перевода строки
Обратите внимание, что в обычной строке ( str ) нам пришлось вставлять перевод строки с помощью \n
В литерале ( lit ) мы просто набираем многострочный текст, что улучшает читабельность кода
Но это не все достоинства литерала
Конструкция ${ имя_переменной } позволяет вставлять значения переменных непосредственно в литерал строки
:coffee: :two:
var cities = [ "Неаполь", "Вашингтон", "Женева" ]
for ( var i = 0; i < cities.length; i++ ) {
console.log (
`${ i + 1 }: ${ cities [ i ] }`
)
}
Результат в консоли:
1: Неаполь
2: Вашингтон
3: Женева
Можно использовать выражения, значения которых будут вычислены и вставлены в литерал:
:coffee: :three:
var cities = [
"Киев",
"Львов",
"Харьков",
"Одесса",
"Днепропетровск"
]
var str = ""
for ( var x = 0; x < cities.length; x++ ) {
str += `${cities[x].charCodeAt(0)}: ${cities[x]}\n`
}
console.log ( str )
Результат в консоли:
:coffee: :four:
Можно сгенерировать случайное значение цвета в шестнадцатеричном формате
Используем встроенную библиотеку математических функций Math
Для получения случайного числа от нуля до единицы используем функцию Math.random()
Значение цвета в каждом канале может быть от 0 до 255
Чтобы получить число в это диапазоне, умножим случайное число на 255
Значение цветового канала должно быть целым числом, поэтому округлим результат с помощью функции Math.round()
var red = Math.round ( Math.random() * 255 ).toString(16)
var green = Math.round ( Math.random() * 255 ).toString(16)
var blue = Math.round ( Math.random() * 255 ).toString(16)
var color = `#${red}${green}${blue}`
Теперь в переменной color будет строка, содержащая значение цвета в шестнадцатеричном формате
:coffee: :five:
Можно сгенерировать случайное значение цвета с использованием функции rgb()
var red = Math.round ( Math.random() * 255 )
var green = Math.round ( Math.random() * 255 )
var blue = Math.round ( Math.random() * 255 )
var color = `rgb(${red},${green},${blue})`
Теперь в переменной color будет строка, содержащая значение цвета в модели rgb с десятичными значениями цвета в каналах
:briefcase: Тесты
:link: MDN |
:link: String Methods |
:link: String Reference |
|---|