Listos para un #thread⚡️ para preparación de entrevistas?

Toca una herramienta que preguntan en entrevista de #algoritmos en #SiliconValley / #FAANG.

Hoy vamos a hablar de binary search (búsqueda binaria) con #Javascript!

[1/x]
Binary Search nos ayuda a encontrar elementos en una lista de una forma super optimizada.

Imaginemos que tenemos esta lista, y tenemos que encontrar el número "36"

Qué formas se te ocurren para encontrarlo?
Mmm, se me ocurre usar:
- indexOf
- filter
- includes
- incluso un for común y corriente.

El problema de todas estas soluciones, es que tienen un costo en Big O lineal. Big O(n), donde n es el tamaño de la lista.

Podemos hacerlo mucho mejor!
Binary Search (BS) es un algoritmo que nos ayuda a encontrar elementos descartando pedazos de la lista que no necesitamos.

Para usarlo, hay una regla importantísima: la lista tiene que estar ordenada!

Si ves una lista ordenada, es un indicador para resolver el algoritmo con BS!
Entendamos como funciona BS con un ejemplo visual.

Vamos a necesitar 3 variables.
- Un mínimo, que empezará en 0
- Un máximo, cuyo valor será el tamaño de la lista - 1
- Un pivote, que se calcula redondeando (min + max) / 2

pivote es el punto medio entre los rangos min y max!
En esta ocasión, pivote tiene un valor de 4. Este será el indice a buscar en esta ocasión.

array[4] -> 15

Estamos buscando el 36, y 15 es menor. La variable min es reemplaza por pivote + 1, y es hora de calcular pivote de nuevo!

Esto descarta la lista a la izquierda de pivote.
Ahora pivote vale 7!

array[7] -> 54

Uhm, aún no encontramos el 36. 54 es mayor, entonces la variable max es reemplaza por pivote - 1.

Todos los números a la derecha pivote son descartados, y calculamos pivote otra vez.

Ya casi nos acercamos!
pivote ahora vale 6!

array[6] -> 36

Al fin encontramos el número! Estaba en el índice 6.

Si hubieras hecho un for, habriamos hecho 6 INTENTOS!

Con BS, solo fueron 3.

Ahora imagina este problema con un millón de números. O con un billón de datos.

Este es el poder de BS!
Hora de codear!

Como vimos, primero necesitamos una función binary search que va a declarar una variable min, max y pivote.

Luego nos toca hacer el ciclo para mover el pivote por la lista!
Y como vamos a movernos por la lista?

Un while nos va ayudar. Este ciclo se va a repetir una y otra vez mientras min y max no se encuentren. Si lo hacen, es porque el número a buscar no está en la lista.

Y al inicio de cada ciclo, calculamos el punto medio de min y max.
Ahora tocan las condiciones!

Recuerda: si el número que vemos en este ciclo es menor al número a buscar, reducimos max, lo que va a descartar la lista a su derecha.

Si es menor, incrementamos min y nos deshacemos de la lista a la izquierda.
Si corremos el código, podemos ver que si encuentra el número 36!

En términos algorítmicos, que complejidad tiene binary search?

Un indexOf es Big O(n).

BS es Big O(logn)

Qué significa esto?
Big O(n) significa que dependiendo la cantidad de elementos, es la cantidad de acciones que harás en el peor de los casos. Si tienes un millón de datos y el que buscas está al final, buscarás un millón de veces hasta encontrarlo.

Bastante lento!
Big O(logn) significa que podemos resolver un problema con solo una parte de los datos que tenemos a la mano.

Matemáticamente es algo un poco más complejo de explicar, pero quedemos con esta definición por ahora!
Binary search es un algoritmo bastante común de encontrar en entrevistas. Normalmente se pregunta como un problema enfocado a esto, o como una forma para buscar una optimización al problema que estas realizando.

Conocerlo te da una ventaja para pasar la entrevista!
Y esto es todo! Nos vemos en un próximo  ⚡️ thread de "como enfrentar la entrevista de algoritmos para entrar a #SiliconValley/#FAANG"!

• • •

Missing some Tweet in this thread? You can try to force a refresh
 

Keep Current with Charlie Charlie ⚡️

Charlie Charlie ⚡️ Profile picture

Stay in touch and get notified when new unrolls are available from this author!

Read all threads

This Thread may be Removed Anytime!

PDF

Twitter may remove this content at anytime! Save it as PDF for later use!

Try unrolling a thread yourself!

how to unroll video
  1. Follow @ThreadReaderApp to mention us!

  2. From a Twitter thread mention us with a keyword "unroll"
@threadreaderapp unroll

Practice here first or read more on our help page!

More from @charliesbot

17 Feb
Ya hablamos de Debounce y Throttle en otros threads. Ambos son funciones que son parte de #lodash.

Ocurre que curry también está en lodash. Es una función poderosa para frontend y de functional programming!

Este es un tema #Javascript avanzado! 🤓

Qué es curry? Un ⚡️#thread
Antes que nada, tenemos que saber que curry es un concepto de functional programming (uno de mis temas favoritos!)

