¿Cómo anular métodos en localStorage? | por Sabesan Sathananthan


Foto por Lia Trevarthen en Unsplash

A menudo quiero reescribir localStorage para implementar una determinada función. ¿Cuáles son los métodos para reescribir los métodos en localStorage? Hay muchos desarrolladores que quieren reescribir los métodos en localStoragepara darse cuenta del tiempo de caducidad de la clave, o para monitorear la lectura y escritura de la clave. Entonces, ¿cuáles son los métodos para anular los métodos en localStorage. Este es mi artículo número 43 de Medium.

A muchos desarrolladores les gusta la thought de reescribir, primero manteniendo el método unique y luego reescribiendo el método directamente en localStorage como se muestra a continuación.

Sin embargo, esta forma de escribir no anula el método setItem()pero para agregar un setItem atribuir a localStorage. Cuando se declara el atributo de valor del método, el nativo setItem() se sobrescribe el método.

No lo he probado demasiado, pero en algunos navegadores, este atributo se ignorará y hará que nuestra reescritura falle.

Si nos fijamos bien, setItem y getItem se heredan de Storage __proto__ pseudo propiedad.

Entonces anulamos directamente lo anterior. localStorage.__proto__ método.

Esto implementa la anulación actual de la setItem() método.

Pero todavía hay un problema aquí. Ambas cosas localStorage y sessionStorage heredar de Almacenamiento. Después de reescribir las propiedades o métodos en localStorage.__proto__los métodos en sessionStorage también se reescriben.

No modificamos directamente el método de localStorage sí mismo, pero envuelva una capa en el exterior, y luego use localStorage para realizar la función de almacenamiento en la capa inferior.

De esta manera, el grado de libertad es relativamente mayor y no hay problema de compatibilidad en la Sección 1. Solo ha cambiado el nombre utilizado y las propiedades y métodos en localStorage están completamente bloqueados.

Si desea utilizar un objeto personalizado sin el paquete, debe implementar todas las propiedades y métodos. No es posible simular un método solo como el anterior.

Utilizar Object.definePropertyo Proxyequivalente a anular por completo el localStorage variable. Mejor que la Sección 3 en que el nombre no ha cambiado.

4.1 Cobertura directa, sin efecto

Si usa el siguiente método para cubrir directamente, no tendrá ningún efecto.

window.localStorage = Object.create(null);  console.log(window.localStorage); //nonetheless native

Obtenemos el descriptor de propiedad de localStorage mediante Object.getOwnPropertyDescriptor. Se puede encontrar que no hay escritura: atributo verdadero, lo que significa que localStorage no se puede escribir directamente.

4.2 Anulando con Object.defineProperty

Como no hay writableatributo, le agregaremos uno. podemos anular localStorage con Object.defineProperty.

Pero no puede usar el método de escritura anterior con una capa exterior. Si das directamente lo anterior myLocalStorage a localStorage entonces generará recursividad infinita (para evitar engaños, el método de escritura incorrecto no se escribirá aquí).

He hecho una copia de seguridad de localStorage aquí. Si necesita un método nativo, también puede operarlo.

En este artículo, no implementamos específicamente una función como establecer el tiempo de vencimiento. Pero hablar de cómo reescribir localStorage o los métodos en él desde otra perspectiva.

Más contenido en PlainEnglish.io. Suscríbete a nuestro boletín semanal gratuito. Siga con nosotros Gorjeo, LinkedIn, Youtubey Discordia.



Related Articles

Registros escolares y derechos de los estudiantes

Los estudiantes de las escuelas públicas no pierden sus derechos...

Comments

LEAVE A REPLY

Please enter your comment!
Please enter your name here

Same Category

spot_img

Stay in touch!

Follow our Instagram