10 потрясающих трюков со строками в JavaScript

JavaScript

Автор: Кай Переводчик: Front-end Xiaozhi Источник: разработчик

Ставь лайк и смотри, Wechat search [Великий переезд в мир] Обратите внимание на этого человека, который не имеет большого заводского фона, но имеет восходящий и позитивный менталитет. эта статьяGitHub GitHub.com/QQ449245884…Он был включен, статьи были классифицированы, и многие мои документы и учебные материалы были систематизированы. **

Недавно компонент Vue был с открытым исходным кодом, но он не идеален. Добро пожаловать, чтобы улучшить его вместе. Я также надеюсь, что вы можете поставить звезду, чтобы поддержать его. Спасибо.

адрес гитхаба:GitHub.com/QQ449245884…

Мы называем последовательность символов какнить. Это один из основных типов, встречающихся почти во всех языках программирования. Здесь я покажу вам строки JS10Отличный трюк, о котором вы, вероятно, еще не знали?

1. Как скопировать строку несколько раз

Строки JS допускают простое повторение, вместо того, чтобы копировать строки вручную, мы можем использоватьrepeatметод.

const laughing = '小智'.repeat(3)
consol.log(laughing) // "小智小智小智"

const eightBits = '1'.repeat(8)
console.log(eightBits) // "11111111"

2. Как дополнить строку до заданной длины

Иногда мы хотим, чтобы строки имели определенную длину. Если строка слишком короткая, оставшееся пространство необходимо дополнить, пока не будет достигнута указанная длина.

Раньше в основном использовали библиотекиleft-pad. Однако сегодня мы можем использоватьpadStartа такжеSpadEndМетод, который вы выберете, зависит от того, дополняете ли вы строку в начале или в конце строки.

// 在开头添加 "0",直到字符串的长度为 8。
const eightBits = '001'.padStart(8, '0')
console.log(eightBits) // "00000001"

//在末尾添加“ *”,直到字符串的长度为5。
const anonymizedCode = "34".padEnd(5, "*")
console.log(anonymizedCode) // "34***"

3. Как разбить строку на массив символов

Существуют различные способы разбить строку на массивы символов, я предпочитаю использовать оператор расширения (...):

const word = 'apple'
const characters = [...word]
console.log(characters) // ["a", "p", "p", "l", "e"]

Уведомление, который не всегда работает должным образом. Смотрите следующий совет для получения дополнительной информации.

4. Как считать символы в строке

можно использоватьlengthАтрибуты.

const word = "apple";
console.log(word.length) // 5

Но для китайцев этот способ не очень надежен.

const word = "𩸽"
console.log(word.length) // 2

Кандзи𩸽вернутьlengthдля2,Зачем? JS представляет большинство символов в виде 16-битных кодовых точек. Однако некоторые символы представлены в виде двух (или более) 16-битных кодовых точек, называемыхсуррогатная пара. При использованииlengthсвойство, JS сообщает вам, сколько кодовых точек используется. следовательно,𩸽(hokke)Состоит из двух кодовых точек и возвращает неверное значение.

Итак, как судить, используйте символ оператора деструктуризации (...)

const word = "𩸽"
const characters = [...word]
console.log(characters.length) // 1

Этот подход работает в большинстве случаев, но есть и крайние случаи. Например, если вы используете смайлики, иногда эта длина также неверна. Если вы действительно хотите рассчитать правильную длину символов, вы должны разбить слово наКластеры графем, что выходит за рамки данной статьи и здесь описываться не будет.

5. Как поменять местами символы в строке

Менять местами символы в строке легко. Просто объедините оператор спреда (...),Array.reverseМетоды иArray.joinметод.

const word = "apple"
const reversedWord = [...word].reverse().join("")
console.log(reversedWord) // "elppa"

Как и прежде, есть некоторые крайние случаи. В случае ребра необходимо сначала разбить слово награфемный кластер.

6. Как сделать первую букву в строке заглавной

Очень распространенная операция — сделать первую букву строки заглавной. Хотя многие языки программирования имеют собственный способ сделать это, JS требует некоторой доработки.

let word = 'apply'

word = word[0].toUpperCase() + word.substr(1)

console.log(word) // "Apple"

Другой путь:

// This shows an alternative way
let word = "apple";

// 使用扩展运算符(`...`)拆分为字符

const characters = [...word];
characters[0] = characters[0].toUpperCase();
word = characters.join("");

console.log(word); // "Apple"

7. Как разбить строку на несколько разделителей

Предположим, мы хотим разбить строку по разделителю, первое, что приходит на ум, это использоватьsplitМетод этот, Жими люди должны знать. Однако есть одна вещь, которую вы можете не знать, а именноsplitВы можете разделить несколько разделителей одновременно, используя регулярные выражения для достижения:

// 用逗号(,)和分号(;)分开。

const list = "apples,bananas;cherries"
const fruits = list.split(/[,;]/)
console.log(fruits); // ["apples", "bananas", "cherries"]

8. Как проверить, содержит ли строка определенную последовательность

Поиск строки — обычная задача. В JS вы можете использоватьString.includesспособ сделать это легко. Регулярные выражения не требуются.

const text = "Hello, world! My name is Kai!"
console.log(text.includes("Kai")); // true

9. Как проверить, начинается или заканчивается строка определенной последовательностью

Для поиска в начале или конце строки вы можете использоватьString.startsWithа такжеString.endsWithметод.

const text = "Hello, world! My name is Kai!"

console.log(text.startsWith("Hello")); // true

console.log(text.endsWith("world")); // false

10. Как заменить все вхождения строки

Существует несколько способов замены всех вхождений строки. можно использоватьString.replaceМетоды и регулярные выражения с глобальными признаками. Или вы можете использовать новыйString.replaceAllметод. Обратите внимание, что этот новый метод доступен не во всех браузерах и версиях Node.js.

const text = "I like apples. You like apples."

console.log(text.replace(/apples/g, "bananas"));
// "I like bananas. You like bananas."

console.log(text.replaceAll("apples", "bananas"));
// "I lik

Суммировать

Строки — один из самых фундаментальных типов данных практически в любом языке программирования. В то же время это также один из первых типов данных, которые изучают новые разработчики. Однако, особенно в JavaScript, многие разработчики не знают некоторых интересных подробностей о строках. Надеюсь, эта статья будет вам полезна.

Я немного мудрость, мы видим следующий вопрос.


Ошибки, которые могут существовать после развертывания кода, не могут быть известны в режиме реального времени.Чтобы решить эти ошибки впоследствии, много времени тратится на отладку журнала.Кстати, я рекомендую всем полезный инструмент мониторинга ошибок.Fundebug.

оригинал:Dev.to/start_blog/1…

общаться с

Статья постоянно обновляется каждую неделю. Вы можете выполнить поиск «Big Move to the World» в WeChat, чтобы прочитать и обновить ее как можно скорее (на одну или две статьи раньше, чем в блоге). Эта статья находится на GitHub.GitHub.com/QQ449245884…Он был включен, и многие мои документы были разобраны. Добро пожаловать в Звезду и совершенство. Вы можете обратиться в тестовый центр для ознакомления во время собеседования. Кроме того, обратите внимание на паблик-аккаунт и ответьте в фоновом режиме.Благосостояние, вы можете увидеть преимущества, вы знаете.