開発効率の向上に役立つ 56 個の実用的な JavaScript ツール関数

エクスポートconstフォーマット = (n) => {
    num = n.toString() とします。
    len = num.length;とします。
    長さ<= 3の場合{
        数値を返します。
    } それ以外 {
        temp = '' とします。
        残りを len % 3 とします。
        if (remainder > 0) { // 3 の整数倍ではない return num.slice(0, remainder) + ',' + num.slice(remainder, len).match(/\d{3}/g).join(',') + temp;
        } else { // 3 の整数倍 return num.slice(0, len).match(/\d{3}/g).join(',') + temp; 
        }
    }
}

エクスポートconst arrScrambling = (arr) => {
    (i = 0 とします; i < arr.length; i++) {
      const randomIndex = Math.round(Math.random() * (arr.length - 1 - i)) + i;
      [arr[i], arr[ランダムインデックス]] = [arr[ランダムインデックス], arr[i]];
    }
    arr を返します。
}

エクスポートconstflatten = (arr) => {
  結果 = [] とします。

  for(let i = 0; i < arr.length; i++) {
    Array.isArray(arr[i]) の場合
      結果 = result.concat(flatten(arr[i]));
    } それ以外 {
      結果をpush(arr[i]);
    }
  }
  結果を返します。
}

エクスポート const sample = arr => arr[Math.floor(Math.random() * arr.length)];
 

エクスポートconst randomString = (len) => {
    文字を 'ABCDEFGHJKMNPQRSTWXYZabcdefhijkmnprstwxyz123456789' とします。
    strLen = chars.lengthとします。
    randomStr = '' とします。
    (i = 0; i < len; i++) の場合 {
        randomStr += chars.charAt(Math.floor(Math.random() * strLen));
    }
    randomStr を返します。
};

エクスポートconst fistLetterUpper = (str) => {
    str.charAt(0).toUpperCase() + str.slice(1); を返します。
};

エクスポートconst telFormat = (tel) => {
   tel = 文字列(tel); 
    tel.substr(0,3) + "****" + tel.substr(7)を返します。
};

エクスポートconst getKebabCase = (str) => {
    str.replace(/[AZ]/g, (item) => '-' + item.toLowerCase()) を返します
}

エクスポートconst getCamelCase = (str) => {
    str.replace( /-([az])/g, (i, item) => item.toUpperCase()) を返します
}

エクスポートconst toCDB = (str) => {
  結果 = "" とします。
  (i = 0 とします; i < str.length; i++) {
    コード = str.charCodeAt(i);
    コード >= 65281 && コード <= 65374 の場合 {
      結果 += String.fromCharCode(str.charCodeAt(i) - 65248);
    } そうでない場合 (コード == 12288) {
      結果 += String.fromCharCode(str.charCodeAt(i) - 12288 + 32);
    } それ以外 {
      結果 += str.charAt(i);
    }
  }
  結果を返します。
}

エクスポートconst toDBC = (str) => {
  結果 = "" とします。
  (i = 0 とします; i < str.length; i++) {
    コード = str.charCodeAt(i);
    コード >= 33 && コード <= 126 の場合 {
      結果 += String.fromCharCode(str.charCodeAt(i) + 65248);
    } そうでない場合 (コード == 32) {
      結果 += String.fromCharCode(str.charCodeAt(i) + 12288 - 32);
    } それ以外 {
      結果 += str.charAt(i);
    }
  }
  結果を返します。
}

エクスポートconst digitUppercase = (n) => {
    const fraction = ['角度', '分'];
    定数数字 = [
        「ゼロ」、「1」、「2」、「3」、「4」、
        「5」、「6」、「7」、「8」、「9」
    ];
    定数ユニット = [
        ['元', '10,000', '1億'],
        ['', '拾', '佰', '千']
    ];
    n = Math.abs(n);
    s = '' とします。
    (i = 0 とします; i < fraction.length; i++) {
        s += (digit[Math.floor(n * 10 * Math.pow(10, i)) % 10] + fraction[i]).replace(/零./, '');
    }
    s = s || '全体';
    n = Math.floor(n);
    (i = 0 とします; i < unit[0].length && n > 0; i++) {
        p = '' とします。
        (j = 0; j < unit[1].length && n > 0; j++) の場合 {
            p = 数字[n % 10] + 単位[1][j] + p;
            n = Math.floor(n / 10);
        }
        s = p.replace(/(零.)*零$/, '').replace(/^$/, '零') + unit[0][i] + s;
    }
    s.replace(/(零.)*零元/, '元') を返します
        .replace(/(零.)+/g, '零')
        .replace(/^whole$/, 'ゼロ元全体');
};

