56 praktische JavaScript-Toolfunktionen zur Verbesserung der Entwicklungseffizienz

56 praktische JavaScript-Toolfunktionen zur Verbesserung der Entwicklungseffizienz

Hilfsfunktionen:

1. Digitaler Betrieb

(1) Generieren Sie Zufallszahlen in einem bestimmten Bereich

(2) Tausendertrennzeichen

export const format = (n) => {
    Lassen Sie uns num = n.toString();
    lass len = num.length;
    wenn (Länge <= 3) {
        Rückgabenummer;
    } anders {
        lass temp = '';
        sei Rest = Länge % 3;
        if (Rest > 0) { // Kein ganzzahliges Vielfaches von 3 return num.slice(0, Rest) + ',' + num.slice(Rest, Länge).match(/\d{3}/g).join(',') + temp;
        } sonst { // ganzzahliges Vielfaches von 3 return num.slice(0, len).match(/\d{3}/g).join(',') + temp; 
        }
    }
}

2. Array-Operationen

(1) Array nicht in der richtigen Reihenfolge

exportiere const arrScrambling = (arr) => {
    für (sei i = 0; i < arr.length; i++) {
      const randomIndex = Math.round(Math.random() * (arr.length - 1 - i)) + i;
      [arr[i], arr[Zufallsindex]] = [arr[Zufallsindex], arr[i]];
    }
    Rückflug an;
}

(2) Array-Abflachung

exportiere const flatten = (arr) => {
  lass Ergebnis = [];

  für(lass i = 0; i < arr.length; i++) {
    wenn(Array.isArray(arr[i])) {
      Ergebnis = Ergebnis.concat(flatten(arr[i]));
    } anders {
      Ergebnis.push(arr[i]);
    }
  }
  Ergebnis zurückgeben;
}

(3) Gewinnung von Zufallszahlen aus einem Array

exportiere const sample = arr => arr[Math.floor(Math.random() * arr.length)];
 

3. String-Operationen

(1) Generieren Sie eine zufällige Zeichenfolge

export const randomString = (Länge) => {
    let chars = 'ABCDEFGHJKMNPQRSTWXYZabcdefhijkmnprstwxyz123456789';
    let strLen = chars.length;
    lass randomStr = '';
    für (sei i = 0; i < len; i++) {
        randomStr += chars.charAt(Math.floor(Math.random() * strLen));
    }
    returniere randomStr;
};

(2) Der erste Buchstabe der Zeichenfolge wird groß geschrieben

export const fistLetterUpper = (str) => {
    return str.charAt(0).toUpperCase() + str.slice(1);
};

(3) Die mittleren vier Ziffern der Mobiltelefonnummer werden zu *

export const telFormat = (tel) => {
   tel = String(tel); 
    return tel.substr(0,3) + "****" + tel.substr(7);
};

(4) Konvertieren Sie Camel-Case-Namen in Bindestrich-Case-Namen

export const getKebabCase = (str) => {
    return str.replace(/[AZ]/g, (Artikel) => '-' + Artikel.toLowerCase())
}

(5) Konvertieren Sie Bindestrichnamen in Camel-Case-Namen

exportiere const getCamelCase = (str) => {
    return str.replace( /-([az])/g, (i, item) => item.toUpperCase())
}

(6) Volle Breite in halbe Breite umwandeln

exportiere const toCDB = (str) => {
  lass Ergebnis = "";
  für (lass i = 0; i < str.length; i++) {
    Code = str.charCodeAt(i);
    wenn (Code >= 65281 und Code <= 65374) {
      Ergebnis += String.fromCharCode(str.charCodeAt(i) - 65248);
    } sonst wenn (Code == 12288) {
      Ergebnis += String.fromCharCode(str.charCodeAt(i) - 12288 + 32);
    } anders {
      Ergebnis += str.charAt(i);
    }
  }
  Ergebnis zurückgeben;
}

(7) Halbe Breite in volle Breite umwandeln

export const toDBC = (str) => {
  lass Ergebnis = "";
  für (lass i = 0; i < str.length; i++) {
    Code = str.charCodeAt(i);
    wenn (Code >= 33 und Code <= 126) {
      Ergebnis += String.fromCharCode(str.charCodeAt(i) + 65248);
    } sonst wenn (Code == 32) {
      Ergebnis += String.fromCharCode(str.charCodeAt(i) + 12288 - 32);
    } anders {
      Ergebnis += str.charAt(i);
    }
  }
  Ergebnis zurückgeben;
}

