Добавить первую заглавную букву символа для ввода и массива (Javascript)

Question

Добавить первую заглавную букву символа для ввода и массива (Javascript)

1

Я бы хотел, чтобы пользователь вводил свои собственные плоды и имел там множество фруктов. я разобрался, но до этого я хотел бы сделать каждое слово первого символа заглавной буквой, а затем выплюнуть его на html с "с" на каждой записи. Я не уверен, что я на правильном пути. Любая помощь очень ценится! Спасибо

let fruits = ["banana", "orange", "apple", "kiwi"];

function addFruits () {
let fruitInput = prompt ("Please Enter More Fruits").toLowerCase().split(" ");
let fruitsAdded = fruits.push(fruitInput);
let fruitsPushed = fruitsAdded.map(
    function(value){ 
        return value.replace(value.charAt(0), value.charAt(0).toUpperCase());
    });
fruits.sort();
document.getElementById("sortedFruits").innerHTML = fruits.join(" with ");

josh 19 окт. 2018, в 14:45

Источник

Теги:

javascript

string

arrays

function

3 ответа

1

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

// set up your list of fruit and the handles for your event/render
let fruits = ["banana", "orange", "apple", "kiwi"];
const wrapper = document.querySelector('#sortedFruits');
const button = document.querySelector('#add_button');

const render = () => {
  // build (and sort) a list from the fruits array
  const list = fruits
    .sort()
    // uppercase the first character and ensure the rest are lower
    .map(str => str.slice(0,1).toUpperCase() + str.slice(1).toLowerCase())
    // format item for render
    .map(fruit => '<li>${fruit}</li>')
    .join('');
  
  // replace list with new list
  wrapper.innerHTML = list;
}

const addFruits = () => {
  // take user input
  const input = prompt('Please enter more fruit')
  // build array of fruit to add
  const newFruit = input
    .toLowerCase()
    .split(' ');
  
  // update fruit list
  fruits = [ ...fruits, ...newFruit ];
  // show updated list
  render();
}

// initial list
render();
// add event handler to trigger fruit addition
button.addEventListener('click', addFruits);

<section>
  <input type="button" name="add_fruit" value="Add More Fruit!" id="add_button" />
  <ul id="sortedFruits"></ul>
</section>

D Lowther 19 окт. 2018, в 09:58

0

Работает так же, спасибо за вашу помощь !!
josh 19 окт. 2018, в 14:08

-1

    function Firstupchar(letter) {
        return letter[0].toUpperCase() + letter.substring(1).toLowerCase()
    }

["one","two"].map(c => Firstupchar(c) ).join(" with ")

hossein sedighian 19 окт. 2018, в 10:41

0

Спасибо за этот фрагмент кода, который может оказать некоторую ограниченную, немедленную помощь. Правильное объяснение значительно улучшило бы его долгосрочную ценность , показав, почему это хорошее решение проблемы, и сделало бы его более полезным для будущих читателей с другими, похожими вопросами. Пожалуйста, измените свой ответ, чтобы добавить некоторые объяснения, в том числе предположения, которые вы сделали.
FrankerZ 19 окт. 2018, в 13:45

Ещё вопросы

Работает так же, спасибо за вашу помощь !!
Спасибо за этот фрагмент кода, который может оказать некоторую ограниченную, немедленную помощь. Правильное объяснение значительно улучшило бы его долгосрочную ценность , показав, почему это хорошее решение проблемы, и сделало бы его более полезным для будущих читателей с другими, похожими вопросами. Пожалуйста, измените свой ответ, чтобы добавить некоторые объяснения, в том числе предположения, которые вы сделали.

Nina Scholz · Accepted Answer · 2018-10-19T11-55-00.000Z

Я взял ваш код и работал

нажатие значений массива с синтаксисом распространения ..., для получения всех элементов как одиночных параметров,
удалив назначение Array#push, поскольку он возвращает новую длину массива, а не новый массив или заданный массив,
перемещая сортировку выше, потому что вам нужен отсортированный массив,
теперь получаю слова верхнего слова из fruits
внутри обратного вызова для Array#map возьмите первый символ как строку верхнего регистра и resz строки с String#slice.

function addFruits() {
    let fruitInput = prompt("Please Enter More Fruits").toLowerCase().split(" ");
    fruits.push(...fruitInput);
    fruits.sort();
    let upperCased = fruits.map(function(value) {
        return value[0].toUpperCase() + value.slice(1);
    });
    document.getElementById("sortedFruits").innerHTML = upperCased.join(" with ");
}

let fruits = ["banana", "orange", "apple", "kiwi"];
addFruits();

<div id="sortedFruits"></div>