エクスポート const intToChinese = (値) => {
 const str = 文字列(値);
 定数len = str.length-1;
 const idxs = ['','十','一百','千','十万','十','一百','千','亿','十','一百','千','十万','十','百','千','亿'];
 const num = ['0','1','2','3','4','5','6','7','8','9'];
 str.replace(/([1-9]|0+)/g, ( $, $1, idx, full) を返す => {
    pos = 0 とします。
    $1[0] !== '0' の場合{
      pos = 長さ-idx;
      if(idx == 0 && $1[0] == 1 && idxs[len-idx] == '十'){
        idxs[len-idx]を返します。
      }
      num[$1[0]] + idxs[len-idx]を返します。
    } それ以外 {
      left = len - idx とします。
      right = len - idx + $1.length とします。
      (Math.floor(右 / 4) - Math.floor(左 / 4) > 0) の場合 {
        pos = 左 - 左 % 4;
      }
      if(pos){
        idxs[pos] + num[$1[0]]を返します。
      } そうでない場合(idx + $1.length >= len){
        戻る '';
      }それ以外 {
        num[$1[0]]を返す
      }
    }
   });
}

エクスポートconst localStorageSet = (キー、値) => {
    if (!key) 戻り値:
    if (typeof value !== 'string') {
        値 = JSON.stringify(値);
    }
    window.localStorage.setItem(キー、値);
};

エクスポートconst localStorageGet = (キー) => {
    if (!key) 戻り値:
    window.localStorage.getItem(キー) を返します。
};

エクスポートconst localStorageRemove = (キー) => {
    if (!key) 戻り値;
    window.localStorage.removeItem(キー);
};

エクスポートconst sessionStorageSet = (キー、値) => {
   if (!key) 戻り値;
    if (typeof value !== 'string') {
      値 = JSON.stringify(値);
    }
    window.sessionStorage.setItem(キー、値)
};

エクスポートconst sessionStorageGet = (キー) => {
   if (!key) 戻り値;
    window.sessionStorage.getItem(キー) を返します。
};

エクスポートconst sessionStorageRemove = (キー) => {
   if (!key) 戻り値;
    window.sessionStorage.removeItem(キー)
};

エクスポートconst setCookie = (キー、値、有効期限) => {
    定数d = 新しいDate();
    d.setDate(d.getDate() + 有効期限)
    document.cookie = `${key}=${value};expires=${d.toUTCString()}`
};

エクスポートconst getCookie = (キー) => {
    クッキーをエスケープ解除します。
       クッキーを分割します。
       cookieValue を '' とします。
       (i = 0 とします; i < arr.length; i++) {
           定数temp = arr[i].split('=');
           if (temp[0] === キー) {
               クッキー値 = temp[1];
               壊す
       }
    }
    cookieValueを返す
};

エクスポートconst delCookie = (キー) => {
    document.cookie = `${encodeURIComponent(key)}=;expires=${new Date()}`
};

エクスポート const checkCardNo = (値) => {
    reg = /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/ とします。
    reg.test(値)を返します。
};

エクスポート const haveCNChars => (値) => {
    /[\u4e00-\u9fa5]/.test(値)を返します。
}

エクスポート const isPostCode = (値) => {
    /^[1-9][0-9]{5}$/.test(value.toString()); を返します。
}

エクスポートconst isIPv6 = (str) => {
    ブール値を返します(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));
}

エクスポートconst isEmail = (値) {
    /^[a-zA-Z0-9_-]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$/.test(値) を返します。
}

エクスポートconst isTel = (値) => {
    /^1[3,4,5,6,7,8,9][0-9]{9}$/.test(value.toString()); を返します。
}