4. Formatkonvertierung

(1) Zahlen in Großbuchstaben umwandeln

exportiere const digitUppercase = (n) => {
    const fraction = ['Winkel', 'Minute'];
    Konstante Ziffer = [
        'null', 'eins', 'zwei', 'drei', 'vier',
        „Fünf“, „Sechs“, „Sieben“, „Acht“, „Neun“
    ];
    Konstanteneinheit = [
        ['Yuan', '10.000', '100 Millionen'],
        ['', 'Nein', 'Nein', 'Nein']
    ];
    n = Math.abs(n);
    lass s = '';
    für (lass i = 0; i < Bruchlänge; i++) {
        s += (Ziffer[Math.floor(n * 10 * Math.pow(10, i)) % 10] + Bruch[i]).replace(/零./, '');
    }
    s = s || 'Ganzes';
    n = Math.floor(n);
    für (sei i = 0; i < unit[0].length und n > 0; i++) {
        sei p = '';
        für (sei j = 0; j < unit[1].length && n > 0; j++) {
            p = Ziffer[n % 10] + Einheit[1][j] + p;
            n = Math.floor(n / 10);
        }
        s = p.replace(/(零.)*零$/, '').replace(/^$/, '零') + Einheit[0][i] + s;
    }
    return s.replace(/(Nein.)*NeinKommando/, 'Kommando')
        .replace(/(零.)+/g, '零')
        .replace(/^whole$/, 'null Yuan ganz');
};

(2) Zahlen in chinesische Zahlen umwandeln

export const intToChinese = (Wert) => {
 const str = String(Wert);
 const len ​​= str.length-1;
 const idxs = ['','Verknüpfung','Neuanfang','Verknüpfung','Verknüpfung','Verknüpfung','Verknüpfung','Verknüpfung','Verknüpfung','Verknüpfung','Verknüpfung','Verknüpfung','Verknüpfung','Verknüpfung','Verknüpfung','Verknüpfung'];
 const num = ['null','eins','zwei','drei','vier','fünf','sechs','sieben','acht','neun'];
 return str.replace(/([1-9]|0+)/g, ( $, $1, idx, full) => {
    sei pos = 0;
    wenn($1[0] !== '0'){
      pos = Länge-idx;
      wenn(idx == 0 && $1[0] == 1 && idxs[len-idx] == 'Wert'){
        returniere idxs[Länge-idx];
      }
      return Num[$1[0]] + idxs[Länge-idx];
    } anders {
      lass links = Länge - idx;
      rechts lassen = Länge - idx + $1.Länge;
      wenn (Math.floor(rechts / 4) - Math.floor(links / 4) > 0) {
        pos = links - links % 4;
      }
      wenn(pos){
        gibt idxs[pos] + num[$1[0]] zurück;
      } sonst wenn( idx + $1.length >= len ){
        zurückkehren '';
      }anders {
        Rückgabewert: Num[$1[0]]
      }
    }
   });
}

5. Betriebsspeicher

(1) Speicherort localStorage

export const localStorageSet = (Schlüssel, Wert) => {
    wenn (!Taste) zurückgeben;
    wenn (Typ des Wertes !== 'Zeichenfolge') {
        Wert = JSON.stringify(Wert);
    }
    window.localStorage.setItem(Schlüssel, Wert);
};

(2) LocalStorage nutzen

export const localStorageGet = (Schlüssel) => {
    wenn (!Taste) zurückgeben;
    gibt window.localStorage.getItem(Schlüssel) zurück;
};

(3) LocalStorage löschen

export const localStorageRemove = (Schlüssel) => {
    wenn (!Taste) zurückgeben;
    window.localStorage.removeItem(Schlüssel);
};

(4) SessionStorage

export const sessionStorageSet = (Schlüssel, Wert) => {
   wenn (!Taste) zurückgeben;
    wenn (Typ des Wertes !== 'Zeichenfolge') {
      Wert = JSON.stringify(Wert);
    }
    window.sessionStorage.setItem(Schlüssel, Wert)
};

(5) SessionStorage abrufen

