這篇文章主要講解了“怎么快速入門JavaScript”，文中的講解內(nèi)容簡(jiǎn)單清晰，易于學(xué)習(xí)與理解，下面請(qǐng)大家跟著小編的思路慢慢深入，一起來研究和學(xué)習(xí)“怎么快速入門JavaScript”吧！

創(chuàng)新互聯(lián)主營(yíng)花都網(wǎng)站建設(shè)的網(wǎng)絡(luò)公司,主營(yíng)網(wǎng)站建設(shè)方案,手機(jī)APP定制開發(fā),花都h5重慶小程序開發(fā)搭建,花都網(wǎng)站營(yíng)銷推廣歡迎花都等地區(qū)企業(yè)咨詢

arrayGcd

Calculates the greatest common denominator (gcd) of an array of numbers.

Use Array.reduce() and the gcd formula (uses recursion) to calculate the  greatest common denominator of an array of numbers.

const arrayGcd = arr =>{   const gcd = (x, y) => !y ? x : gcd(y, x % y);   return arr.reduce((a,b) => gcd(a,b)); } // arrayGcd([1,2,3,4,5]) -> 1 // arrayGcd([4,8,12]) -> 4

計(jì)算數(shù)組的***公約數(shù)。

使用 Array.reduce() 和 gcd 公式(使用遞歸)來計(jì)算一個(gè)數(shù)組的***公約數(shù)。

?  code cat arrayGcd.js const arrayGcd = arr => {     const gcd = (x, y) => !y ? x : gcd(y, x % y);     return arr.reduce((a, b) => gcd(a, b)); }  console.log(arrayGcd([1, 2, 3, 4, 5])); console.log(arrayGcd([4, 8, 12])); ?  code node arrayGcd.js 1 4

gcd 即歐幾里德算法，具體不表，自查。這里用到了數(shù)組的reduce方法，相當(dāng)簡(jiǎn)潔，reduce不太了解的話，看下 mdn 就明白。

arrayLcm

Calculates the lowest common multiple (lcm) of an array of numbers.

Use Array.reduce() and the lcm formula (uses recursion) to calculate the  lowest common multiple of an array of numbers.

const arrayLcm = arr =>{  const gcd = (x, y) => !y ? x : gcd(y, x % y);  const lcm = (x, y) => (x*y)/gcd(x, y)   return arr.reduce((a,b) => lcm(a,b)); } // arrayLcm([1,2,3,4,5]) -> 60 // arrayLcm([4,8,12]) -> 24

計(jì)算一個(gè)數(shù)組的最小公倍數(shù)。

使用 Array.reduce() 和 lcm 公式(使用遞歸)來計(jì)算一個(gè)數(shù)組的***公約數(shù)。

?  code cat arrayLcm.js const arrayLcm = arr => {   const gcd = (x, y) => (!y ? x : gcd(y, x % y));   const lcm = (x, y) => x * y / gcd(x, y);   return arr.reduce((a, b) => lcm(a, b)); };  console.log(arrayLcm([1, 2, 3, 4, 5])); console.log(arrayLcm([4, 8, 12])); ?  code node arrayLcm.js 60 24

lcm 算法用到了前面的 gcd 算法，關(guān)鍵點(diǎn)是兩個(gè)數(shù)的***公約數(shù)和最小公倍數(shù)的乘積正好就是這兩個(gè)數(shù)的乘積。

arrayMax

Returns the maximum value in an array.

Use Math.max() combined with the spread operator ( ... ) to get the maximum  value in the array.

const arrayMax = arr => Math.max(...arr); // arrayMax([10, 1, 5]) -> 10

返回?cái)?shù)組中***的值。

使用 Math.max() 和 ES6 的擴(kuò)展運(yùn)算符 … 返回?cái)?shù)組中***的值。

?  code cat arrayMax.js const arrayMax = arr => Math.max(...arr);  console.log(arrayMax([10, 1, 5])); ?  code node arrayMax.js 10

實(shí)際上就是 Math.max() 干的事，沒啥可說的了。

arrayMin

Returns the minimum value in an array.

Use Math.min() combined with the spread operator ( ... ) to get the minimum  value in the array.

const arrayMin = arr => Math.min(...arr); // arrayMin([10, 1, 5]) -> 1

