大厂面试题分享 面试题库
前后端面试题库 （面试必备） 推荐：★★★★★
地址：前端面试题库
分享一些常用的JS方法
1、Copy URL地址
方式一
/** * @description 拷贝地址 * @param {string} url 地址 **/exportconstcopyUrl = (url, type = 1) => { if (type == 1) { navigator.clipboard .writeText(url) .then(() => { console.log("复制成功"); }) .catch(err => { console.log("复制失败", err); }); return; } };
方式二
/** * @description 拷贝地址 * @param {string} url 地址 **/exportconstcopyUrl = (url) => { let input = document.createElement("input"); input.value = url; document.body.appendChild(input); input.select(); document.execCommand("copy"); document.body.removeChild(input); };
2、处理文件大小展示
/** * @description 计算文件大小 * @param {number} fileSize 文件大小 * @return {string} 计算后的文件大小值 **/exportconstname = (fileSize = 0) => { if (!fileSize) returnnull; let size = 0, unit = ""; if (fileSize > 1073741824) { size = (fileSize / 1073741824).toFixed(4) * 1; unit = "GB"; } elseif (fileSize > 1048576) { size = (fileSize / 1048576).toFixed(4) * 1; unit = "MB"; } elseif (fileSize > 1024) { size = (fileSize / 1024).toFixed(4) * 1; unit = "KB"; } else { size = fileSize; unit = "B"; } return size + unit; };
3、获取音频/视频时长
/** * @description 获取音/视频时长 * @param {string/object} file 文件地址/对象 * @return {number} 媒体文件时长 **/exportconstgetMediaDuration = file => { returnnewPromise(resolve => { // 是否是文件对象 let hasFile = file instanceofFile; let fileUrl = hasFile ? URL.createObjectURL(file) : file; // 创建对象 let audioElement = newAudio(fileUrl); // 监听对象 audioElement.addEventListener("loadedmetadata", () => { let time = Math.floor(audioElement.duration) || 0; resolve(time); }); // 加载失败 audioElement.addEventListener("error", () => { resolve(0); }); }); };
4、下载文件
/** * @description 下载文件 * @param {string} fileUrl 文件链接地址 **/exportconstdownloadFile = fileUrl => { const iframe = document.createElement("iframe"); // 防止影响页面布局 iframe.style.display = "none"; iframe.style.height = 0; iframe.src = fileUrl; document.body.appendChild(iframe); // 加载完成后移除创建的标签 iframe.onload = function () { document.body.removeChild(iframe); }; };
5、对象数组去重
/** * @description 对象数组去重 * @param {Array} list 数组 * @param {String} key 唯一键 * @return {Array} 去重后的数组 **/exportconstarrayDeduplication = (list, key) => { return list.filter((item, index, self) => { return self.findIndex(el => el[key] === item[key]) === index; }); };
6、获取地址栏参数
方式一
/** * @description 获取地址栏参数 * @param {string} key 参数名 * @return {string} 参数值 **/exportconstqueryParams = key => { if (!key) returnnull; let url = newURL(location.href); let value = url.searchParams.get(key); return value; };
方式二
/** * @description 获取地址栏参数 * @param {String} key 要取值的参数 * @return {String} 获取的值 * */exportconstgetQueryString = name => { let reg = newRegExp("(^|&)" + name + "=([^&]*)(&|$)"); let r = window.location.search.substring(1).match(reg); if (r != null) returndecodeURI(r[2]); returnnull; };
7、params参数处理
/** * @description 参数处理 * @param {Object} params 参数 */exportconsttansParams = params => { let result = ""; for (const propName ofObject.keys(params)) { const value = params[propName]; var part = encodeURIComponent(propName) + "="; if (value !== null && value !== "" && typeof value !== "undefined") { if (typeof value === "object") { for (const key ofObject.keys(value)) { if (value[key] !== null && value[key] !== "" && typeof value[key] !== "undefined") { let params = propName + "[" + key + "]"; var subPart = encodeURIComponent(params) + "="; result += subPart + encodeURIComponent(value[key]) + "&"; } } } else { result += part + encodeURIComponent(value) + "&"; } } } return result; };
大厂面试题分享 面试题库
前后端面试题库 （面试必备） 推荐：★★★★★
地址：前端面试题库