エクスポート const isEmojiCharacter = (値) => {
   値 = 文字列(値);
    (i = 0 とします; i < value.length; i++) {
        定数 hs = value.charCodeAt(i);
        0xd800 <= hs && hs <= 0xdbffの場合{
            （値の長さ＞1）の場合{
                定数ls = value.charCodeAt(i + 1);
                定数uc = ((hs - 0xd800) * 0x400) + (ls - 0xdc00) + 0x10000;
                （0x1d000 <= uc && uc <= 0x1f77f）の場合{
                    true を返します。
                }
            }
        } それ以外の場合 (値の長さ > 1) {
            定数ls = value.charCodeAt(i + 1);
            （ls == 0x20e3）の場合{
                true を返します。
            }
        } それ以外 {
            （0x2100 <= hs && hs <= 0x27ff）の場合{
                true を返します。
            } そうでない場合 (0x2B05 <= hs && hs <= 0x2b07) {
                true を返します。
            } そうでない場合 (0x2934 <= hs && hs <= 0x2935) {
                true を返します。
            } そうでない場合 (0x3297 <= hs && hs <= 0x3299) {
                true を返します。
            } そうでない場合 (hs == 0xa9 || hs == 0xae || hs == 0x303d || hs == 0x3030
                    || hs == 0x2b55 || hs == 0x2b1c || hs == 0x2b1b
                    || hs == 0x2b50) {
                true を返します。
            }
        }
    }
   false を返します。
}

エクスポートconst GetRequest = () => {
    url = location.search; とします。
    const paramsStr = /.+\?(.+)$/.exec(url)[1]; // ? の後の文字列を取得します。const paramsArr = paramsStr.split('&'); // 文字列を & で分割し、配列に格納します。let paramsObj = {};
    // オブジェクトにパラメータを保存します paramsArr.forEach(param => {
      if (/=/.test(param)) { // 値を持つパラメータを処理する let [key, val] = param.split('='); // キーと値を分割する
        val = decodeURIComponent(val); // Decodeval = /^\d+$/.test(val) ? parseFloat(val) : val; // 数値に変換されるかどうかを判断しますif (paramsObj.hasOwnProperty(key)) { // オブジェクトにキーがある場合は、値を追加しますparamsObj[key] = [].concat(paramsObj[key], val);
        } else { // オブジェクトにこのキーがない場合は、キーを作成して値を設定します。 paramsObj[key] = val;
        }
      } else { // 値のないパラメータを処理する paramsObj[param] = true;
      }
    })
    paramsObj を返します。
};

エクスポートconst getUrlState = (URL) => {
  xmlhttp を新しい ActiveXObject("microsoft.xmlhttp") にします。
  xmlhttp.Open("GET", URL, false);
  試す {
    xmlhttp.Send();
  } キャッチ (e) {
  ついに
    結果を xmlhttp.responseText とします。
    if (結果) {
      xmlhttp.Status == 200 の場合 {
        true を返します。
      } それ以外 {
        false を返します。
      }
    } それ以外 {
      false を返します。
    }
  }
}

エクスポートconst params2Url = (obj) => {
     パラメータ = [] とする
     for (let key in obj) {
       パラメータをプッシュします(`${key}=${obj[key]}`);
     }
     encodeURIComponent(params.join('&')) を返します
}

エクスポート const replaceParamVal => (paramName, replaceWith) {
   const oUrl = location.href.toString();
   const re = eval('/('+ paramName+'=)([^&]*)/gi');
   location.href = oUrl.replace(re,paramName+'='+replaceWith);
   location.href を返します。
}

