TypeError: Невозможно прочитать свойство 'length' с неопределенной реакцией - PullRequest
Новая
       32

TypeError: Невозможно прочитать свойство 'length' с неопределенной реакцией

0 голосов
/ 15 апреля 2020

Я делаю простое упражнение в React. Цель упражнения - просто:

  • Случайным образом извлечь фрукты из массива
  • Записать сообщение «Я бы хотел один RANDOMFRUIT, пожалуйста».
  • Записать сообщение «Вот ты go: RANDOMFRUIT»
  • Записать сообщение «Вкусный! Можно мне еще один? »
  • Удалите фрукты из множества фруктов
  • Запишите сообщение« Извините, мы все вышли. У нас осталось FRUITSLEFT.

Во время выполнения этого кода я столкнулся со следующей ошибкой. По какой-то причине «длина», похоже, является проблемой. 

TypeError: Cannot read property 'length' of undefined
Module../src/index.js
C:/Users/jaina/Desktop/ReactAPPS/exercise1/exercise-one/src/index.js:15
  12 | // Remove the fruit from the array of fruits
  13 | let remaining = remove(foods, fruit);
  14 | // Log the message “I’m sorry, we’re all out. We have FRUITSLEFT left.”
> 15 | console.log(`I’m sorry, we’re all out. We have ${remaining.length} other foods left.`);
  16 |

В ней также указано __webpack_require__ наряду с другими предупреждениями веб-пакетов. Но я предполагаю, что основная причина не работает - это то, что длина не определена.

index. js

import foods from './foods';
import { choice, remove } from './helpers';

// Randomly draw a fruit from the array
let fruit = choice(foods);
// Log the message “I’d like one RANDOMFRUIT, please.”
console.log(`I’d like one ${fruit}, please.`);
// Log the message “Here you go: RANDOMFRUIT”
console.log(`Here you go: ${fruit}`);
// Log the message “Delicious! May I have another?”
console.log('Delicious! May I have another?');
// Remove the fruit from the array of fruits
let remaining = remove(foods, fruit);
// Log the message “I’m sorry, we’re all out. We have FRUITSLEFT left.”
console.log(`I’m sorry, we’re all out. We have ${remaining.length} other foods left.`);

Foods. js

const foods = [
    "?", "?", "?", "?", "?", "?", "?", "?",
    "?", "?", "?", "?", "?", "?", "?",
];

export default foods;

помощник . js

function choice(items){
    let idx = Math.floor(Math.random()* items.length);
}

function remove(items, item){
    for (let i = 0; i < items.length; i++){
        if(items[i] === item){
            return [ ...items.slice(0,i), ...items.slice(i+1)];
        }
    }
}

export {choice, remove};

Любая помощь приветствуется.

Ответы [ 4 ]

1 голос
/ 15 апреля 2020

В helper.js, если ваша функция remove ничего не найдет, она вернет undefined. Затем, когда вы говорите ... 

console.log(`I’m sorry, we’re all out. We have ${remaining.length} other foods left.`);

... вы предполагаете, что remaining является массивом, но на самом деле он не определен.

Попробуйте поставить return items; в конце функции remove, после для l oop.

0 голосов
/ 15 апреля 2020

Изменить ваш выбор и удалить функцию 

function choice(items) {
    return Math.floor(Math.random()*items.length);
}

function remove(items, item) {
    return items.filter(e => e !== item);
};
0 голосов
/ 15 апреля 2020

Ваша проблема, кажется, здесь: 

function choice(items){
    let idx = Math.floor(Math.random()* items.length);
}

Итак, let fruit = choice(foods), фрукты всегда будут неопределенными.

попытайтесь вернуть значение вспомогательной функции, например так: 

function choice(items){
   let fruitIndex = Math.floor(Math.random()* items.length);
   return items[fruitIndex];
}

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

0 голосов
/ 15 апреля 2020

В приведенном выше коде верните items, если в функции remove ничего не найдено. 

function remove(items, item){
    for (let i = 0; i < items.length; i++){
        if(items[i] === item){
            return [ ...items.slice(0,i), ...items.slice(i+1)];
        }
    }
    // change this to whatever you want in case it was able to find item to remove
    return items;
}
...