¿Cómo escribo menos código y hago más?

Sin duda, puede escribir menos código haciendo que el código que muestra se base en tablas y elimine todo el código repetido (a menudo llamado DRY por "no se repita"):

 const currencyTable = { USD: ".agency-usd, .studio-usd, .small-usd, .price-USD", EUR: ".agency-eur, .studio-eur, .small-eur, .price-EUR", GBP: ".agency-gbp, .studio-gbp, .small-gbp, .price-GBP", AUD: ".agency-aud, .studio-aud, .small-aud, .price-AUD" }; jQuery(document).ready(function() { jQuery.get('https://ipapi.co/currency/', function(data) { // hide all by default Object.values(currencyTable).forEach(cls => jQuery(cls).addClass("hide")); // see which one to show const showClass = currencyTable[data] || currencyTable["USD"]; jQuery(showClass).removeClass("hide"); }); });

Tenga en cuenta que este código también es extensible automáticamente. Si desea agregar otra moneda, todo lo que debe hacer es agregar una línea a la tabla de currencyTable y agregar el HTML correspondiente a su página y este código lo admitirá automáticamente.

No muestra ningún código que use clases ES6 o esto. this.something , por lo que es difícil saber exactamente qué está preguntando al respecto. Javascript solía tener la palabra clave with que le permitía omitir algo de escritura, pero por varias razones, ya no se recomienda y ni siquiera está disponible en código de modo strict que incluye métodos ES6.

El primero persigue tareas principales similares y/o repetitivas y las implementa como funciones correctamente nombradas.

Dentro de tales funciones, uno busca mejoras adicionales como no consultar siempre el mismo campo una y otra vez. En cambio, al igual que con las monedas, uno podría acceder/consultar dichos campos exactamente una vez y almacenarlos en un mapa como objeto.

Por lo tanto, uno puede apuntar a cada campo específico de moneda directamente por su etiqueta de moneda.

Si se hace correctamente, finalmente se han creado muchas funciones, cada una con un nombre que describe su propósito específico. El código principal entonces es muy corto y se puede leer como prosa...

 // the module or globally scoped map like object. const currencyFields = {}; function assignCurrencyFields() { // access/query each currency-specific field // exactly once and store it in a module or // globally scoped map like object. Object.assign(currencyFields, { USD: $(".agency-usd, .studio-usd, .small-usd, .price-USD"), EUR: $(".agency-eur, .studio-eur, .small-eur, .price-EUR"), GBP: $(".agency-gbp, .studio-gbp, .small-gbp, .price-GBP"), AUD: $(".agency-aud, .studio-aud, .small-aud, .price-AUD"), }); } function hideAnyCurrencyField() { Object .values(currencyFields) .forEach(field => field.addClass("hide"); ); } function showCurrencyField(label) { // usage of the Nullish Coalescing operator ... `??` ... // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Nullish_coalescing_operator (currencyFields[label] ?? currencyFields['USD']).removeClass("hide"); } function updateCurrencyFields(currencyLabel) { hideAnyCurrencyField(); showCurrencyField(currencyLabel); } $(document).ready(function () { assignCurrencyFields(); $.get('https://ipapi.co/currency/', updateCurrencyFields); });