Содержание

javascript — При впушивании строки в массив, выводит undefined

Задать вопрос

Вопрос задан

Изменён 1 год 3 месяца назад

Просмотрен 98 раз

Пользуясь случаем хочу спросить мнение о решении задачки — «Ввести с клавиатуры текст предложения, завершить точкой. Сформировать новую строку на основе исходной, в которой после каждого слова в скобках указать номер слова в предложении (слова разделяются запятыми, пробелами или тире). Например, если введено «Донецк – прекрасный город», результирующая строка должна выглядеть так: «Донецк(1) – прекрасный(2) город(3)».

Хочу выводить слова в массив а потом брать их из массива и соединять с каким то countom в строке, есть ли решение получше? Надо решать через обработку строки как массива!!!

А вот собственно сам код, почему вместо строк, слов. В массиве появляется undefined? как исправить такое поведение?

let prom = "Донецк - прекрасный город";
function asd(prom) {
  var arr2 = [];
  for (i = 0; i < prom.length; i++) {
    let count = 0
    if (prom[i] == " ") {
      arr2.push(prom[count - i])
      count = i
    }
  }
  return arr2
}
console.log(asd(prom))
  • javascript
  1. на каждой итерации цикла обнуляется count, поэтому индекс всегда отрицательный, и, следовательно результат prom[count - i]undefined
  2. prom[count - i] — это получение одной буквы, а не подстроки. Для получения подстроки можно воспользоваться методом
    .slice
    либо .substring
  3. алгоритм может выглядеть следующим образом:
    1. пробег по символам строки
    2. если символ — разделитель и предыдущий символ был буквой — добавляем в результат номер слова
    3. добавляем в результат текущий символ
let prom = "Донецк - прекрасный город";
function asd(prom) {
  var count = 1;
  var res = '';
  for (i = 0; i < prom. length; i++) {
    if ((prom[i] == " " || prom[i] == "-") && // проверяем разделители
      prom[i - 1].match(/\p{Alpha}/iu)) { // проверяем что предыдущий символ - буква
      res += '(' + count + ')';
      count += 1;
    }
    res += prom[i];
  }
  if (prom[prom.length - 1].match(/\p{Alpha}/iu)) { // если последний символ был буквой - учитываем последнее слово
    res += '(' + count + ')';
  }
  return res;
}
console.log(asd(prom))

3

undefined потому что count - i уходит в минус соответственно по отрицательному индексу в строке нет значения.

let prom = "Донецк - прекрасный, город";
let n = 1;
function asd(prom) {
  let m = prom.split(" ")
  let res = m.map((e,i)=>{
    let nn = n;
    if(e.includes("-")) {
      return e
    }
    if(e.includes(",")){
      n++;
      return  `${e.slice(0,e.length-1)}(${nn})${e[e.length-1]}`;
    }    
    if(!e.includes("-")){
      n++;
      return  `${e}(${nn})`
    }
  })
  return res.
join(" ") } console.log(asd(prom))

2

Зарегистрируйтесь или войдите

Регистрация через Google

Регистрация через Facebook

Регистрация через почту

Отправить без регистрации

Почта

Необходима, но никому не показывается

Отправить без регистрации

Почта

Необходима, но никому не показывается

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими пользовательским соглашением, политикой конфиденциальности и политикой о куки

split() в JavaScript — разбить строку на массив элементов — синтаксис, много примеров

Содержание

  • Синтаксис
  • Разбить строку по разделителю
  • Разбить строку на символы
  • Разбить строку используя регулярное выражение
  • Вывести символы строки в обратном порядке
  • Сумма элементов массива
  • Итого

split() — метод разбивает строку на массив строк используя для этого заданный разделитель.

Синтаксис

    str.split(separator, limit)
    

separator — условие по которому будет разделена строка. В качестве разделителя может выступать строковый литерал или регулярное выражение. Также можно использовать специальные символы, например перевод строки, кавычки или юникод. Параметр является необязательным.

