100 JS Functions

Beginner

1. CurrentYear

2. SimpleCounter

3. DoubleNumber

4. CreateColor

5. DynamicGrid

6. DynamicPictureSize

7. RandomButton

8. TabbedNavigation

9. MathOperator

10. GuessTheNumber

11. BetweenDates

12. Reactions

13. FeedTheBunny

14. Countdown

15. ClickFast

16. SkillsForJobs

17. UsersTabel

18. TodoList

19. UserSearch

20. SpendingInfo

10.GuessTheNumber

Write a component named GuessTheNumber that receives a prop called targetNumber and renders an input with the label Guess the number and a status.

targetNumber: number;

Your task is to guess this number.

You'll have an input that works in realtime. As you write in the input, the status will appear underneath it:

  • "Cold": this will appear if the difference between the targetNumber and your number is bigger than 1000
  • "Warm": this will appear if the difference is between 1000 and 100 .
  • "Hot": this will appear if the difference is smaller than 100 .
  • "SUCCESS": this will appear only when the number is exactly the same .

Example 1

Input

targetNumber

=

Demo

Open demo in new window

You'll see test results here!