export const sessionStorageGet = (Schlüssel) => {
   wenn (!Taste) zurückgeben;
    gibt window.sessionStorage.getItem(Schlüssel) zurück
};

(6) SessionStorage löschen

export const sessionStorageRemove = (Schlüssel) => {
   wenn (!Taste) zurückgeben;
    window.sessionStorage.removeItem(Schlüssel)
};

6. Betriebsbezogene Cookies

(1) Einsatz von Cookies

export const setCookie = (Schlüssel, Wert, Ablauf) => {
    const d = neues Datum();
    d.setDate(d.getDate() + Ablauf);
    Dokument.cookie = `${key}=${value}; läuft ab=${d.toUTCString()}`
};

(2) Lesen von Cookies

export const getCookie = (Schlüssel) => {
    const cookieStr = unescape(document.cookie);
       const arr = cookieStr.split('; ');
       Lassen Sie cookieValue = '';
       für (sei i = 0; i < arr.length; i++) {
           const temp = arr[i].split('=');
           wenn (temp[0] === Schlüssel) {
               CookieWert = temp[1];
               brechen
       }
    }
    Cookie-Wert zurückgeben
};

(3) Löschung von Cookies

export const delCookie = (Schlüssel) => {
    document.cookie = `${encodeURIComponent(key)}=;expires=${new Date()}`
};

7. Formatprüfung

(1) Ausweisnummer verifizieren

export const checkCardNo = (Wert) => {
    sei reg = /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/;
    gibt reg.test(Wert) zurück;
};

(2) Überprüfen Sie, ob es Chinesisch enthält

export const haveCNChars => (Wert) => {
    return /[\u4e00-\u9fa5]/.test(Wert);
}

(3) Überprüfen Sie, ob es sich um eine Postleitzahl auf dem chinesischen Festland handelt

export const isPostCode = (Wert) => {
    return /^[1-9][0-9]{5}$/.test(value.toString());
}


(4) Prüfen Sie, ob es sich um eine IPv6-Adresse handelt

export const isIPv6 = (str) => {
    return Boolean(str.match(/:/g)?str.match(/:/g).length<=7:false && /::/.test(str)?/^([\da-f]{1,4}(:|::)){1,6}[\da-f]{1,4}$/i.test(str):/^([\da-f]{1,4}:){7}[\da-f]{1,4}$/i.test(str));
}

(5) Überprüfen Sie, ob es sich um eine E-Mail-Adresse handelt

export const isEmail = (Wert) {
    zurück /^[a-zA-Z0-9_-]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$/.test(Wert);
}

(6) Überprüfen Sie, ob es sich um eine Mobiltelefonnummer aus Festlandchina handelt

export const isTel = (Wert) => {
    return /^1[3,4,5,6,7,8,9][0-9]{9}$/.test(value.toString());
}

(7) Überprüfen Sie, ob Emoji-Ausdrücke enthalten sind

export const isEmojiCharacter = (Wert) => {
   Wert = String(Wert);
    für (lass i = 0; i < Wert.Länge; i++) {
        const hs = Wert.charCodeAt(i);
        wenn (0xd800 <= hs && hs <= 0xdbff) {
            if (Wert.Länge > 1) {
                const ls = Wert.charCodeAt(i + 1);
                const uc = ((hs - 0xd800) * 0x400) + (ls - 0xdc00) + 0x10000;
                wenn (0x1d000 <= uc && uc <= 0x1f77f) {
                    gibt true zurück;
                }
            }
        } sonst wenn (Wert.Länge > 1) {
            const ls = Wert.charCodeAt(i + 1);
            wenn (ls == 0x20e3) {
                gibt true zurück;
            }
        } anders {
            wenn (0x2100 <= hs && hs <= 0x27ff) {
                gibt true zurück;
            } sonst wenn (0x2B05 <= hs && hs <= 0x2b07) {
                gibt true zurück;
            } sonst wenn (0x2934 <= hs && hs <= 0x2935) {
                gibt true zurück;
            } sonst wenn (0x3297 <= hs && hs <= 0x3299) {
                gibt true zurück;
            } sonst wenn (hs == 0xa9 || hs == 0xae || hs == 0x303d || hs == 0x3030
                    || hs == 0x2b55 || hs == 0x2b1c || hs == 0x2b1b
                    || hs == 0x2b50) {
                gibt true zurück;
            }
        }
    }
   gibt false zurück;
}

