Entonces podemos llegar a la pantalla del juego ahora y la computadora está
adivinando un número aquí, un número aleatorio que excluye nuestro número real para la primera suposición inicial.
Ahora debemos asegurarnos de que se puedan hacer conjeturas posteriores cuando presionamos el botón inferior o superior aquí
en la pantalla del juego. Para eso, agreguemos
una función dentro de nuestro componente funcional porque esta función necesitará acceso al estado circundante y al
componente circundante y darle el nombre que desee, como el siguiente controlador de adivinanzas, el nombre que prefiera y esta es una función que
en realidad deberías obtener un
argumento, la dirección en la que debería estar la siguiente aproximación, de manera
más baja o más grande. Ahora, lo
primero que quiero hacer aquí es asegurarme de validar la dirección.
Ahora, esta función aquí debería ejecutarse cuando se presionan los botones, pero, por supuesto, el
valor de dirección, por lo que el valor que pasamos como argumento debería diferir según
el botón.
Entonces, aquí tenemos el siguiente controlador de conjeturas conectado a onPress, sin paréntesis, para proporcionar ese puntero
en nuestra función a onPress para que esto se ejecute eventualmente cuando el usuario presione
esto, pero fui a preconfigurar el argumento que se pasará al siguiente controlador de conjeturas cuando esto
se ejecuta.
Podemos hacer esto con bind, bind esto porque el primer argumento para bind es siempre a lo que esto debería referirse
en la función que se llama, no importa aquí, así que podemos vincularlo a esto.
Sin embargo, el segundo valor que pasamos aquí para vincular será el primer argumento recibido por nuestra función
y, por lo tanto, esta será la dirección recibida aquí y, por supuesto, depende de usted qué lógica usa aquí,
para mí
tiene sentido usar simplemente un cadena donde aquí pasamos más abajo como una cadena y para el otro botón, pasamos más grande para que
tengamos estos dos identificadores que
se pasan esencialmente al siguiente controlador de conjeturas. Entonces, la dirección será menor o
mayor y ahora
queremos validar si eso es correcto.
Entonces, por ejemplo, si seleccionó un número de digamos 55 y la computadora adivinó 60, entonces si le da a
la computadora la pista de que los números deberían ser mayores, obviamente eso está
mal porque el número debería ser menor, su número fue 55, supongo era 60,
es incorrecto si le
dice a la computadora que el número que debe adivinar a continuación debe ser mayor que 60,
¿verdad?
Por lo tanto, queremos
validar esto y, por lo tanto, aquí podemos verificar si
la dirección es igual a menor, por lo que si presionó el botón inferior y la suposición actual es menor, entonces apoya la elección del usuario, por lo que la
computadora realmente adivinó un número menor que nuestra elección, entonces menor es la pista incorrecta correcta porque
el
número debe ser menor, debe
ser mayor porque la suposición ya era demasiado baja. Entonces, ese es un escenario posible en el que estamos
obteniendo una pista equivocada, la alternativa y la envolveré entre paréntesis para dejar realmente claro
que esta es una condición aquí.
Entonces, la alternativa a
eso, la segunda condición que quiero verificar es que la dirección aquí es realmente mayor
y, al mismo tiempo, la suposición actual ya es mayor que nuestra
elección y también es una pista
incorrecta, solo en la dirección opuesta.
En ambos casos en los que damos una pista incorrecta, quiero lanzar una alerta y aprendiste que puedes hacerlo con la API
de alerta, la clase de alerta que puedes importar desde React Native al final. Luego, aquí, en nuestro cheque, usaré una alerta de alerta
para lanzar una alerta con un título de digamos que no mientas, por supuesto, puedes elegir el nombre que quieras,
me estoy escapando de esa
cita que imprimí como un carácter aquí con una barra invertida inicial porque de lo
contrario cerraría la cadena porque estoy usando comillas simples para rodear mis cadenas.
Así que ese es mi
título y luego el texto podría ser que sabes que esto está mal pero, por supuesto, puedes
tener el texto que quieras aquí, también puedes ser menos moralista si quieres. Ahora quiero presentar un botón aquí y el botón
dice que ya se explican los objetos que pasa a ese tercer conjunto de argumentos que toma
la alerta y allí el texto podría ser lamentable y el estilo podría cancelarse y no necesita proporcionar un controlador onPress, Si
no proporciona uno, lo único que sucederá es que al hacer clic en el botón se cerrará la
alerta, lo cual está bien.
Entonces, aquí, le damos al usuario un toque en sus dedos, por así decirlo, y nos aseguramos de que no
se den
pistas incorrectas y quiero volver
aquí, así que quiero detener la ejecución de la función si tenemos un valor tan incorrecto.
Si lo hacemos más allá de
este bloque if, entonces si damos una pista correcta, entonces queremos generar un nuevo número aleatorio.
Entonces, aquí quiero verificar si la dirección es más baja y ahora sabemos
que era correcta,
por lo que la computadora debe adivinar un número que es más bajo que el número anterior, entonces
sabemos que se debe generar un nuevo número aleatorio hacia una suposición actual. El límite superior máximo.
Por lo tanto, podemos llamar a generar aleatorio entre de nuevo y el número mínimo, bueno, ese es probablemente uno, pero
¿y si el usuario ya adivinó otro
número donde le dijimos a la computadora que era demasiado pequeño y entonces tendríamos un problema aquí porque
el más bajo el límite no siempre es uno, ¿qué pasa si el
usuario adivinó 10 y dijimos que no, tiene que ser mayor?
Bueno, entonces el usuario adivina 50 y decimos que debería ser más bajo que eso, la computadora debería,
por supuesto,
adivinar de nuevo, pero no debería adivinar por debajo de 10 porque ya mencionamos que esto es demasiado pequeño antes.
Entonces, nuestro máximo y mínimo actuales deberían ajustarse con el tiempo a medida que damos pistas sobre si el número que la computadora adivinó
es demasiado pequeño o demasiado grande.
Por lo tanto, podemos usar otro gancho proporcionado por React y ese es el gancho useRef.
Ahora puede conocer ese gancho como un gancho que le permite crear un objeto que puede vincular a las entradas, por lo
que a sus elementos de entrada en jsx para acceder a ellos en su código y esa es
una forma de usarlo, pero useRef también le permite hacer otra cosa que es genial.
Le permite definir un valor que sobrevive al re-renderizado de componentes, por lo que sobrevive a que
este componente se reconstruya y eso es exactamente
lo que necesitamos aquí porque queremos iniciar sesión en un mínimo y máximo que podamos cambiar pero
que no se regenere solo porque el componente se vuelve a representar.
Entonces, aquí en la parte superior de este componente, después de inicializar el estado, podemos
crear una nueva constante, currentLow quizás donde useRef es uno y luego otra constante, currentHigh donde useRef es 100, estos son nuestros límites
iniciales que estamos usando para el azar número y ahora podemos actualizar estas
referencias aquí.
Entonces, sabemos que la dirección debe ser más baja, lo que
podemos hacer en ese caso, en lugar de generar instantáneamente un nuevo número, podemos establecer currentHigh. actual, debido a que las referencias generadas
por React son objetos que tienen una propiedad actual en la que se almacena el
valor real, por lo
que configuramos current igual a current guess.
Entonces, lo que estamos diciendo es que si te digo, la computadora que el número que adivinaste es demasiado grande
y deberías adivinar uno más bajo, entonces sé que este número que supuse es mi actual Alto, el número que es correcto puede ' No ser más
alto que este, así que
guardo el número que acabo de adivinar como mi máximo actual.
Y nuevamente, estas constantes de referencia aquí no se regeneran cuando este componente se crea nuevamente,
en cambio, si se han inicializado una vez, un poco como el estado en realidad, entonces se
almacenan desconectadas de ese componente y React reconoce que ya se han inicializado. y
no los regenerará, sino que inicializará currentHigh con el valor almacenado previamente.
Entonces, es un poco como si estuviera manejando esto en un estado, la diferencia con el estado en cambio si cambia el
valor almacenado allí, el componente no se vuelve a procesar porque no queremos eso aquí.
No quiero volver a representarlo componente solo porque estoy guardando un nuevo máximo, que no tiene ningún impacto en mi
vista, en mi código jsx, solo
tiene un impacto en mi lógica, pero por eso no necesito volver a representar el
componente, por eso uso una referencia aquí en lugar de un estado.
Entonces, eso sucede si es más bajo, de lo
contrario, si le dijéramos a la computadora que la suposición era demasiado pequeña y el
número real debería
ser mayor, debería ser mayor, bueno, en ese caso establecemos la corriente baja en la conjetura actual porque entonces sabemos Tenemos un
límite inferior.
Y ahora el objetivo es o el truco es generar un nuevo número aleatorio que tenga en cuenta estos límites,
por lo que
utilizamos el mínimo actual con nuestra referencia y luego. current como mínimo y currentHigh. actual como máximo y quiero
excluir la suposición actual para que no podamos adivinar el mismo número nuevamente aquí, para que para
el próximo rol, definitivamente obtengamos un número diferente. Entonces, eso es algo que almaceno en un número constante, el
siguiente, esto se genera
aquí cuando se
ejecuta el siguiente controlador de conjeturas que ocurre cuando tocamos uno de estos botones.
Y ahora el siguiente número es el siguiente número que
queremos usar, así que ahora lo que podemos hacer simplemente como podemos llamar establecer la conjetura actual y agregar el
siguiente número, ahora el componente se volverá a representar y generará la siguiente suposición. Así que vamos a intentarlo, por ahora no tenemos
el juego
terminado, pero al menos podemos intentar adivinar números aquí.
Entonces ingresé 53 como mi número,
ahora comenzamos y la computadora adivinó 85.
Si ahora digo mayor, recibimos esa advertencia porque mentimos, teníamos 53 como número, por lo que la suposición es
demasiado alta, debería ser menor.
Ahora es 28, bueno, eso es demasiado bajo, debería ser mayor.
Entonces, si toco más bajo, recibo la advertencia, si toco más grande, subimos ahora 78 y ahora
en este momento, 23, la suposición anterior será nuestro límite inferior y ahora cuando toque más
abajo, 78 la suposición actual será nuestro límite superior, por lo que la
próxima suposición ciertamente no estará por encima de 78 y no estará por debajo de 23, pero aún
es demasiado baja, es demasiado grande, quiero
decir, es demasiado baja, así
que usemos
una más grande, más baja
y esa sería la correcta .
Ahora por ahora no tenemos nada que verifique si la
computadora adivinó correctamente.
Así que eso es lo siguiente que tendremos que implementar aquí.