Strings vars and literals - garevna/js-course GitHub Wiki

:mortar_board: Методы работы со строками

:file_folder: Операции со строками

:file_folder: Методы строк

: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