8. Manipulation von URLs

(1) URL-Parameterliste abrufen

exportiere const GetRequest = () => {
    lassen Sie url = Standort.Suche;
    const paramsStr = /.+\?(.+)$/.exec(url)[1]; // Nimm den String nach ? const paramsArr = paramsStr.split('&'); // Teile den String mit & und speichere ihn in einem Array let paramsObj = {};
    // Parameter im Objekt speichern paramsArr.forEach(param => {
      if (/=/.test(param)) { // Parameter mit Wert verarbeiten let [key, val] = param.split('='); // Schlüssel und Wert aufteilen
        val = decodeURIComponent(val); // Decodeval = /^\d+$/.test(val) ? parseFloat(val) : val; // Bestimmen Sie, ob es in eine Zahl umgewandelt wirdif (paramsObj.hasOwnProperty(key)) { // Wenn das Objekt einen Schlüssel hat, fügen Sie einen Wert hinzuparamsObj[key] = [].concat(paramsObj[key], val);
        } else { // Wenn das Objekt diesen Schlüssel nicht hat, erstelle den Schlüssel und setze den Wert paramsObj[key] = val;
        }
      } else { // Prozessparameter ohne Wert paramsObj[param] = true;
      }
    })
    gibt paramsObj zurück;
};

(2) Überprüfen Sie, ob die URL gültig ist

exportiere const getUrlState = (URL) => {
  let xmlhttp = neues ActiveXObject("microsoft.xmlhttp");
  xmlhttp.Open("GET", URL, falsch);
  versuchen {
    xmlhttp.Send();
  } fangen (e) {
  Endlich
    let result = xmlhttp.responseText;
    wenn (Ergebnis) {
      wenn (xmlhttp.Status == 200) {
        gibt true zurück;
      } anders {
        gibt false zurück;
      }
    } anders {
      gibt false zurück;
    }
  }
}

(3) Schlüssel-Wert-Paare werden zu URL-Parametern verkettet

exportiere const params2Url = (obj) => {
     let-Parameter = []
     für (let key in obj) {
       params.push(`${key}=${obj[key]}`);
     }
     Rückgabewert für encodeURIComponent(params.join('&'))
}

(4) Ändern Sie die Parameter in der URL

export const replaceParamVal => (ParamName, Ersetzen mit) {
   const oUrl = location.href.toString();
   const re = eval('/('+ paramName+'=)([^&]*)/gi');
   location.href = oUrl.replace(re,paramName+'='+replaceWith);
   gib location.href zurück;
}

(5) Löschen Sie die angegebenen Parameter in der URL