エクスポートconst funcUrlDel = (名前) => {
  const baseUrl = location.origin + location.pathname + "?";
  定数クエリ = location.search.substr(1);
  クエリのインデックスが名前よりも-1の場合
    定数obj = {};
    クエリを分割します。
    (i = 0 とします; i < arr.length; i++) {
      arr[i] = arr[i].split("=");
      obj[arr[i][0]] = arr[i][1];
    }
    obj[名前]を削除します。
    baseUrl + JSON.stringify(obj).replace(/[\"\{\}]/g,"").replace(/\:/g,"=").replace(/\,/g,"&"); を返します。
  }
}

エクスポートconst isMobile = () => {
  if ((navigator.userAgent.match(/(iPhone|iPod|Android|ios|iOS|iPad|Backerry|WebOS|Symbian|Windows Phone|Phone)/i))) {
  'モバイル' を返します。
  }
  'デスクトップ' を返します。
}

エクスポートconst isAppleMobileDevice = () => {
  reg = /iphone|ipod|ipad|Macintosh/i とします。
  reg.test(navigator.userAgent.toLowerCase()) を返します。
}

エクスポートconst isAndroidMobileDevice = () => {
  /android/i.test(navigator.userAgent.toLowerCase()) を返します。
}

エクスポートconst osType = () => {
    定数エージェント = 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;
    if (isWindows) {
        「windows」を返します。
    }
    if(isMac){
        「mac」を返します。
    }
}

エクスポートconstブラウザ=（）=> {
    定数 ua = navigator.userAgent.toLowerCase();
    if (ua.match(/MicroMessenger/i) == "マイクロメッセンジャー") {
        「weixin」を返します。
    } そうでない場合 (ua.match(/QQ/i) == "qq") {
        「QQ」を返します。
    }
    false を返します。
}

エクスポートconst getExplorerInfo = () => {
    t = navigator.userAgent.toLowerCase() とします。
    0 <= t.indexOf("msie") を返す? { //ie < 11
        タイプ: "IE",
        バージョン: Number(t.match(/msie ([\d]+)/)[1])
    } : !!t.match(/trident\/.+?rv:(([\d.]+))/) ? { // つまり 11
        タイプ: "IE",
        バージョン: 11
    } : 0 <= t.indexOf("edge") ? {
        タイプ:「エッジ」、
        バージョン: Number(t.match(/edge\/([\d]+)/)[1])
    } : 0 <= t.indexOf("firefox") ? {
        タイプ: "Firefox",
        バージョン: Number(t.match(/firefox\/([\d]+)/)[1])
    } : 0 <= t.indexOf("chrome") ? {
        タイプ: "Chrome",
        バージョン: Number(t.match(/chrome\/([\d]+)/)[1])
    } : 0 <= t.indexOf("opera") ? {
        タイプ:「オペラ」、
        バージョン: Number(t.match(/opera.([\d]+)/)[1])
    } : 0 <= t.indexOf("Safari") ? {
        タイプ:「Safari」、
        バージョン: Number(t.match(/version\/([\d]+)/)[1])
    } : {
        タイプ: t,
        バージョン: -1
    }
}

エクスポートconst scrollToTop = () => {
  定数高さ = document.documentElement.scrollTop || document.body.scrollTop;
  高さ > 0 の場合 {
    ウィンドウのアニメーションフレームを要求します(上へスクロールします)。
    window.scrollTo(0, 高さ - 高さ / 8);
  }
}

エクスポートconst scrollToBottom = () => {
  window.scrollTo(0, document.documentElement.clientHeight);  
}

エクスポートconst SmoothScroll = (要素) => {
    document.querySelector(要素).scrollIntoView({
        動作: 'スムーズ'
    });
};

エクスポートconst getClientHeight = () => {
    clientHeight を 0 にします。
    document.body.clientHeight と document.documentElement.clientHeight のどちらが高いかがわかります。
        clientHeight = (document.body.clientHeight < document.documentElement.clientHeight) ? document.body.clientHeight : document.documentElement.clientHeight;
    }
    それ以外 {
        clientHeight は document.body.clientHeight よりも document.documentElement.clientHeight の方が大きいです。
    }
    clientHeight を返します。
}

エクスポートconst getPageViewWidth = () => {
    戻り値 (document.compatMode == "BackCompat" ? document.body : document.documentElement).clientWidth;
}

エクスポートconst toFullScreen = () => {
    要素を document.body とします。
    if (element.requestFullscreen) {
      要素.requestFullscreen()
    } そうでない場合 (element.mozRequestFullScreen) {
      要素.mozRequestFullScreen()
    } そうでない場合 (element.msRequestFullscreen) {
      要素.msRequestFullscreen()
    } そうでない場合 (element.webkitRequestFullscreen) {
      要素.webkitRequestFullScreen()
    }
}