返回?cái)?shù)組中最小的值。

使用 Math.min() 和 ES6 的擴(kuò)展運(yùn)算符 … 返回?cái)?shù)組中最小的值。

?  code cat arrayMin.js const arrayMin = arr => Math.min(...arr);  console.log(arrayMin([10, 1, 5])); ?  code node arrayMin.js 1

實(shí)際上就是 Math.min() 干的事，沒啥可說的了。

chunk

Chunks an array into smaller arrays of a specified size.

Use Array.from() to create a new array, that fits the number of chunks that  will be produced. Use Array.slice() to map each element of the new array to a  chunk the length of size . If the original array can't be split evenly, the  final chunk will contain the remaining elements.

const chunk = (arr, size) =>  Array.from({length: Math.ceil(arr.length / size)}, (v, i) => arr.slice(i * size, i * size + size)); // chunk([1,2,3,4,5], 2) -> [[1,2],[3,4],[5]]

按照給定的 size 將一個(gè)數(shù)組切分成含有 size 個(gè)數(shù)的更小數(shù)組塊的數(shù)組。

使用 Array.from() 生產(chǎn)新的符合定義的數(shù)組。使用 Array.slice() 來截取指定 size 個(gè)元素組成新的數(shù)組塊。如果原數(shù)組長(zhǎng)度不能被  size 整除，***的剩余的那些元素將歸屬于***一個(gè)塊。

?  code cat chunk.js const chunk = (arr, size) =>   Array.from({ length: Math.ceil(arr.length / size) }, (v, i) =>     arr.slice(i * size, i * size + size)   );  console.log(chunk([1, 2, 3, 4, 5], 2)); ?  code node chunk.js [ [ 1, 2 ], [ 3, 4 ], [ 5 ] ]

Array.from(arrayLike, mapFn, thisArg)  這個(gè)方法呢，***個(gè)參數(shù)是一個(gè)類數(shù)組或者可迭代的對(duì)象，第二個(gè)參數(shù)是一個(gè)應(yīng)用在每一個(gè)數(shù)組元素上的方法，第三個(gè)參數(shù)就是改變 this  的指向了。通俗說就是指定誰是你的爸爸。

這里用了一個(gè) { length: Math.ceil(arr.length / size) } 迭代對(duì)象， length 指定了迭代次數(shù)，即按照 size  分塊后的數(shù)組長(zhǎng)度，正好就是原數(shù)組長(zhǎng)度除以 size  向上取整的值。向上取整就是為了滿足不能完全整除的情況。比如5個(gè)元素按照2個(gè)一組進(jìn)行分塊，分了兩組兩個(gè)元素的，剩***一個(gè)元素成了獨(dú)立組，總長(zhǎng)為3。

(v, i) ，由于迭代的時(shí)候數(shù)組在每一個(gè)位置上都是以 undefined 初始化的，所以 v 一直都是 undefined 。

arr.slice(i * size, i * size + size) 迭代過程中每次截取 size 個(gè)數(shù)的元素組成新數(shù)組。這里的 i  就是隨著迭代變化，比如 length 是3， i 就是0，1，2。

這里的迭代類似 python 里的 range 。

?  code python Python 3.6.4 (default, Dec 23 2017, 10:37:40) [GCC 4.2.1 Compatible Apple LLVM 9.0.0 (clang-900.0.39.2)] on darwin Type "help", "copyright", "credits" or "license" for more information. >>> import math >>> arr = [1,2,3,4,5] >>> size = 2 >>> for i in range(math.ceil(len(arr) / size)): ...     print('index: ', i) ... index:  0 index:  1 index:  2

compact

Removes falsey values from an array.

Use Array.filter() to filter out falsey values ( false , null , 0 , "" ,  undefined , and NaN ).

const compact = arr => arr.filter(Boolean); // compact([0, 1, false, 2, '', 3, 'a', 'e'*23, NaN, 's', 34]) -> [ 1, 2, 3,

移除掉數(shù)組里 falsey 的元素。(這個(gè) falsey 不太好翻譯，不是錯(cuò)誤的意思，而是該值布爾運(yùn)算值為 false 的意思，我個(gè)人常用 !!  進(jìn)行判斷)。

使用 Array.filter() 把 false 、 null 、 0 、 "" 、 undefined 和 NaN 這些 falsey  過濾掉。