export const funcUrlDel = (Name) => {
  const baseUrl = Standort.Herkunft + Standort.Pfadname + "?";
  const query = standort.suche.substr(1);
  wenn (Abfrage.Index von (Name) > -1) {
    const obj = {};
    const arr = query.split("&");
    für (sei i = 0; i < arr.length; i++) {
      arr[i] = arr[i].split("=");
      obj[arr[i][0]] = arr[i][1];
    }
    lösche Objekt[Name];
    returniere baseUrl + JSON.stringify(obj).replace(/[\"\{\}]/g,"").replace(/\:/g,"=").replace(/\,/g,"&");
  }
}

9. Beurteilung der Ausrüstung

(1) Bestimmen Sie, ob es sich um ein mobiles oder ein PC-Gerät handelt

export const isMobile = () => {
  if ((navigator.userAgent.match(/(iPhone|iPod|Android|ios|iOS|iPad|Backerry|WebOS|Symbian|Windows Phone|Phone)/i))) {
  gib „mobile“ zurück;
  }
  gib „Desktop“ zurück;
}

(2) Stellen Sie fest, ob es sich um ein Apple- oder Android-Mobilgerät handelt

export const isAppleMobileDevice = () => {
  let reg = /iphone|ipod|ipad|Macintosh/i;
  return reg.test(navigator.userAgent.toLowerCase());
}

(3) Stellen Sie fest, ob es sich um ein Android-Mobilgerät handelt

export const isAndroidMobileDevice = () => {
  Rückgabewert /android/i.test(navigator.userAgent.toLowerCase());
}

(4) Stellen Sie fest, ob es sich um ein Windows- oder Mac-System handelt

exportiere const osType = () => {
    const agent = navigator.userAgent.toLowerCase();
    const isMac = /macintosh|mac os x/i.test(navigator.userAgent);
   const isWindows = agent.indexOf("win64") >= 0 || agent.indexOf("wow64") >= 0 || agent.indexOf("win32") >= 0 || agent.indexOf("wow32") >= 0;
    wenn (istWindows) {
        gib "Windows" zurück;
    }
    wenn(istMac){
        gib "mac" zurück;
    }
}

(5) Stellen Sie fest, ob es sich um den in WeChat / QQ integrierten Browser handelt

export const browser = () => {
    const ua = navigator.userAgent.toLowerCase();
    if (ua.match(/MicroMessenger/i) == "micromessenger") {
        gib "weixin" zurück;
    } sonst wenn (ua.match(/QQ/i) == "qq") {
        gib "QQ" zurück;
    }
    gibt false zurück;
}

(6) Browsermodell und -version

exportiere const getExplorerInfo = () => {
    lass t = navigator.userAgent.toLowerCase();
    return 0 <= t.indexOf("msie") ? { //dh < 11
        Typ: "IE",
        Version: Nummer(t.match(/msie ([\d]+)/)[1])
    } : !!t.match(/trident\/.+?rv:(([\d.]+))/) ? { // zB 11
        Typ: "IE",
        Version: 11
    } : 0 <= t.indexOf("Kante") ? {
        Typ: "Kante",
        Version: Nummer(t.match(/edge\/([\d]+)/)[1])
    } : 0 <= t.indexOf("Firefox") ? {
        Typ: "Firefox",
        Version: Nummer(t.match(/firefox\/([\d]+)/)[1])
    } : 0 <= t.indexOf("chrome") ? {
        Typ: "Chrome",
        Version: Nummer(t.match(/chrome\/([\d]+)/)[1])
    } : 0 <= t.indexOf("opera") ? {
        Typ: "Opera",
        Version: Nummer(t.match(/opera.([\d]+)/)[1])
    } : 0 <= t.indexOf("Safari") ? {
        Typ: "Safari",
        Version: Nummer(t.match(/version\/([\d]+)/)[1])
    } : {
        Typ: t,
        Version: -1
    }
}

10. Browser-Bedienung

(1) Scrollen Sie zum Anfang der Seite

exportiere const scrollToTop = () => {
  const Höhe = Dokument.documentElement.scrollTop || Dokument.body.scrollTop;
  wenn (Höhe > 0) {
    window.requestAnimationFrame(nachOben scrollen);
    window.scrollTo(0, Höhe - Höhe / 8);
  }
}

(2) Scrollen Sie zum Ende der Seite

exportiere const scrollToBottom = () => {
  Fenster.scrollTo(0, Dokument.documentElement.clientHeight);  
}

(3) Scrollen Sie zum angegebenen Elementbereich

export const smoothScroll = (Element) => {
    document.querySelector(element).scrollIntoView({
        Verhalten: ‚glatt‘
    });
};

(4) Ermitteln Sie die sichtbare Fensterhöhe

exportiere const getClientHeight = () => {
    sei clientHeight = 0;
    wenn (Dokument.Body.ClientHeight && Dokument.DocumentElement.ClientHeight) {
        Clienthöhe = (Dokument.Hauptteil.Clienthöhe < Dokument.Dokumentelement.Clienthöhe) ? Dokument.Hauptteil.Clienthöhe : Dokument.Dokumentelement.Clienthöhe;
    }
    anders {
        Clienthöhe = (Dokument.Hauptteil.Clienthöhe > Dokument.Dokumentelement.Clienthöhe) ? Dokument.Hauptteil.Clienthöhe : Dokument.Dokumentelement.Clienthöhe;
    }
    Clienthöhe zurückgeben;
}

(5) Ermitteln Sie die sichtbare Fensterbreite

exportiere const getPageViewWidth = () => {
    zurückgeben (document.compatMode == "BackCompat" ? document.body : document.documentElement).clientWidth;
}

(6) Öffnen Sie den Browser im Vollbildmodus

exportiere const toFullScreen = () => {
    let-Element = Dokument.Text;
    wenn (element.requestFullscreen) {
      element.requestFullscreen()
    } sonst wenn (element.mozRequestFullScreen) {
      element.mozRequestFullScreen()
    } sonst wenn (element.msRequestFullscreen) {
      element.msRequestFullscreen()
    } sonst wenn (element.webkitRequestFullscreen) {
      element.webkitRequestFullScreen()
    }
}

(7) Beenden des Vollbild-Browsers

exportiere const exitFullscreen = () => {
    wenn (document.exitFullscreen) {
      document.exitFullscreen()
    } sonst wenn (document.msExitFullscreen) {
      document.msExitFullscreen()
    } sonst wenn (document.mozCancelFullScreen) {
      document.mozCancelFullScreen()
    } sonst wenn (document.webkitExitFullscreen) {
      document.webkitExitFullscreen()
    }
}

11. Zeitbetrieb

(1) Aktuelle Uhrzeit

exportiere const jetztZeit = () => {
    const jetzt = neues Datum();
    const year = jetzt.getFullYear();
    const Monat = jetzt.getMonth();
    const date = jetzt.getDate() >= 10 ? jetzt.getDate() : ('0' + jetzt.getDate());
    const Stunde = jetzt.getHours() >= 10 ? jetzt.getHours() : ('0' + jetzt.getHours());
    const miu = jetzt.getMinutes() >= 10 ? jetzt.getMinutes() : ('0' + jetzt.getMinutes());
    const sec = jetzt.getSeconds() >= 10 ? jetzt.getSeconds() : ('0' + jetzt.getSeconds());
    return +year + "Jahr" + (Monat + 1) + "Monat" + Datum + "Tag" + Stunde + ":" + miu + ":" + Sek.;
}

(2) Zeit formatieren

export const dateFormater = (Formatierer, Zeit) => {
    let date = time ? neues Datum(Zeit) : neues Datum(),
        Y = date.getFullYear() + '',
        M = date.getMonth() + 1,
        D = datum.getDate(),
        H = date.getHours(),
        m = date.getMinutes(),
        s = date.getSeconds();
    Rückgabewert: formatter.replace(/JJJJ|jjjj/g, J)
        .replace(/YY|yy/g, Y.substr(2, 2))
        .replace(/MM/g,(M<10 ? '0' : '') + M)
        .replace(/DD/g,(D<10 ? '0' : '') + D)
        .replace(/HH|hh/g,(H<10 ? '0' : '') + H)
        .replace(/mm/g,(m<10 ? '0' : '') + m)
        .replace(/ss/g,(s<10 ? '0' : '') + s)
}
// Datumsformatierer('JJJJ-MM-TT HH:mm:ss')
// Datumsformatierer('JJJJMMTTHHmmss')

12. JavaScript-Bedienung

(1) Verhindern Sie Blasenbildung

exportiere const stopPropagation = (e) => { 
    e = e || Fenster.Ereignis; 
    if(e.stopPropagation) { // W3C verhindert Bubbling-Methode e.stopPropagation(); 
    } anders { 
        e.cancelBubble = true; // IE verhindert Bubbling-Methode} 
} 

(2) Anti-Shake-Funktion

export const entprellen = (fn, warten) => {
  lass Timer = null;

  return Funktion() {
    lass Kontext = dies,
        args = Argumente;

    wenn (Zeitgeber) {
      Zeitüberschreitung löschen(Timer);
      Zeitgeber = null;
    }

    Timer = setzeTimeout(() => {
      fn.apply(Kontext, Argumente);
    }, Warten);
  };
}

(3) Drosselfunktion

exportiere const throttle = (fn, delay) => {
  lass curTime = Date.now();

  return Funktion() {
    lass Kontext = dies,
        args = Argumente,
        jetztZeit = Date.now();

    if (jetzteZeit - aktuelleZeit >= Verzögerung) {
      aktuelleZeit = Date.now();
      gibt fn.apply(Kontext, Argumente) zurück;
    }
  };
}

(4) Datentypbestimmung

export const getType = (Wert) => {
  wenn (Wert === null) {
    Rückgabewert + "";
  }
  // Bestimmen Sie, ob die Daten ein Referenztyp sind, if (typeof value === "object") {
    Lassen Sie valueClass = Object.prototype.toString.call(Wert),
      Typ = WertKlasse.split(" ")[1].split("");
    Typ.pop();
    Rückgabetyp.join("").toLowerCase();
  } anders {
    // Bestimmen Sie, ob es sich bei den Daten um einen Basisdatentyp oder einen Funktionsrückgabetyp des Werts handelt.
  }
}

(5) Objekt-Tiefkopie

exportiere const deepClone = (obj, hash = neue WeakMap() => {
  // Das Datumsobjekt gibt direkt ein neues Datumsobjekt zurück, wenn (obj instanceof Date){
   gib ein neues Datum (Objekt) zurück;
  } 
  //Das reguläre Objekt gibt direkt ein neues reguläres Objekt zurück, wenn (obj instanceof RegExp) {
   gib neuen RegExp(Objekt) zurück;     
  }
  //Wenn ein zirkulärer Verweis vorliegt, verwenden Sie weakMap, um ihn zu lösen, if (hash.has(obj)){
   gibt hash.get(obj) zurück;
  }
  // Beschreibung aller Eigenschaften des Objekts abrufen let allDesc = Object.getOwnPropertyDescriptors(obj);
  // Durchlaufe die Eigenschaften aller im Parameter übergebenen Schlüssel let cloneObj = Object.create(Object.getPrototypeOf(obj), allDesc)
  
  hash.set(Objekt, Klonobjekt)
  für (let key of Reflect.ownKeys(obj)) { 
    wenn(Typ von Objekt[Schlüssel] === 'Objekt' && Objekt[Schlüssel] !== null){
     cloneObj[Schlüssel] = deepClone(obj[Schlüssel], Hash);
    } anders {
     cloneObj[Schlüssel] = obj[Schlüssel];
    }
  }
  returniere Klonobjekt
}

