slice()、splice()、split()

slice()

• 擷取起始點-結束點的內容(不含結束點)
• 針對Array、String

a.slice()
a.slice(begin)
a.slice(begin, end)

var a = '1234';

console.log(a.slice()) // 1234
console.log(a.slice(1)) // 234
console.log(a.slice(1, 2)) // 2

splice()

• 增加 / 刪除元素
• 針對Array
• 回傳被刪除的值

a.splice(start)
a.splice(start, deleteTotalAmount)
a.splice(start, deleteCount, addItem1, addItem2..)

var a =[1, 2, 3, 4, 5];
console.log(a.splice(1)); // [2, 3, 4, 5]
console.log(a) // [1]

var a =[1, 2, 3, 4, 5];
console.log(a.splice(1, 2)); // [2, 3]
console.log(a) // [1, 4, 5]

var a =[1, 2, 3, 4, 5];
console.log(a.splice(1, 2, 'add')); // [2, 3]
console.log(a) // [1, "add", 4, 5]

split()

• 分割字串成字串組
• 針對String

stringObject.split(separator)
stringObject.split(separator, length)

var a = 'Go to learn JavaScript !'
console.log(a.split(' ')); // ["Go", "to", "learn", "JavaScript", "!"]

ar a = 'Go to learn JavaScript !'
console.log(a.split('learn')); // ["Go to ", " JavaScript !"]

var a = 'Go to learn JavaScript !'
console.log(a.split(' ', 2)); // ["Go", "to"]

小小小進階用法 & 其他

Array.prototype.slice.call()
將具有length屬性的對象轉成數組 -> List 轉 Array

// list
var elementList = document.querySelectorAll(selectors);

// list to array
var arr = Array.prototype.slice.call(elementList);

focus()
自動把游標放放置特定元件 (承上)

// 游標移至 arr[0]
arr[0].focus();

console.log(arr[0])
// <input type"text" class="add_description" placeholder="Add description">

isNaN()
情境 : 判斷數字不為空值

isNaN(input.value)

結束了前 10 小時的課程，接下來會是一連串的實作，文章就先當成實作筆記吧~
會記錄一些在實作中使用到的作法、概念。

課程 : https://www.udemy.com/course/the-complete-javascript-course/
來源 :
https://www.itread01.com/content/1548541099.html
https://medium.com/@bebebobohaha/slice-splice-split-%E5%82%BB%E5%82%BB%E5%88%86%E4%B8%8D%E6%B8%85-46d9c8992729