?  code cat compact.js const compact = arr => arr.filter(Boolean);  console.log(compact([0, 1, false, 2, "", 3, "a", "e" * 23, NaN, "s", 34])); ?  code node compact.js [ 1, 2, 3, 'a', 's', 34 ]

Array.prototype.filter() 干的，沒啥好說。

countOccurrences

Counts the occurrences of a value in an array.

Use Array.reduce() to increment a counter each time you encounter the  specific value inside the array.

const countOccurrences = (arr, value) => arr.reduce((a, v) => v === value ? a + 1 : a + 0, 0); // countOccurrences([1,1,2,1,2,3], 1) -> 3

統(tǒng)計(jì)一個(gè)元素在一個(gè)數(shù)組中出現(xiàn)的次數(shù)。

使用 Array.reduce() 在遍歷過程中如果指定元素在數(shù)組中出現(xiàn)，則增加它的次數(shù)值，默認(rèn)次數(shù)為0。

?  code cat countOccurrences.js const countOccurrences = (arr, value) =>   arr.reduce((a, v) => (v === value ? a + 1 : a + 0), 0);  console.log(countOccurrences([1, 1, 2, 1, 2, 3], 1)); console.log(countOccurrences([1, 1, 2, 1, 2, 3], 5)); ?  code node countOccurrences.js 3 0

三元運(yùn)算符 (v === value ? a + 1 : a + 0) 遍歷過程中判斷遍歷數(shù)組值 v 是否嚴(yán)格等于指定值 value ，是，次數(shù) a+1  ;否， a+0 。

***的一個(gè)逗號(hào)后面的0，是這個(gè)初始值，即 a=0 ，這個(gè)懂 reduce  方法都知道，特別指出是，因?yàn)檫@個(gè)函數(shù)一定會(huì)有返回值，如果指定元素沒有在數(shù)組中出現(xiàn)一次，返回值是 0 ，所以必須得初始化為 0 。

deepFlatten

Deep flattens an array.

Use recursion. Use Array.concat() with an empty array ( [] ) and the spread  operator ( ... ) to flatten an array. Recursively flatten each element that is  an array.

const deepFlatten = arr => [].concat(...arr.map(v => Array.isArray(v) ? deepFlatten(v) : v)); // deepFlatten([1,[2],[[3],4],5]) -> [1,2,3,4,5]

深度攤平一個(gè)數(shù)組。

使用遞歸方法。結(jié)合 Array.concat() 、空數(shù)組 [] 和 ES6 的擴(kuò)展運(yùn)算符 …  來攤平一個(gè)數(shù)組，如果攤平的元素還是一個(gè)數(shù)組，就再遞歸運(yùn)用該方法。

?  code cat deepFlatten.js const deepFlatten = arr =>   [].concat(...arr.map(v => (Array.isArray(v) ? deepFlatten(v) : v)));  console.log(deepFlatten([1, [2], [[3], 4], 5])); ?  code node deepFlatten.js [ 1, 2, 3, 4, 5 ]

三元運(yùn)算符 (Array.isArray(v) ? deepFlatten(v) : v) 判斷 v 是否是一個(gè)數(shù)組，是，返回遞歸運(yùn)用  deepFlatten(v) 后的值;否，直接返回 v 。

[].concat(...arr.map(fn)) 用空數(shù)組把 map 運(yùn)算產(chǎn)生的數(shù)組進(jìn)行 … 擴(kuò)展運(yùn)算值拼接成結(jié)果數(shù)組返回。

該方法是深度攤平方法，在很多時(shí)候還有特定的攤平一層的需求， underscore 就有。實(shí)現(xiàn)的方法就是再加一個(gè)標(biāo)志參數(shù)進(jìn)行處理即可。具體不講了。

感謝各位的閱讀，以上就是“怎么快速入門JavaScript”的內(nèi)容了，經(jīng)過本文的學(xué)習(xí)后，相信大家對(duì)怎么快速入門JavaScript這一問題有了更深刻的體會(huì)，具體使用情況還需要大家實(shí)踐驗(yàn)證。這里是創(chuàng)新互聯(lián)，小編將為大家推送更多相關(guān)知識(shí)點(diǎn)的文章，歡迎關(guān)注！