fill(填充數據,位置開始,結束)

const array1 = [1, 2, 3, 4];
//從位置 2 到位置 4 填充 0
console.log(array1.fill(0, 2, 4));
//[1,2,0,0]

//從位置 1 填充 5
console.log(array1.fill(5, 1));
//[1,5,5,5]

//填充6
console.log(array1.fill(6));
// [6, 6, 6, 6]

concat():合併兩個或多個數組

const array1 = ['a', 'b', 'c'];
const array2 = ['d', 'e', 'f'];
const array3 = array1.concat(array2);
console.log(array3);
// Array ["a", "b", "c", "d", "e", "f"]

push()：將一個或多個元素添加到數組

const animals = ['pigs', 'goats', 'sheep'];

const count = animals.push('cows');
console.log(count);//4
console.log(animals);//["pigs","goats","sheep","cows"]

pop()刪除最後一個元素並返回該元素

const plants = ['broccoli', 'cauliflower', 'cabbage', 'kale', 'tomato'];

console.log(plants.pop());
// "tomato"

console.log(plants);
// ["broccoli", "cauliflower", "cabbage", "kale"]

keys():返回一個新的Array Iterator對象，其中包含數組中每個索引的鍵

const array1 = ['a', 'b', 'c'];
const iterator = array1.keys();

for (const key of iterator) {
  console.log(key);
}
//0
//1
//2

Math.round():四捨五入

Math.round(3.14)      // 3
Math.round(5.49999)   // 5
Math.round(5.5)       // 6
Math.round("5.50001") // 6
Math.round(-5.49999)  // -5
Math.round(-5.5)      // -5
Math.round(-5.50001)  // -6

display:flex;

flex-wrap:nowrap |wrap

flex-direction:靈活項目的方向。 row 水平顯示 | row-reverse 反向水平顯示 | column 單行顯示 | column-revers 反向單行顯示

flex-flow是flex-direction和flex-wrap的縮寫

1

flex-flow: flex-direction flex-wrap;

justify-content:水平控制Flex「水平對齊」的位置:flex-start 開始| flex-end | center | space-between ｜space-around

＃flex-start:起點
＃flex-end：終點
＃center：置中
＃space-between：:是平均分配「元素」位置，但左右兩側會貼齊主軸的起點、終點
＃space-around:是平均分配「元素」位置，但左右兩側的間距會較小 | Space-evenly是「元素」和「左右兩側」的間距皆相同;

align-item:設置對像是行內成員，控制「垂直對齊」的位置:stretch | flex-start | flex-end | center | baseline;

設置對像是行內成員，該屬性可以控制彈性容器中成員在當前行內的對齊方式。當成員設置了align-self 屬性時，父容器的 align-items 值則不再對它生效；行內成員會在其邊界盒正交軸上被居中（如果行正交尺寸小於行內成員尺寸，行內成員將會在正交軸兩方向等量溢出）

align-content:align-content是用來控制Flex的「行」在「水平方向」的對齊位置一定要設flex-wrap:wrap因為它是控制「行」，一定要有多行才能觸發

所有行被集中(擠)在彈性容器（正交軸）中間。它們彼此之間齊平，並且跟彈性盒子正交起始邊界的空白與跟彈性盒子正交結束邊界的空白相等。 （如果溢出空白為負數，所有行將會在正交軸兩方向等量溢出）鏈接。 ）

align-self:針對「單一」

order:order預設值為0,重新定義內元件的排列順序，順序會依照數值的大小排列

#flex

flex 是縮寫，裡面依序包含三個屬性 flex-grow、flex-shrink 和 flex-basis。

1

flex:flex-grow | flex-shrink | flex-basis 

flex-grow:屬性用於設置或檢索彈性盒子的擴展比率，依照設定”比例分配剩餘空間”，預設值爲 0;

1

flex-grow: number;

flex-shrink 元件的收縮性:按比例分配剩餘空間, 元件的伸展性，是一個數值，當空間分配還不足時的當前元件的收縮性，預設值為 0，如果設置為 0 則不會縮放。

flex-basis 預設值爲 auto，表示其預設分配到的空間，與 width 很像，但優先程度較高：。

• number:一個長度單位或者一個百分比，規定靈活項目的初始長度。
• auto:默認值。長度等於靈活項目的長度。如果該項目未指定長度，則長度將根據內容決定。

1

flex-basis: number|auto|initial|inherit;

toString():把陣列轉成字串

const stringObj = new String('foo');
const newObj=stringObj.toString();
console.log(newObj)
//"foo"

toLowerCase():字符串轉換為英文小寫字母后的結果

const sentence = 'The quick brown fox jumps over the lazy dog.';

console.log(sentence.toLowerCase());
//the quick brown fox jumps over the lazy dog.

toUpperCase():字符串轉換為英文大寫字母后的結果

const sentences = 'The is apple.';
console.log(sentences.toUpperCase());
//"THE IS APPLE."

trim():清空左右兩邊空白

const greeting = '   Hello world!   ';
const greetingTrim=greeting.trim();
console.log(greetingTrim);
//Hello world!"

const greetTrimEnd=greeting.trimEnd();
console.log('清除結束的空白',greetTrimEnd)
//"清除結束的空白" "   Hello world!"

greenTrimStart=greeting.trimStart();;

console.log(‘清除開始的空白’,greenTrimStart)
//“清除開始的空白” “Hello world!   “

reverse():反轉一個陣列。

const array1 = ['one', 'two', 'three'];
const reversed = array1.reverse();
console.log(reversed)
//["three","two","one"]