Damit ist der Artikel über 56 praktische JavaScript-Toolfunktionen abgeschlossen, mit denen Sie die Entwicklungseffizienz verbessern können. Weitere Informationen zu 56 praktischen JavaScript-Toolfunktionen finden Sie in früheren Artikeln auf 123WORDPRESS.COM oder in den verwandten Artikeln weiter unten. Ich hoffe, dass jeder 123WORDPRESS.COM in Zukunft unterstützen wird!

Das könnte Sie auch interessieren:
  • Ein Beispiel für das elegante Schreiben von Urteilen in JavaScript
  • JavaScript implementiert eine verschiebbare Modalbox
  • JavaScript zum Implementieren eines Dropdown-Listenauswahlfelds
  • JavaScript zur einfachen Verknüpfung von Provinzen und Gemeinden
  • Details zur Verwendung der JS-Tag-Syntax

<<:  Docker mountet lokale Verzeichnisse und Datenvolumen-Container-Operationen

>>:  CSS- und HTML- und Front-End-Technologie-Schichtendiagramm

Artikel empfehlen

Detaillierte Erklärung der JSONObject-Verwendung

JSONObject ist lediglich eine Datenstruktur, die ...

So importieren Sie Tomcat-Quellcode in Idea

Inhaltsverzeichnis 1. Laden Sie den Tomcat-Code h...

Rendern im Vue-Scaffolding verstehen

Im Vue-Gerüst können wir sehen, dass im neuen Vue...

Der Unterschied zwischen Hash-Modus und Verlaufsmodus im Vue-Router

vue-router hat zwei Modi Hash-Modus Verlaufsmodus...

HTML-Tabellen-Tag-Tutorial (35): spaltenübergreifendes Attribut COLSPAN

In einer komplexen Tabellenstruktur erstrecken si...

Einführung in die Installationsmethode in Vue

Inhaltsverzeichnis 1. Weltweit registrierte Kompo...

Problem mit der V-HTML-Rendering-Komponente

Da ich bereits HTML analysiert habe, möchte ich h...

So führen Sie PostgreSQL mit Docker aus

1. Installieren Sie Docker. Referenz-URL: Docker-...

Erstellen von responsiven E-Mails mit Vue.js und MJML

MJML ist ein modernes E-Mail-Tool, mit dem Entwic...

Detaillierte Schritte zur Installation von Docker in 5 Minuten

Für die Installation von Docker auf CentOS muss d...

HTML implementiert die Funktion zur Erkennung der Eingabevervollständigung

Verwenden Sie „onInput(event)“, um festzustellen,...