limit — количество элементов, которые должен вернуть метод. Параметр необязательный, если пропустить в массив попадут все подстроки. Если задать, то split() все-равно разделит всю строку по разделителям, но возвратит только указанное количество.

При нахождении разделителя метод удаляет separator и возвращает подстроку.

Если задать в качестве разделителя пустое значение '', тогда каждый символ строки запишется в отдельный элемент массива.

Если при записи split() пропустить separator, то метод вернет массив с одним элементом, который будет содержать всю строку.

Разбить строку по разделителю

    let mySkills = 'Native JavaScript-React-HTML-CSS'
    mySkills = mySkills.split('-', 2)
    console.log(mySkills)
    

Результатом будет массив с двумя элементами: Native JavaScript и React

Разбить строку на символы

    let myDream = 'Хочу стать frontend разработчиком'
    let allSymbols = myDream.split('')
        
    for (let n = 0; n 

Здесь мы разделили строку myDream с помощью split(''), задав в качестве separator пустое значение. Все это записали в allSymbols — теперь там массив, где каждый элемент это символ нашей строки. Далее используя цикл for вывели в console все символы — каждый с новой строки.

Разбить строку используя регулярное выражение

    let topProgramLang = 'JavaScript-Python-Java-C++,PHP,C,C#'
    topProgramLang = topProgramLang.split(/,|-/)
    console.log(topProgramLang) 
    

/,|-/ в этом регулярном выражении мы указали разделители, которые необходимо учесть — запятая и дефис.

В итоге получаем массив, где перечислены все языки программирования указанные изначально.

Вывести символы строки в обратном порядке

    let importanceSkills = 'React,TypeScript,CSS,HTML,JavaScript'
    importanceSkills = importanceSkills.split(',')
    importanceSkills = importanceSkills.reverse()
    importanceSkills = importanceSkills.join(', ')
    console.log(importanceSkills)
    

Для того, чтобы решить эту задачу нам понадобятся еще два метода reverse() и join(). Первый перевернет массив, а второй объединит элементы в строку. В итоге получим в console

JavaScript, HTML, CSS, TypeScript, React

Сумма элементов массива

    let numForSum = '1,2,5,10,392,19,3,10'
    numForSum = numForSum.split(',')
    let sumNum = 0
        
    for (let n = 0; n 

Выполняя подобные задачи стоит помнить, что метод split() записывает данные в массив в формате строки, поэтому перед тем, как складывать элементы необходимо сначала привести их к числу. Здесь это сделано с помощью + перед выражением. Также можно воспользоваться функцией Number(numForSum[n]).

Итого

1. Метод split() делит строку по разделителю и записывает все в массив.

2. В получившемся массиве, элементы хранятся в формате текст.

3. В параметрах метода, первым свойством задается разделитель, вторым ограничение на вывод элементов. Оба параметра не обязательны.

4 способа преобразования строки в массив символов в JavaScript

Вот 4 способа разбить слово на массив символов. «Сплит» — наиболее распространенный и надежный способ. Но с добавлением ES6 в арсенале JS появилось больше инструментов, с которыми можно поиграть 🧰

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

  • Сценарии
    • Массив символов
    • Специфические разделители
    • Строки, содержащие эмодзис
    • Объект об объекте. Assign ⚠
  • . каждый по-разному. Позвольте мне показать вам различные сценарии, в которых один предпочтительнее другого.

    Массив символов

    Если все, что вы делаете, это хотите разделить строку по каждому символу строки, все способы хороши и дадут вам тот же результат

    Определенные разделители

    Если вы хотите разделить строку по определенному символу, то split — это то, что вам нужно.

    Другие способы ограничены только символами каждой строки

    Строки, содержащие эмодзи

    Если ваши строки содержат эмодзи, то split или Object.assign может быть не лучшим выбором. Посмотрим, что получится:

    Однако, если мы используем другие способы, это сработает:

    Это потому, что split разделяет символы кодовыми единицами UTF-16, что проблематично, поскольку символы эмодзи имеют кодировку UTF-8. Если мы посмотрим на наш эмодзи ням '😋' , он на самом деле состоит из 2 символов, а не из 1, как мы воспринимаем.

    Это так называемые графемные кластеры, когда пользователь воспринимает их как 1 единицу, но на самом деле они состоят из нескольких единиц. Более новые методы , распространение и Array.from , лучше приспособлены для их обработки и разделят вашу строку на 9.0061 кластеры графем 👍

    Предупреждение о

    Object.assign ⚠️

    Следует отметить, что Object.assign на самом деле не создает чистый массив. Начнем с его определения

    Метод Object.assign() копирует все перечисляемые собственные свойства из одного или нескольких исходных объектов в целевой объект

    Там ключ «копирует все перечислимые собственные свойства». Итак, что мы здесь делаем Object.assign([], string) это копирование ВСЕХ наших строковых свойств в наш новый массив. Это означает, что у нас есть массив ПЛЮС некоторые строковые методы.

    Тест TypeScript: массив результатов не является строкой
    [] типом 😱

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

    Однако, если мы посмотрим на тип результата Объект.назначить . Это не дает нам массив строк.

    Тест TypeScript: массив результатов может получить доступ к строковым свойствам 😱

    Мы можем дополнительно проверить это, обратившись к свойству, которое должно быть доступно только для String .

    Значит, если я назову жирным шрифтом в нашем массиве, он должен сказать нам, что этого свойства не существует. Вот что мы ожидаем увидеть:

    НО, если мы назовем жирным шрифтом в нашем якобы массиве, созданном Object.assign , это работает 😱

    ☝️ И это потому, что Object.assign копирует ВСЕ свойства исходной строки. Вот как я бы объяснил это с точки зрения не-разработчика. Вы идете в магазин, чтобы купить собаку. Но затем магазин Object.assign продает вам собаку с крыльями дракона. Звучит очень круто, но на самом деле это домашнее животное не для аренды. Хм… Я не думаю, что это мой лучший пример. Но я думаю, вы меня поняли 😂

    Преобразование в браузере нормальное 🙂

    Теперь я не думаю, что это серьезное нарушение условий сделки, причина:

    Похоже, что браузеры имеют какой-то механизм для «безопасного» выполнения Object.assign([], «string») и избегания добавления методы этой строки в массив.

    Спасибо @lukeshiru: за то, что поделились со мной этими знаниями 👏 Он также создал код игровой площадки TypeScript, чтобы вы могли видеть > ссылка

    @CaptainOrion_: Превратите строку в массив символов, но с помощью функции отображения 🤣

    @HiUmesh3: Array.prototype.slice.call('string') тоже подойдет

    @inside.code: Дополнительная информация: безопаснее использовать оператор распространения (второй метод), а не String. prototype.split('') (первый метод), потому что split() не работает с некоторыми необычными символами.

    @faerberrr: У меня была строка, содержащая специальные символы, такие как åæāă и т. д. Когда я разделил их, используя .split('') и запустил .length , он вернул вдвое больше ожидаемого значения! Переключение на оператора спреда решило проблему.

    Ресурсы

    • Веб-документы MDN: split
    • Веб-документы MDN: распространение
    • Веб-документы MDN: Array.from
    • Веб-документы MDN: Object.assign
    • Переполнение стека: как разделить строку конкретный персонаж?
    • Переполнение стека: как получить строку в массив символов в JavaScript?
    • Переполнение стека: как разбить строку на массив символов?
    • Переполнение стека: конвертируйте utf-8 в Unicode, чтобы найти эмодзи в строке в Java

    4 способа преобразовать строку в массив символов в JavaScript

    Вот 4 способа разбить слово на массив символов. «Сплит» — наиболее распространенный и надежный способ. Но с добавлением ES6 в арсенале JS появилось больше инструментов, с которыми можно поиграть 🧰

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

    • Сценарии
      • Массив символов
      • Специфические разделители
      • Строки, содержащие смайлики
      • Объект об объекте. Assign ⚠
    • . каждого по-разному. Позвольте мне показать вам различные сценарии, в которых один предпочтительнее другого.

      Массив символов

      Если все, что вы делаете, это хотите разделить строку по каждому символу строки, все способы хороши и дадут вам тот же результат

      Определенные разделители

      Если вы хотите разделить строку по определенному символу, то split — это то, что вам нужно.

      Другие способы ограничены только символами каждой строки

      Строки, содержащие эмодзи

      Если ваши строки содержат эмодзи, то split или Object.assign может быть не лучшим выбором. Посмотрим, что получится:

      Однако, если мы используем другие способы, это сработает:

      Это потому, что split разделяет символы кодовыми единицами UTF-16, что проблематично, поскольку символы эмодзи имеют кодировку UTF-8. Если мы посмотрим на наш эмодзи ням '😋' , он на самом деле состоит из 2 символов, а не из 1, как мы воспринимаем.

      Это так называемые графемные кластеры, когда пользователь воспринимает их как 1 единицу, но на самом деле они состоят из нескольких единиц. Более новые методы , распространение и Array.from , лучше приспособлены для их обработки и разделят вашу строку на 9.0061 кластеры графем 👍

      Предупреждение о

      Object.assign ⚠️

      Следует отметить, что Object. assign на самом деле не создает чистый массив. Начнем с его определения

      Метод Object.assign() копирует все перечисляемые собственные свойства из одного или нескольких исходных объектов в целевой объект

      Там ключ «копирует все перечислимые собственные свойства». Итак, что мы здесь делаем Object.assign([], string) это копирование ВСЕХ наших строковых свойств в наш новый массив. Это означает, что у нас есть массив ПЛЮС некоторые строковые методы.

      Тест TypeScript: массив результатов не является строкой
      [] типом 😱

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

      Однако, если мы посмотрим на тип результата Объект.назначить . Это не дает нам массив строк.

      Тест TypeScript: массив результатов может получить доступ к строковым свойствам 😱

      Мы можем дополнительно проверить это, обратившись к свойству, которое должно быть доступно только для String .

      Значит, если я назову жирным шрифтом в нашем массиве, он должен сказать нам, что этого свойства не существует. Вот что мы ожидаем увидеть:

      НО, если мы назовем жирным шрифтом в нашем якобы массиве, созданном Object.assign , это работает 😱

      ☝️ И это потому, что Object.assign копирует ВСЕ свойства исходной строки. Вот как я бы объяснил это с точки зрения не-разработчика. Вы идете в магазин, чтобы купить собаку. Но затем магазин Object.assign продает вам собаку с крыльями дракона. Звучит очень круто, но на самом деле это домашнее животное не для аренды. Хм… Я не думаю, что это мой лучший пример. Но я думаю, вы меня поняли 😂

      Преобразование в браузере нормальное 🙂

      Теперь я не думаю, что это серьезное нарушение условий сделки, причина:

      Похоже, что браузеры имеют какой-то механизм для «безопасного» выполнения Object. assign([], «string») и избегания добавления методы этой строки в массив.

      Спасибо @lukeshiru: за то, что поделились со мной этими знаниями 👏 Он также создал код игровой площадки TypeScript, чтобы вы могли видеть > ссылка

      @CaptainOrion_: Превратите строку в массив символов, но с помощью функции отображения 🤣

      @HiUmesh3: Array.prototype.slice.call('string') тоже подойдет

      @inside.code:

      Дополнительная информация: безопаснее использовать оператор распространения (второй метод), а не String.prototype.split('') (первый метод), потому что split() не работает с некоторыми необычными символами.

      @faerberrr: У меня была строка, содержащая специальные символы, такие как åæāă и т. д. Когда я разделил их, используя .split('') и запустил .length , он вернул вдвое больше ожидаемого значения! Переключение на оператора спреда решило проблему.