Những yếu tố quan trọng trong ES6

Những yếu tố quan trọng trong ES6

Anh NguyễnBạn nghĩ gì về bài viết này?

Trong bài viết này, mình sẽ cùng các bạn tìm hiểu về những yếu tố quan trọng trong ES6. Nhờ có ES6, việc code của chúng ta đã trở nên đơn giản và dễ dàng hơn.

Các khối

JS By Example: 8 Distinct Uses Of JavaScript Array Slice

Để thành thạo JavaScript, người mới học nên bắt đầu với việc hiểu các khối tạo nên 1 ứng dụng JavaScript. Các khối này là những thành phần nhỏ nhất cấu tạo nên ngôn ngữ.

Ví dụ như Number, String, Boolean, Function, Object và gần đây là Symbol. Ngoài ra còn có null, undefined,…

Number ES6

Series Javascript thần thánh – Giải ngố về ES6, ES8, ES 2017, ECMAScript ? – Not Cuder

Phiên bản mới nhất của ECMAScript đã phát hành một kiểu số mới, đó là “BigInt”. Trước đó, chúng ta chỉ biết loại “Number” như integer, float, double là kiểu số vậy. Vậy, BigInt là gì?

Về cơ bản, trong loại Number, có một hạn chế. Chúng ta bị giới hạn sử dụng giá trị trong loại này. Và giá trị tối đa với Number.MAX_SAFE_INTEGER là 9007199254740991, nhưng điều gì sẽ xảy ra khi chúng ta phải làm việc với số lớn hơn này?

ECMA Script mang đến một kiểu số mới để giải quyết vấn đề này, đó là BigInt. Để chuyển đổi một số bình thường thành BigInt chỉ cần thêm ‘n’ vào cuối số.

// Number
typeof(100) // output : "number"


// BigInt
typeof(100n) // output : "bigint"Code language: JavaScript (javascript)

String.prototype.slice()

Tìm hiểu javascript prototype

Slice là một điều thú vị, chỉ cần quên lập trình và nghĩ về một chiếc bánh. Khi chúng ta phải ăn một chiếc bánh, chúng ta không ăn cả chiếc bánh cùng một lúc. Đúng hơn là chúng ta phải cắt chiếc bánh đó thành miếng nhỏ rồi ăn miếng nhỏ đó.

Điều tương tự cũng xảy ra trong String Splice Function. Bất cứ khi nào chúng ta muốn một phần cụ thể của chuỗi, chúng ta sử dụng hàm Slice. Nó có hai tham số chỉ số bắt đầu và chỉ số kết thúc. Hàm này cũng trả về một chuỗi mới.

const str = "I love JavaScript"

let result = str.slice(7)
// Output : "JavaScript"

let result = str.slice(0, 6)
// Output : "I love"Code language: JavaScript (javascript)

String.prototype.split()

Split gần tương tự như Slice, nhưng sự khác biệt chính là chúng ta phải đưa ra một dấu phân tách. Vì vậy, hàm này nhận hai tham số String hoặc regex pattern làm dấu phân tách và số làm giới hạn và trả về một mảng. Mặc dù cả hai tham số đều là tùy chọn.

const str = "I am a JavaScript Developer"

str.split('JavaScript')
// Output : ["I am a ", " Developer"]

str.split('a')
// Output : ["I ", "m ", " J", "v", "Script Developer"]

str.split(' a ')
// Output : ["I am", "JavaScript Developer"]

str.split('a', 2) // With the limit Parameter
// Output : ["I ", "m "]Code language: JavaScript (javascript)

String.prototype.includes()

Hàm Include tìm một ‘văn bản’ cụ thể từ một chuỗi đã chọn. Đôi khi, chúng ta cần kiểm tra xem có từ nào tồn tại trong một chuỗi hay không, phải chứ ^^

Hàm này có tham số. Cái đầu tiên là chuỗi dưới dạng chuỗi tìm kiếm, mà chúng ta muốn tìm và cái thứ hai là vị trí dưới dạng số được sử dụng để kiểm tra ở một vị trí cụ thể. Và hàm này bao gồm trả về kết quả là Boolean. Nó tìm thấy từ đó thì nó sẽ trả về true, ngược lại nó sẽ trả về false.

const str = 'JavaScript is a multi-paradigm, dynamic language';

str.includes("JavaScript")
// Output : true

str.includes("Javascript")  // Case Sensitive
// Output : false

str.includes("is", 11)    
// Output : true
// Second parameter defines the postion. It tries to find from 0 to the spacified postion

str.includes("is", 12)
// Output : falseCode language: JavaScript (javascript)

Array.prototype.find()

Hàm Find tìm một phần tử cụ thể trong một mảng và trả về giá trị. Hàm này có hai đối số. Cái đầu tiên là hàm Callback và cái thứ hai là ‘this’. Tham số thứ hai là tùy chọn. Hàm này trả về phần tử đã so khớp nếu nó phù hợp với điều kiện, nhưng nếu không, nó sẽ trả về undefined.

arr = [4,2,5,7,8]

arr.find(element => element < 4)
// Output : 2

arr.find(element => element > 5)
// Output : 7

arr.find(element => element > 10)
// Output : undefined
// Cause, the condition is not fulfilled here.

// Alternative
function ifGreater(currentValue) {
    return currentValue > 5
}
arr.find(ifGreater)
// Output : 7Code language: JavaScript (javascript)

Array.prototype.indexOf()

Hàm indexOf được sử dụng để tìm chỉ số/vị trí của một phần tử mảng cụ thể. Bất cứ khi nào bạn cần tìm vị trí của một giá trị hoặc nếu bạn muốn kiểm tra xem một phần tử có tồn tại trong mảng hay không, bạn có thể sử dụng hàm này để tìm nó.

Cần có hai tham số, tham số đầu tiên là phần tử mà bạn muốn tìm và tham số thứ hai là tham số fromIndex để tìm kiếm từ một vị trí cụ thể. Và nó trả về vị trí của phần tử trong mảng. Nếu phần tử không được tìm thấy, nó sẽ trả về -1.

let array = ['I', 'Love', 'JavaScript']
// index      0     1         2

array.indexOf('JavaScript')
// Output : 2

array.indexOf('I')
// Output : 0

array.indexOf('javascript')
// Output : -1
// Case Sensitive so it's unable to find the value in the arrayCode language: PHP (php)

Array.prototype.shift()

Hàm Shift được sử dụng để xóa phần tử đầu tiên khỏi một mảng. Và nếu mảng trống, nó trả về undefined. Đây là một hàm chung, vì vậy nó chỉ có thể được gọi hoặc áp dụng cho một mảng. Nó không nhận tham số, nhưng nó trả về giá trị bị xóa khỏi mảng.

const array1 = [5, 10, 15, 20];

array1.shift();
// Output : 5
// array1 = [10, 15, 20]

const array2 = [];

array2.shift();
// Output : undefinedCode language: JavaScript (javascript)

Array.prototype.unshift()

Hàm Unshift làm ngược lại hoàn toàn với Shift. Hàm này sẽ thêm một phần tử mới vào danh sách mảng hiện có làm chỉ mục đầu tiên. Thậm chí chúng ta có thể thêm nhiều giá trị hoặc mảng vào vị trí đầu tiên.

Các bạn có thể tham khảo các bài viết hay về JavaScript tại đây.

Hãy tham gia nhóm Học lập trình để thảo luận thêm về các vấn đề cùng quan tâm.

Bình luận