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

Zusammenfassung der MySQL-Datenmigration

Inhaltsverzeichnis Vorwort: 1. Über die Datenmigr...

Detaillierte Erklärung des Unterschieds zwischen MySQL null und nicht null und null und leerem Wert ''''

Ich glaube, dass vielen Leuten, die MySQL schon l...

Detaillierte Beispiele für die Ausführung von Zabbix-Remotebefehlen

Inhaltsverzeichnis eins. Umfeld zwei. Vorsichtsma...

Detaillierte Erläuterung der Verwendung des gcc-Befehls unter Linux

Inhaltsverzeichnis 1. Vorverarbeitung 2. Zusammen...

So melden Sie sich unter Shell schnell ohne Kennwort bei der MySQL-Datenbank an

Hintergrund Wenn wir uns über den MySQL-Client in...

Detaillierte Erklärung zur Verwendung von React.cloneElement

Inhaltsverzeichnis Die Rolle von cloneElement Anw...

Echarts implementiert das Umschalten verschiedener X-Achsen in einem Diagramm (Beispielcode)

Rendern Wenn Sie den im Bild unten gezeigten Effe...

Detailliertes Tutorial zur Installation von Nginx auf CentOS8 (Bild und Text)

Nginx, ausgesprochen „Engine x“, ist ein Open Sou...

Implementierung der Bereitstellung des Nginx+ModSecurity-Sicherheitsmoduls

Inhaltsverzeichnis 1. Herunterladen 2. Bereitstel...

Eine kurze Analyse von Kubernetes-Controllern und -Labels

Inhaltsverzeichnis 01 Gemeinsame Controller in k8...

js implementiert einen einfachen Rechner

Verwenden Sie natives JS, um einen einfachen Rech...

Beschreibung der Standardtransaktionsisolationsebene von MySQL und Oracle

1. Transaktionsmerkmale (ACID) (1) Atomarität. Di...

Kompatibilitätsprobleme mit CSS3-Farbverlaufshintergründen

Wenn wir eine Hintergrundfarbe mit Farbverlauf er...

So erstellen Sie einen MySQL-Master-Slave-Server auf CentOS7 (grafisches Tutorial)

Dieser Artikel stellt hauptsächlich vor, wie man ...

Detaillierte Erklärung der HTML-Tabellen-Tags (für Anfänger geeignet)

TABELLE> <TR> <TD> <TH> <...