エクスポートconst exitFullscreen = () => {
    ドキュメントがフルスクリーンから抜ける場合
      ドキュメント.exitFullscreen()
    } そうでない場合 (document.msExitFullscreen) {
      document.msExitFullscreen()
    } そうでない場合 (document.mozCancelFullScreen) {
      document.mozCancelFullScreen()
    } そうでない場合 (document.webkitExitFullscreen) {
      document.webkitExitFullscreen()
    }
}

エクスポートconstnowTime = () => {
    const now = 新しい Date();
    年 = now.getFullYear();
    月 = now.getMonth();
    定数 date = now.getDate() >= 10 ? now.getDate() : ('0' + now.getDate());
    定数 hour = now.getHours() >= 10 ? now.getHours() : ('0' + now.getHours());
    const miu = now.getMinutes() >= 10 ? now.getMinutes() : ('0' + now.getMinutes());
    定数 sec = now.getSeconds() >= 10 ? now.getSeconds() : ('0' + now.getSeconds());
    +year + "年" + (月 + 1) + "月" + 日 + "日" + 時間 + ":" + miu + ":" + 秒を返します。
}

エクスポート const dateFormater = (formater, time) => {
    date = time ? new Date(time) : new Date(), とします。
        Y = date.getFullYear() + ''、
        M = date.getMonth() + 1、
        D = date.getDate(),
        H = date.getHours(),
        m = date.getMinutes(),
        s = date.getSeconds();
    戻り値 formater.replace(/YYYY|yyyy/g, Y)
        .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)
}
// 日付フォーマッター('YYYY-MM-DD HH:mm:ss')
// 日付フォーマッター('YYYYMMDDHHmmss')

エクスポートconst stopPropagation = (e) => { 
    e = e || ウィンドウイベント; 
    if(e.stopPropagation) { // W3C はバブリングを防止します method e.stopPropagation(); 
    } それ以外 { 
        e.cancelBubble = true; // IE はバブリング メソッドを防止します} 
} 

エクスポートconst debounce = (fn, wait) => {
  タイマーを null にします。

  関数()を返す{
    コンテキスト = this とします。
        args = 引数;

    if (タイマー) {
      タイマーをクリアします。
      タイマー = null;
    }

    タイマー = setTimeout(() => {
      fn.apply(コンテキスト、引数);
    }、 待って）;
  };
}

エクスポートconstスロットル=（fn、遅延）=> {
  curTime = Date.now() とします。

  関数()を返す{
    コンテキスト = this とします。
        args = 引数、
        nowTime = Date.now();

    (nowTime - curTime >= delay) の場合 {
      現在の日付と時刻。
      fn.apply(context, args) を返します。
    }
  };
}

エクスポートconst getType = (値) => {
  （値 === null）の場合{
    戻り値 + "";
  }
  // データが参照型かどうかを判定します if (typeof value === "object") {
    valueClass = Object.prototype.toString.call(value) とします。
      type = valueClass.split(" ")[1].split("");
    タイプ.pop();
    type.join("").toLowerCase() を返します。
  } それ以外 {
    // データが基本データ型か関数戻り値かを判断します。typeof value;
  }
}

エクスポートconst deepClone = (obj、hash = new WeakMap() => {
  // 日付オブジェクトは直接新しい日付オブジェクトを返します if (obj instanceof Date){
   新しいDate(obj)を返します。
  } 
  //通常のオブジェクトは直接新しい通常のオブジェクトを返します if (obj instanceof RegExp) {
   新しい RegExp(obj) を返します。     
  }
  //循環参照がある場合はweakMapを使って解決します if (hash.has(obj)){
   hash.get(obj) を返します。
  }
  // オブジェクト自身のすべてのプロパティの説明を取得します。let allDesc = Object.getOwnPropertyDescriptors(obj);
  // パラメータに渡されたすべてのキーのプロパティを走査します。let cloneObj = Object.create(Object.getPrototypeOf(obj), allDesc)
  
  ハッシュを設定します(obj、クローンObj)
  Reflect.ownKeys(obj) のキーを取得します。 
    if(typeof obj[key] === 'object' && obj[key] !== null){
     cloneObj[キー] = deepClone(obj[キー]、ハッシュ);
    } それ以外 {
     cloneObj[キー] = obj[キー];
    }
  }
  cloneObjを返す
}