How to improve the Development Speed and efficiency of javascript

Today, I would like to share with you the relevant knowledge points about how javascript improves the speed and efficiency of development. The content is detailed and the logic is clear. I believe most people still know too much about this knowledge, so share this article for your reference. I hope you can get something after reading this article. Let's take a look.

1. Declare and initialize the array

We can initialize the array with a specific size, or we can initialize the contents of the array by specifying a value. You may use an array, but a two-dimensional array can do the same, as shown below:

Const array = Array (5). Fill ('') / output (5) [","] const matrix = Array (5) .fill (0). Map (() = > Array (5) .fill (0)) / / output (5) [Array (5), Array (5)] 0: (5) [0,0,0,0] 1: (5) [0,0,0,0) 0] 2: (5) [0,0,0,0,0] 3: (5) [0,0,0,0,0] 4: (5) [0,0,0,0,0] length: 5

2. Summation, minimum and maximum

We should use the reduce method to find the basic mathematical operations quickly.

Const array = [5, 4, 7, 8, 9, 2]

Summation

Array.reduce ((aformab) = > aforb); / / output: 35

Maximum value

Array.reduce ((a) b) = > a > b?a:b); / / output: 9

Minimum value

Array.reduce ((amerb) = > a murb); / / output (6) [1,5,10,25,40,100] array.sort ((amemb) = > bmura); / / output (6) [100,40,25,10,5,1]

Object array sorting

Const objectArr = [{first_name: 'Lazslo', last_name:' Jamf'}, {first_name: 'Pig', last_name:' Bodine'}, {first_name: 'Pirate', last_name:' Prentice'}]; objectArr.sort ((a, b) = > a.last_name.localeCompare (b.last_name)); / / output (3) [{... }, {... }, {... }] 0: {first_name: "Pig", last_name: "Bodine"} 1: {first_name: "Lazslo", last_name: "Jamf"} 2: {first_name: "Pirate", last_name: "Prentice"} length: 3

4. Filter to virtual values from the array

False values such as 0, undefined, null, false, "",''can be easily filtered out by the following techniques.

Const array = [3,0,6,7,', false]; array.filter (Boolean); / / output (3) [3,6,7]

5. Use logical operators to deal with situations that require conditional judgment

Function doSomething (arg1) {arg1 = arg1 | | 10; / / if arg1 has no value, take the default value 10} let foo = 10; foo = = 10 & & doSomething (); / / if foo equals 10, just execute doSomething (); / / output: 10foo = 5 | | doSomething (); / / is the same thing as if (foo! = 5) then doSomething (); / / Output: 10

6. Remove duplicate values

Const array = [5, item,idx,arr, 4, 7, 7]; array.filter ((item,idx,arr) = > arr.indexOf (item) = idx); / / orconst nonUnique = [... new Set (array)]; / / Output: [5, 5, 4, 7, 7, array, 8, 9, and 9]

7. Create a counter object or Map

In most cases, you can count the frequency of certain special words by creating an object or Map.

Let string = 'kapilalipak';const table= {}; for (let char of string) {table [char] = table [char] + 1 | | 1;} / / output {k: 2, a: 3, p: 2, I: 2, l: 2}

Or

Const countMap = new Map (); for (let I = 0; I

< string.length; i++) { if (countMap.has(string[i])) { countMap.set(string[i], countMap.get(string[i]) + 1); } else { countMap.set(string[i], 1); } }// 输出Map(5) {"k" =>

2, "a" = > 3, "p" = > 2, "I" = > 2, "l" = > 2}

8. Ternary operators are cool

Function Fever (temp) {return temp > 97? 'Visit documentation': temp

< 97 ? 'Go Out and Play!!' : temp === 97 ? 'Take Some Rest!': 'Go Out and Play!';;}// 输出Fever(97): "Take Some Rest!" Fever(100): "Visit Doctor!" 9、循环方法的比较 for 和 for..in 默认获取索引，但你可以使用arr[index]。 for..in也接受非数字，所以要避免使用。 forEach, for...of 直接得到元素。 forEach 也可以得到索引，但 for...of 不行。 10、合并两个对象 const user = { name: 'Kapil Raghuwanshi', gender: 'Male' };const college = { primary: 'Mani Primary School', secondary: 'Lass Secondary School' };const skills = { programming: 'Extreme', swimming: 'Average', sleeping: 'Pro' };const summary = {...user, ...college, ...skills};// 合并多个对象gender: "Male"name: "Kapil Raghuwanshi"primary: "Mani Primary School"programming: "Extreme"secondary: "Lass Secondary School"sleeping: "Pro"swimming: "Average" 11、箭头函数 箭头函数表达式是传统函数表达式的一种替代方式，但受到限制，不能在所有情况下使用。因为它们有词法作用域(父作用域)，并且没有自己的this和argument，因此它们引用定义它们的环境。 const person = {name: 'Kapil',sayName() { return this.name; }}person.sayName();// 输出"Kapil" 但是这样： const person = {name: 'Kapil',sayName : () =>

{return this.name;}} person.sayName (); / / Output "

12. Optional chain

Const user = {employee: {name: "Kapil"}}; user.employee?.name;// Output: "Kapil" user.employ?.name;// Output: undefineduser.employ.name// output: VM21616:1 Uncaught TypeError: Cannot read property 'name' of undefined

13. Shuffle an array

Take advantage of the built-in Math.random () method.

Const list = [1,2,3,4,5,6,7,8,9]; list.sort (() = > {return Math.random ()-0.5;}); / / output (9) [2, 5, 1, 6, 9, 8, 4, 3, 7] / output (9) [4, 1, 7, 5, 3, 8, 2, 9, 6]

14. Double question mark grammar

Const foo = null? 'my school';// output: "my school" const baz = 0? 42 const baz / output: 0

15. Remaining and unfolding syntax

Function myFun (a, b,... manyMoreArgs) {return arguments.length;} myFun ("one", "two", "three", "four", "five", "six"); / / output: 6

And

Const parts = ['shoulders',' knees']; const lyrics = ['head',... parts,' and', 'toes']; lyrics;// output: (5) ["head", "shoulders", "knees", "and", "toes"]

16. Default parameters

Const search = (arr, low=0,high=arr.length-1) = > {return high;} search; / / output: 4

17. Convert decimal to binary or hexadecimal

Const num = 10num.toString (2); / / output: "1010" num.toString (16); / / output: "a" num.toString (8); / / output: "12"

Use deconstruction to exchange two numbers

Let a = 5 Portlet b = 8; [aMaginb] = [brecoery a] [aforme b] / / output (2) [8,5]

19. Check the number of palindromes per line

Function checkPalindrome (str) {return str = = str.split ('') .reverse () .join ('');} checkPalindrome ('naman'); / / output: true

20. Convert the Object attribute to an array of attributes

Const obj = {a: 1, b: 2, c: 3}; Object.entries (obj); / / Output (3) [Array (2), Array (2), Array (2)] 0: (2) [a ", 1] 1: (2) [b", 2] 2: (2) [c ", 3] length: 3Object.keys (obj); (3) [" a "," b "," c "] Object.values (obj) (3) [1, 2, 3] above are all the contents of the article "how to improve the development speed and efficiency of javascript". Thank you for reading! I believe you will gain a lot after reading this article. The editor will update different knowledge for you every day. If you want to learn more knowledge, please pay attention to the industry information channel.