真实的国产乱ⅩXXX66竹夫人,五月香六月婷婷激情综合,亚洲日本VA一区二区三区,亚洲精品一区二区三区麻豆

成都創(chuàng)新互聯(lián)網(wǎng)站制作重慶分公司

【筆記】【JavaScript】JSchallenger-Arrays對象-練習筆記

前言

【筆記內(nèi)容】

創(chuàng)新互聯(lián)建站是一家集網(wǎng)站建設(shè),蓮湖企業(yè)網(wǎng)站建設(shè),蓮湖品牌網(wǎng)站建設(shè),網(wǎng)站定制,蓮湖網(wǎng)站建設(shè)報價,網(wǎng)絡(luò)營銷,網(wǎng)絡(luò)優(yōu)化,蓮湖網(wǎng)站推廣為一體的創(chuàng)新建站企業(yè),幫助傳統(tǒng)企業(yè)提升企業(yè)形象加強企業(yè)競爭力??沙浞譂M足這一群體相比中小企業(yè)更為豐富、高端、多元的互聯(lián)網(wǎng)需求。同時我們時刻保持專業(yè)、時尚、前沿,時刻以成就客戶成長自我,堅持不斷學習、思考、沉淀、凈化自己,讓我們?yōu)楦嗟钠髽I(yè)打造出實用型網(wǎng)站。

  • 關(guān)于JSchallenger中Arrays對象題目的復盤
  • 本人的提交、以及做題時的思路
  • 分析作者答案
  • 涉及的知識快速了解,注意:并不深入分析具體知識,只是圍繞題目展開

【筆記目的】

  • 幫助本人進一步了解Javascript的Arrays對象以及涉及的方法
  • 對自己做題后的復盤,進一步了解自己的不足之處

【相關(guān)資源】

  • JSchallenger

溫馨提示

  • 筆記中有些個人理解后整理的筆記,可能有所偏差,也懇請讀者幫忙指出,謝謝。
  • 若是有其他的解題方法也請讀者分享到評論區(qū),一起學習,共同進步,謝謝。
  • 我的提交有不足之處也懇請讀者幫忙指出,不吝賜教,謝謝。


Array對象快速了解

  • 用于構(gòu)造數(shù)組的全局對象
  • JavaScript 數(shù)組的長度和元素類型都是非固定的。
  • 只能用整數(shù)作為數(shù)組元素的索引,而不能用字符串。

PS什么是數(shù)組?

  • 類似于列表的高階對象。

常見操作

方法 描述
let arr=[數(shù)組元素1,...,數(shù)組元素n] 創(chuàng)建數(shù)組
let el=arr[索引] 通過索引訪問數(shù)組元素
arr.forEach(function(item,index,array)){} 遍歷數(shù)組
arr.push(添加元素) 添加元素到數(shù)組的末尾
arr.pop() 刪除數(shù)組末尾的元素
arr.shift() 刪除數(shù)組頭部元素
arr.push(目標元素) arr.indexOf(目標元素)
arr.splice(,) 通過索引刪除某個元素
let shallowCopy = arr.slice() 復制一個數(shù)組

了解更多


JSchallenger-Arrays

Get nth element of array

需求:

Write a function that takes an array (a) and a value (n) as argument

Return the nth element of 'a'

我的提交(作者答案)

function myFunction(a, n) {
   return a[n - 1];
}

涉及知識(訪問數(shù)組元素)

訪問數(shù)組元素

  • 數(shù)組的索引是從0開始的,第一個元素的索引為0,最后一個元素的索引等于該數(shù)組的length 減1。
  • 指定的索引是一個無效值,返回 undefined

格式

arr[index]

index:訪問數(shù)組元素目標索引

了解更多


Remove first n elements of an array

需求:

Write a function that takes an array (a) as argument

Remove the first 3 elements of 'a'

Return the result

我的提交(作者答案)

function myFunction(a) {
   return a.slice(3);
}

涉及知識(slice()方法)