Imagina que tienes una función suma.

Suma recibe 3 argumentos y regresa la suma de ellos.
Es un caso super común! Pero qué tal si queremos tener la opción de enviarle los argumentos 1 a 1, en diferentes tiempos, y que se ejecute "mágicamente" hasta que tenga todos?

Esto es el concepto de curry, y en este caso es una "curried function"
Read 15 tweets
16 Feb
Ayer estaba hablando con un amigo que esta haciendo entrevistas en Silicon Valley, y me comentó que le pidieron programar un #throttle.

Este concepto es común que salga en la entrevista especializada de #frontend / #javascript.

Qué es #throttle? Un ⚡️ #Thread

[1/x]
La semana pasada hablamos de #debounce. #throttle es una función hermana de esta.

Throttle es una función que recibe 2 args: la función a ejecutar y un tiempo de bloqueo.

Cuando la función se ejecuta, el tiempo comienza a correr y bloquea cualquier otra ejecución.
Veamos el problema!

Tenemos una función que imprime texto en la consola.

El entrevistador solamente dirá: "ok, programa un throttle"

Si no sabes que es un throttle, te lo explicará. Pero son puntos menos, cuidado! 🚨

Throttle y debounce son tools básicas para todo frontend.
Read 10 tweets
15 Feb
Un breve spoiler del capítulo de hoy. Es uno de mis favoritos!

- José y yo tuvimos un path muy parecido. Yo apliqué a cerca de 20 empresas, de las cuales hice 12 entrevistas, todo en 3 semanas.

[1/x]
En este episodio platicamos la realidad de nuestro camino. Recibimos muchos mensajes donde nos piden el método que nos hizo lograr nuestras ofertas.

La verdad es que no hay método infalible. Lo que hicimos fue aplicar a todas las empresas que nos gustaban.
Nos preparamos con los algoritmos y estructuras de datos bajo el brazo. Pero las entrevistas son 70% preparación, 30% suerte.

La única forma de lograr entrar a todas estas empresas grandes es aplicando. El miedo siempre está ahí y no se va a ir por más que nos preparemos.
Read 4 tweets
11 Feb
Un feature #Javascript en stage 2 (que llegará pronto a una futura versión de #ECMAScript!

Finalmente vamos a tener estructuras de datos inmutables!: tuples y records ❤️

Un record es un objeto inmutable, y empiezan con "#"

Al tener inmutabilidad, podemos comparar 2 records!
Y una tuple es un array inmutable. Se declaran igual que un array, empezando con un "#".

También podemos comparar dos tuples sin pasos extras.
En Javascript no podiamos comparar 2 listas o 2 objetos de forma sencilla, porque al hacerlo se comparaba la referencia, no los valores.

Algunas esct. de datos inmutables tienen algoritmos para generar un id dependiendo su valor. Al comparar 2 estructuras, se comparan los ids.
Read 4 tweets
11 Feb
Un ⚡️lightning #thread de mis libros favoritos para Front End 🧵#javascript #CSS

Varios de estos recursos los sigo leyendo cada cierto tiempo, y son excelentes para prepararse en la entrevista especializada de Front End de las empresas grandes en Silicon Valley / #FAANG

[1/x]
Eloquent Javascript: mi biblia de JS enfocado al browser. Desde APIs del DOM hasta técnicas para mejorar el performance de las aplicaciones web.

Si tuvieras que elegir un libro de esta lista, que sea este.
Marca un antes y después como developer.

eloquentjavascript.net
#CSS Secrets: Cuando empecé mi carrera como front end, odiaba CSS.

Este libro me abrió la mente para descubrir que no lo odiaba, sino que no lo entendía. Y va mucho más allá: no solo ser técnico, pero creativo al crear una UI.

amazon.com/CSS-Secrets-So…
Read 7 tweets
9 Feb
En lo que tengo mi break del segundo día de on boarding en #Google, les dejo uno de mis tools favoritos para codear: hablemos de terminales.
lightning #thread ⚡️🧵

Si estás usando Mac/Linux: Kitty.

Porque lo prefiero sobre Alacritty / iTerm? [1/x]

sw.kovidgoyal.net/kitty/
Kitty, iTerm y Alacritty usan el GPU para el render. En otras palabras, son rapidísimos.

La ventaja de Kitty es el único que soporta ligatures (el efecto de combinar varios caracteres en uno solo.

Para mi que vivo en la terminal, la velocidad y estos detalles son especiales.
Si estás en Windows: Windows Terminal.

Es la mejor terminal que he usado, por mucho! Excelente trabajo de Microsoft (a parte de VS Code)

También soporta GPU y ligatures.

github.com/microsoft/term…
Read 6 tweets

Did Thread Reader help you today?

Support us! We are indie developers!


This site is made by just two indie developers on a laptop doing marketing, support and development! Read more about the story.

Become a Premium Member ($3/month or $30/year) and get exclusive features!

Become Premium

Too expensive? Make a small donation by buying us coffee ($5) or help with server cost ($10)

Donate via Paypal Become our Patreon

Thank you for your support!

Follow Us on Twitter!