1. Get the file extensionUsage scenario: Upload files to determine the suffix /** * Get the file extension * @param {String} filename */ export function getExt(filename) { if (typeof filename == 'string') { return filename .split('.') .pop() .toLowerCase() } else { throw new Error('filename must be a string type') } } How to use getExt("1.mp4") //->mp4 2. Copy content to clipboardexport function copyToBoard(value) { const element = document.createElement('textarea') document.body.appendChild(element) element.value = value element.select() if (document.execCommand('copy')) { document.execCommand('copy') document.body.removeChild(element) return true } document.body.removeChild(element) return false } Directions: // Return true if the copy was successful copyToBoard('lalallala') principle:
3. How many milliseconds to sleep/** * Sleep for xxxms * @param {Number} milliseconds */ export function sleep(ms) { return new Promise(resolve => setTimeout(resolve, ms)) } //Usage const fetchData=async()=>{ await sleep(1000) } 4. Generate a random string/** * Generate a random id * @param {*} length * @param {*} chars */ export function uuid(length, chars) { chars = chars || '0123456789abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ' length = length || 8 var result = '' for (var i = length; i > 0; --i) result += chars[Math.floor(Math.random() * chars.length)] return result } Directions: //The first parameter specifies the number of digits, and the second string specifies the characters. Both are optional parameters. If neither is passed, an 8-bit uuid is generated by default.() Usage scenario: used to generate random IDs on the front end. After all, both Vue and React now need to bind keys. 5. Simple deep copy/** *deep copy* @export * @param {*} obj * @returns */ export function deepCopy(obj) { if (typeof obj != 'object') { return obj } if (obj == null) { return obj } return JSON.parse(JSON.stringify(obj)) } Disadvantage: Only copies objects, arrays, and arrays of objects, which is sufficient for most scenarios const person={name:'xiaoming',child:{name:'Jack'}} deepCopy(person) //new person 6. Array deduplication/** * Array deduplication* @param {*} arr */ export function uniqueArray(arr) { if (!Array.isArray(arr)) { throw new Error('The first parameter must be an array') } if (arr.length == 1) { return arr } return [...new Set(arr)] } The principle is to use the property that no duplicate elements can appear in uniqueArray([1,1,1,1,1]) // [1] 7. Object converted to FormData object/** * Object converted to formdata * @param {Object} object */ export function getFormData(object) { const formData = new FormData() Object.keys(object).forEach(key => { const value = object[key] if (Array.isArray(value)) { value.forEach((subValue, i) => formData.append(key + `[${i}]`, subValue) ) } else { formData.append(key, object[key]) } }) return formData } Usage scenario: When uploading a file, we need to create a new Directions: let req={ file:xxx, userId:1, phone:'15198763636', //... } fetch(getFormData(req)) 8. Keep to n decimal places// How many decimal places to keep, the default is 2 export function cutNumber(number, no = 2) { if (typeof number != 'number') { number = Number(number) } return Number(number.toFixed(no)) } Usage scenario: Conclusion: This is the end of this article about essential You may also be interested in:
|
<<: Ubuntu starts the SSH service remote login operation
>>: MySQL 8.0.21 installation tutorial with pictures and text
Prerequisite: You need to compile the ngx_http_he...
This article shares the specific code of JS to ac...
1. Data flows from QT to JS 1. QT calls the JS fu...
This article mainly introduces the dynamic SQL st...
This article describes the sql_mode mode in MySQL...
There are two types: (different browsers) 1. Avail...
Table of contents 1 Question 2 Methods 3 Experime...
List of HTML tags mark type Name or meaning effec...
Anyone who has a little knowledge of data operati...
1. Change the virtual machine hardware version in...
Introduction to MQTT MQTT (Message Queuing Teleme...
Table of contents 1. The default focus is on the ...
Table of contents illustrate 1. Blob object 2. Fr...
The environment of this article is Windows 10, an...
SQL is the main trunk. Why do I understand it thi...