Array.prototype.slice()

  • 返回一個新的由 beginend 決定的原數(shù)組的淺拷貝數(shù)組對象
  • 原始數(shù)組不會被改變
  • 會提取原數(shù)組中索引從 beginend 的所有元素(包含 begin,但不包含 end

格式

arr.slice([begin[, end]])

begin(提取起始處的索引):可選

  • 省略:默認從 0 開始
  • 負數(shù):從原數(shù)組中的倒數(shù)第幾個元素開始提取,到最后一個元素(包含最后一個元素)。
  • 超出原數(shù)組的索引范圍:返回空數(shù)組

end(提取終止處的索引):可選

  • 負數(shù):在原數(shù)組中的倒數(shù)第幾個元素結(jié)束抽取,到最后一個元素(不包含最后一個元素)
  • 省略:會一直提取到原數(shù)組末尾。
  • 大于數(shù)組的長度:也會一直提取到原數(shù)組末尾。

返回值:一個含有被提取元素的新數(shù)組

了解更多


Get last n elements of an array

需求:

Write a function that takes an array (a) as argument

Extract the last 3 elements of a

Return the resulting array

我的提交(作者答案)

function myFunction(a) {
    return a.slice(-3);
}

涉及知識(slice()方法)

Array.prototype.slice()

點擊此處跳轉(zhuǎn)


Get first n elements of an array

需求:

Write a function that takes an array (a) as argument

Extract the first 3 elements of a

Return the resulting array

我的提交(作者答案)

function myFunction(a) {
   return a.slice(0, 3);
}

涉及知識(slice()方法)

Array.prototype.slice()

點擊此處跳轉(zhuǎn)


Return last n array elements

需求:

Write a function that takes an array (a) and a number (n) as arguments

It should return the last n elements of a

我的提交(作者答案)

function myFunction(a, n) {
  return a.slice(-n);
}

涉及知識(slice()方法)

Array.prototype.slice()

點擊此處跳轉(zhuǎn)


Remove a specific array element

需求:

Write a function that takes an array (a) and a value (b) as argument

The function should clean a from all occurrences of b

Return the filtered array

我的提交(作者答案)

function myFunction(a, b) {
   return a.filter(item => item !== b);
}

涉及知識(filter()方法,箭頭函數(shù))

array.filter()方法

  • 創(chuàng)建一個新的數(shù)組,新數(shù)組中的元素是通過檢查指定數(shù)組中符合條件的所有元素。
  • 不會對空數(shù)組進行檢測。
  • 不會改變原始數(shù)組。

格式(注意該格式不完整,之針對本題的格式

array.filter(function(currentValue))

function(currentValue):必需,函數(shù),數(shù)組中的每個元素都會執(zhí)行這個函數(shù)

  • currentValue:必需。當前元素的值

返回值:數(shù)組。

  • 包含了符合條件的所有元素。
  • 沒有符合條件的元素:返回空數(shù)組。

了解更多



箭頭函數(shù)

  • 使函數(shù)表達式更簡潔
  • 更適用于那些本來需要匿名函數(shù)的地方
  • 它不能用作構(gòu)造函數(shù)

格式

(param1, param2, …, paramN) => expression
(param1, param2, …, paramN) => { statements }
//相當于:(param1, param2, …, paramN) =>{ return expression; }

param:參數(shù)

expression:表達式

其他格式 前提
singleParam => { statements } 只有一個參數(shù)時,圓括號是可選的:
() => { statements } 沒有參數(shù)的函數(shù)應該寫成一對圓括號。

了解更多


Count number of elements in JavaScript array

需求:

Write a function that takes an array (a) as argument

Return the number of elements in a

我的提交(作者答案)

function myFunction(a) {
   return a.length;
}

涉及知識(array.length)

Array.length

  • Array的實例屬性,值是一個 0 到 2^32 - 1 的整數(shù)
  • 返回或設(shè)置一個數(shù)組中的元素個數(shù)

了解更多


Count number of negative values in array

需求:

Write a function that takes an array of numbers as argument

Return the number of negative values in the array

我的提交

function myFunction(a){
	var count=0;
	for(var i=0;i

作者答案

function myFunction(a) {
   return a.filter((el) => el < 0).length;
}

涉及知識(array.filter()方法、箭頭函數(shù))

array.filter()方法

點擊此處跳轉(zhuǎn)



箭頭函數(shù)

點擊此處跳轉(zhuǎn)


Sort an array of numbers in descending order

需求:

Write a function that takes an array of numbers as argument

It should return an array with the numbers sorted in descending order

我的提交

function myFunction(arr) {
   arr1=arr.sort();
   return arr1.reverse();
}

作者答案

function myFunction( arr ) {
  return arr.sort((a, b) => b - a)
}

涉及知識(array.sort()方法、array.reverse()方法、箭頭函數(shù))

Array.prototype.sort()

  • 排列數(shù)組,排序順序可以是按字母或數(shù)字,也可以是升序(向上)或降序(向下)。
  • 默認將按字母和升序?qū)⒅底鳛樽址M行排序。
  • 在對數(shù)字字符串進行排序時會產(chǎn)生不正確的結(jié)果。(如"25" >"100",因為2>1)
  • 會改變原始數(shù)組

格式(注意該格式不完整,之針對本題的格式

arr.sort([compareFunction])

compareFunction(指定按某種順序進行排列的函數(shù)):可選。

  • 省略:元素按照轉(zhuǎn)換為的字符串的各個字符的Unicode位點進行排序

  • 指明了 compareFunction:數(shù)組會按照調(diào)用該函數(shù)的返回值排序

    compareFunction(a, b)的a-b a、b相對位置
    小于 0 a 會被排列到 b 之前(順序)
    等于 0 位置不變
    大于 0 b 會被排列到 a 之前(逆序)

返回值:數(shù)組

  • 排序后的數(shù)組(數(shù)組已原地排序,并且不進行復制

了解更多



Array.prototype.reverse()

  • 將數(shù)組中元素的位置顛倒,,并返回該數(shù)組。
  • 會改變原數(shù)組。

格式

 arr.reverse()

返回值:顛倒后的數(shù)組。



箭頭函數(shù)

點擊此處跳轉(zhuǎn)


Sort an array of strings alphabetically

需求:

Write a function that takes an array of strings as argument

Sort the array elements alphabetically

Return the result

我的提交(作者答案)

function myFunction(arr) {  
   return arr.sort();
}

涉及知識(字母排序方法)

字母排序方法

使用Array.prototype.sort()方法排序

點擊此處跳轉(zhuǎn)


Return the average of an array of numbers

需求:

Write a function that takes an array of numbers as argument

It should return the average of the numbers

我的提交

function myFunction(arr){
	var sum=0;
	for(var i=0;i

作者答案

function myFunction( arr ) {
	return arr.reduce((acc, cur) => acc + cur, 0) / arr.length
}

涉及知識(reduce()方法、箭頭函數(shù))

Array.prototype.reduce()

  • 接收一個函數(shù)作為累加器,數(shù)組中的每個值(從左到右)開始縮減,最終計算為一個值。
  • 對于空數(shù)組是不會執(zhí)行回調(diào)函數(shù)的

格式(注意該格式不完整,之針對本題的格式

array.reduce(function(total, currentValue))

function(total,currentValue)(用于執(zhí)行每個數(shù)組元素的函數(shù)):必需。

  • total初始值, 或者計算結(jié)束后的返回值):必需。
  • currentValue(當前元素):必需。

返回值:計算結(jié)果

了解更多



箭頭函數(shù)

點擊此處跳轉(zhuǎn)


Return the longest string from an array of strings

需求:

Write a function that takes an array of strings as argument、

Return the longest string

我的提交

function myFunction(arr) {
   var max;
   for(var i=0;iarr[i+1].length){
         max=arr[i];
      }else{
         max=arr[i+1];
      }
   }
   return max;
}

作者答案

function myFunction( arr ) {
	return arr.reduce((a, b) => a.length <= b.length ? b : a)
}

涉及知識(reduce()方法、箭頭函數(shù)、三目運算符)

Array.prototype.reduce()

點擊此處跳轉(zhuǎn)



箭頭函數(shù)

點擊此處跳轉(zhuǎn)



三目運算符

格式

expression ? sentence1 : sentence2
  • expression:判斷表達式

  • sentence1:值為true時,執(zhí)行語句

  • sentence2:值為false時,執(zhí)行語句

  • 類似于if語句:

    if(expression){
       sentence1;
    }else{
       sentence2;
    }
    

Check if all array elements are equal

需求:

Write a function that takes an array as argument

It should return true if all elements in the array are equal

It should return false otherwise

我的提交

function myFunction(arr) {
   return arr.every(item=>item ===arr[0]);
}

作者答案

function myFunction( arr ) {
  return new Set(arr).size === 1
}

涉及知識(every()方法、set().size方法、相等操作符)

Array.prototype.every()

  • 用于檢測數(shù)組所有元素是否都符合指定條件(通過函數(shù)提供)
    • 如果數(shù)組中檢測到有一個元素不滿足,則整個表達式返回 false ,且剩余的元素不會再進行檢測。
    • 如果所有元素都滿足條件,則返回 true。

注意:

  • 不會對空數(shù)組進行檢測
  • 不會改變原始數(shù)組

格式(注意該格式不完整,之針對本題的格式

array.every(function(currentValue))

function(currentValue)(函數(shù)):必須。

  • 數(shù)組中的每個元素都會執(zhí)行這個函數(shù)
    • currentValue:必須,當前元素的值

返回值:布爾值

  • true:所有元素都通過檢測
  • false:數(shù)組中檢測到有一個元素不滿足

了解更多



set().size方法

  • 返回Set對象中元素的個數(shù)。
  • size的值是一個整數(shù),表示Set對象有多少條目。
  • size的集合訪問函數(shù)是undefined
  • 不能改變這個屬性


相等操作符

相等和不等
相等 不等
== !=
相等返回true 不等返回true
  • 都會先轉(zhuǎn)換操作數(shù)(強制轉(zhuǎn)換),再比較相等性

  • 轉(zhuǎn)換不同數(shù)據(jù)類型時,遵循基本規(guī)則

    • 布爾值比較,false為0,true為1

      表達式
      false == 0 true
      true == 1 true
      true == 2 false
    • 字符串比較,先將字符串轉(zhuǎn)換成數(shù)值(ASCII碼數(shù)值)

      表達式
      "5" == 5 true
    • 對象比較,要調(diào)用對象的valueOf()方法,得到基本類型值再比較

  • 比較時,遵循的規(guī)則

    • nullundefined是相等的

      表達式
      null == undefined true
    • 比較相等性之前,不能將nullundefined轉(zhuǎn)換成其他任何值

      表達式
      undefined == 0 false
      null == 0 false
    • 有一個操作數(shù)是NaN。相等返回false,不相等返回true注意:即使兩個操作數(shù)都是NaN,NaN不等于NaN,返回false

      表達式
      "NaN" == NaN false
      5 == NaN false
      NaN == NaN false
      NaN != NaN false
    • 兩個操作數(shù)都是對象,如果兩個操作數(shù)都指向同一個對象,則相等返回true,相反返回false


全等和不全等
全等 不全等
=== !==

全等和不全等相等和不等的區(qū)別:

===!== ==!=
比較前操作數(shù)是否需要轉(zhuǎn)換 不需要 需要

示例

var result1 ={"55" == 55 };		//true
var result2 ={"55" === 55 };	//false

var result3 ={"55" != 55 };		//false
var result4 ={"55" !== 55 };	//true

var result5 ={null == undefined };	//true
var result6 ={null === undefined };	//false

為了保持代碼中數(shù)據(jù)類型的完整性,推薦使用全等和不全等操作符


Merge an arbitrary number of arrays

需求:

Write a function that takes arguments an arbitrary number of arrays

It should return an array containing the values of all arrays

我的提交

function myFunction(...arrays) {
   return [].concat(...arrays);
}

作者答案

function myFunction( ...arrays ) {
return arrays.flat()
}

涉及知識(concat()方法、flat()方法、擴展運算符、拼接數(shù)組的思路)

concat()方法

  • 用于連接兩個或多個數(shù)組。
  • 不會更改現(xiàn)有數(shù)組,而是返回一個新數(shù)組,其中包含已連接數(shù)組的值。

格式

array1.concat(array2, array3, ..., arrayX)

array2, array3, ..., arrayX:必需。要連接的數(shù)組。

返回值:已連接的數(shù)組



flat()方法

  • 按照一個可指定的深度遞歸遍歷數(shù)組,并將所有元素與遍歷到的子數(shù)組中的元素合并為一個新數(shù)組返回。

格式

var newArray = arr.flat([depth])

depth:指定要提取嵌套數(shù)組的結(jié)構(gòu)深度,默認值為 1

返回值:一個包含將數(shù)組與子數(shù)組中所有元素的新數(shù)組



擴展運算符

  • ES6
  • 又稱對象展開符,用...表示
  • 主要用于函數(shù)調(diào)用

了解更多



拼接數(shù)組思路(拓展)

思路一:concat方法

具體操作結(jié)合我的提交與涉及知識

思路二:flat()方法

具體操作結(jié)合作者答案與涉及知識

思路三:apply(推薦)

arr1.push.apply(arr1,arr2);

思路四:es6的寫法(推薦)

arr1.push(...arrays);

Sort array by object property

需求:

Write a function that takes an array of objects as argument

Sort the array by property b in ascending order

Return the sorted array

我的提交

function myFunction(arr) {
    return arr.sort((a,b)=>a.b-b.b);
}

作者答案

function myFunction(arr) {
   const sort = (x, y) => x.b - y.b;
   return arr.sort(sort);
}

涉及知識(const、sort()方法、箭頭函數(shù))

const

  • 塊級范圍的常量,非常類似用 let 語句定義的變量
  • 但常量的值是無法(通過重新賦值)改變的,也不能被重新聲明。

格式

const name1 = value1 [, name2 = value2 [, ... [, nameN = valueN]]];

nameN:常量名稱,可以是任意合法的標識符。

valueN:常量值,可以是任意合法的表達式。

了解更多



sort()方法

點擊此處跳轉(zhuǎn)



箭頭函數(shù)

點擊此處跳轉(zhuǎn)


Merge two arrays with duplicate values

需求:

Write a function that takes two arrays as arguments

Merge both arrays and remove duplicate values

Sort the merge result in ascending order

Return the resulting array

 Write a function that takes two arrays as arguments
// Merge both arrays and remove duplicate values
// Sort the merge result in ascending order
// Return the resulting array

這道題我試了很多方法,都是說有一個或多個測試案例不過。請小伙伴們在留言區(qū)分享這道題的解法,謝謝啦?。。?!


Sum up all array elements with values greater than

需求:

Write a function that takes an array (a) and a number (b) as arguments

Sum up all array elements with a value greater than b

Return the sum

我的提交

function myFunction(a, b) {
   var sum=0;
   for(var i=0;ib){
         sum+=a[i];
      }
   }
   return sum;
}

作者答案

function myFunction(a, b) {
  return a.reduce((sum, cur) => {
    if (cur > b) return sum + cur;
    return sum;
  }, 0);
}

涉及知識(reduce()方法,箭頭函數(shù))

Array.prototype.reduce()

點擊此處跳轉(zhuǎn)



箭頭函數(shù)

點擊此處跳轉(zhuǎn)


Create a range of numbers

需求:

Write a function that takes two numbers (min and max) as arguments

Return an array of numbers in the range min to max

我的提交

function myFunction(min, max) {
   var arr = [];
   var length=max-min;
   var t=min;
   for(var i=0;i<=length;i++){
      arr[i]=t;
      t++;
   }
   return arr;
}

作者答案

function myFunction(min, max) {
  let arr = [];
  for (let i = min; i <= max; i++) {
    arr.push(i);
  }
return arr;
}

涉及知識(let、push()方法)

let

  • let 聲明的變量只在 let 命令所在的代碼塊內(nèi)有效
  • ES6

了解更多



push()方法

  • 可向數(shù)組的末尾添加一個或多個元素,并返回新的長度。

注意:

  • 新元素將添加在數(shù)組的末尾
  • 此方法改變數(shù)組的長度
  • 在數(shù)組起始位置添加元素請使用 unshift() 方法。

格式

 array.push(item1, item2, ..., itemX)

item1, item2, ..., itemX:必需。要添加到數(shù)組的元素。

返回值:數(shù)組


Group array of strings by first letter

需求

Write a function that takes an array of strings as argument

Group those strings by their first letter

Return an object that contains properties with keys representing first letters

The values should be arrays of strings containing only the corresponding strings

For example, the array ['Alf', 'Alice', 'Ben'] should be transformed to

{ a: ['Alf', 'Alice'], b: ['Ben']}

我的提交

function myFunction(arr){
    let resultObj = {};
  	for (let i =0; i < arr.length; i++) {
    	let currentWord = arr[i];
    	let firstChar = currentWord[0].toLowerCase();
    	let innerArr = [];
    	if (resultObj[firstChar] === undefined) {
       		innerArr.push(currentWord);
      		resultObj[firstChar] = innerArr
    	}else {
      		resultObj[firstChar].push(currentWord)
    	}
  	}
	return resultObj;
}

作者答案

function myFunction(arr) {
 return arr.reduce((acc, cur) => {
   const firstLetter = cur.toLowerCase().charAt(0);
   return { ...acc, [firstLetter]: [...(acc[firstLetter] || []), cur] };
 }, {});
}

涉及知識(toLowerCase()方法、相等操作符、push()方法、reduce()方法、charAt()方法、擴展運算符)

toLowerCase()

  • 把字符串轉(zhuǎn)換為小寫。

格式

stringObject.toLowerCase()

返回值:新的字符串,所有大寫字符全部被轉(zhuǎn)換為了小寫字符



相等操作符

點擊此處跳轉(zhuǎn)



push()方法

點擊此處跳轉(zhuǎn)



reduce()方法

點擊此處跳轉(zhuǎn)



charAt()方法

  • 返回指定位置的字符,返回字符長度為1。

格式

stringObject.charAt(index)

stringObject:字符串對象

index(字符所在的字符串中的下標):必需

  • 注意:字符串中第一個字符的下標是 0。如果參數(shù) index 不在 0 與 string.length 之間,該方法將返回一個空字符串


擴展運算符

點擊此處跳轉(zhuǎn)


Define an array with conditional elements

需求:

Write a function that takes an array with arbitrary elements and a number as arguments

Return a new array, the first element should be either the given number itself

or zero if the number is smaller than 6

The other elements should be the elements of the original array

Try not to mutate the original array

我的提交

function myFunction(arr, num) {
   return num>=6? [num].concat(arr):[0].concat(arr);
}

作者答案

function myFunction(arr, num) {
 return [...(num > 5 ? [num] : [0]), ...arr];
}

涉及知識(不改變原數(shù)組的方法、擴展運算符、三目運算符)

不改變原數(shù)組的方法

不改變原數(shù)組的方法 描述
concat 返回拼接后的數(shù)組,不改變原數(shù)組;
forEach 遍歷數(shù)組
map
join() 返回拼接后的字符串,可以指定間隔;
slice(start,end); 截取數(shù)組,返回截取的部分,不改變原始數(shù)組;
sort(); 排序
toString(); [1,2,3].toString()==[1,2,3].join();


擴展運算符

點擊此處跳轉(zhuǎn)



三目運算符

點擊此處跳轉(zhuǎn)


Get every nth element of array

需求:

Write a function that takes an array (a) and a value (n) as arguments

Save every nth element in a new array

Return the new array

我的提交

function myFunction(a, n){
	var arr=[];
	for(var i=0;i

作者答案

function myFunction(a, n) {
   let rest = [...a];
   let result = [];
   for (let i = 0; i < a.length; i++) {
      if (rest.length < n) break;
      result.push(rest[n - 1]);
      rest = rest.slice(n);
   }
   return result;
}

涉及知識(擴展運算符、push()方法、slice()方法)

擴展運算符

點擊此處跳轉(zhuǎn)



push()方法

點擊此處跳轉(zhuǎn)



slice()方法

點擊此處跳轉(zhuǎn)


結(jié)語

【創(chuàng)作背景】

? 偶然在抖音上刷到JSchallenger這個可以訓練Javascript基礎(chǔ)的網(wǎng)站,自己在完成所有的Schallenger題之后,想要通過博客來記錄自己的做題痕跡,以便日后快速回顧。原本打算把JSchallenger的所有題目以及分析整理成一篇博客發(fā)出來,但是我整理完后發(fā)現(xiàn),已經(jīng)快有1w多字,為了方便讀者和自己觀看,因此打算按照JSchallenger的板塊分開發(fā)布。


【感謝】

感謝各位讀者能看到最后!!!


分享名稱:【筆記】【JavaScript】JSchallenger-Arrays對象-練習筆記
文章URL:http://weahome.cn/article/dsojpjd.html

在線咨詢

微信咨詢

電話咨詢

028-86922220(工作日)

18980820575(7×24)

提交需求

返回頂部