ES6 với những ưu điểm tuyệt vời thay thế thư viện Underscore.js
Khi lập trình ứng dụng với Javascrip các nhà phát triển thường phải xem xét lựa chọn cho mình một thư viện *.js chuẩn. Ra đời từ khá sớm cùng với nhiều tiện ích Underscore.js đã được nhiều lập trình viên yêu thích và tín dùng. Tuy nhiên, khi dự án ở vào thời điểm cần bảo trì hoặc cấu trúc lại ...
Khi lập trình ứng dụng với Javascrip các nhà phát triển thường phải xem xét lựa chọn cho mình một thư viện *.js chuẩn.
Ra đời từ khá sớm cùng với nhiều tiện ích Underscore.js đã được nhiều lập trình viên yêu thích và tín dùng.
Tuy nhiên, khi dự án ở vào thời điểm cần bảo trì hoặc cấu trúc lại các mã code rườm rà thì Underscore sẽ gây ra cho bạn không ít những khó khăn.
ES2015 (ES6) được phát triển và đóng gói một loạt các tính năng mới, khiến các đoạn mã trừu tượng, rườm rà trở lên dễ ngắn gọn và dễ hiểu với Babel. Những tính năng này làm cho một số chức năng trước kia cần cho thư viện tiện ích trở lên lỗi thời.
Phiên bản ES6 được hỗ trợ bởi tất cả các trình duyệt hiện nay và Node.js. ES6 có thể được biên dịch tới ES5 với Babel. Babel có thể dễ dàng thêm vào hầu như tất cả các môi trường phát triển JavaScript hiện nay hoặc để sử dụng với móc yêu cầu trên Node.js
Những ví dụ minh họa một số điều ES5.1, ES2015 và ES2016 đã được thực hiện dễ dàng mà bạn có thể không cần một thư viện tiện ích nữa.
Arrays
-
Iterate
-
Underscore
_.each(array, iteratee) - ES5.1 : - ```JavaScript array.forEach(iteratee) - **Map** - Underscore ```JavaScript _.map(array, iteratee) - ES5.1 : - ```JavaScript array.map(iteratee) - **Kiểm tra tất cả các phần tử trong mảng thông qua một giá trị** - Underscore ```JavaScript _.every(array, predicate) - ES5.1 : - ```JavaScript array.every(predicate) - **Kiểm tra một vài phần tử trong mảng thông qua một giá trị** - Underscore ```JavaScript _.some(array, predicate) - ES5.1 : - ```JavaScript array.some(predicate) - **Tìm một giá trị trong mảng** - Underscore ```JavaScript _.find(array, predicate) - ES2015 : - ```JavaScript array.find(predicate) - ** Lấy một phần từ mỗi phần tử trong mảng** - Underscore ```JavaScript _.pluck(array, propertyName) - ES2015 : - ```JavaScript array.map(value => value[propertyName]) - ** Kiểm tra nếu mảng chỉ có một phần tử** - Underscore ```JavaScript _.includes(array, element) - ES2016 : - ```JavaScript array.includes(element) - ** Chuyển một đối tượng thành mảng** - Underscore ```JavaScript _.toArray(arguments) - ES2016 : - ```JavaScript [...arguments] - **Tạo một bản sao của mảng với một giá trị đã bị xoá** - Underscore ```JavaScript _.compact(array) - ES2016 : - ```JavaScript array.filter(x => !!x) - **Tìm chỉ số của một giá trị trong mảng** - Underscore ```JavaScript _.indexOf(array, value) - ES5.1 : - ```JavaScript array.indexOf(value) - **Tìm chỉ số của một giá trị trong mảng với một giá trị** - Underscore ```JavaScript _.findIndex([4, 6, 7, 12], isPrime); - ES2015 : - ```JavaScript [4, 6, 7, 12].findIndex(isPrime); - **Tạo một mảng n phần tử bắt đầu từ x** - Underscore ```JavaScript _.range(x, x + n) - ES2015 : - ```JavaScript Array.from(Array(n), (v, k) => k + x) ### Objects - **Sử dụng tên của các thuộc tính như một mảng** - Underscore ```JavaScript _.keys(object) - ES2015 : - ```JavaScript Object.keys(object) - **Kiểm tra số các thuộc tính trong một object** - Underscore ```JavaScript _.size(object) - ES2015 : - ```JavaScript Object.keys(object).length - **Sử dụng tên của các thuộc tính(đếm được) trong một object như một mảng** - Underscore ```JavaScript _.allKeys(object) - ES2015 : - ```JavaScript [...Reflect.enumerate(object)] - **Giá trị** - Underscore ```JavaScript _.values(object) - ES2015 : - ```JavaScript Object.keys(object).map(key => object[key]) - **Tạo một object với các thuộc tính cho trước** - Underscore ```JavaScript _.assign({}, source, { a: false }) - ES2016 : - ```JavaScript Object.assign(Object.create(proto), properties) - **Kiểm tra nếu một object là một mảng ** - Underscore ```JavaScript _.isArray(object) - ES2016 : - ```JavaScript Array.isArray(object) - **Kiểm tra nếu một object là một số hữu hạn ** - Underscore ```JavaScript _.isNumber(object) && _.isFinite(object) - ES2016 : - ```JavaScript Number.isFinite(object) ###Functions - **Liên kết một hàm với một object ** - Underscore ```JavaScript foo(_.bind(function () { this.bar(); }, this)); foo(_.bind(object.fun, object)); - ES2016 : - ```JavaScript foo(() => { this.bar(); }); foo(::object.fun); ### Utility - **Hàm định danh ** - Underscore ```JavaScript _.identity - ES2016 : - ```JavaScript value => value - **Trả về giá trị của một hàm ** - Underscore ```JavaScript _.constant(value) - ES2015 : - ```JavaScript () => value - **Kiểm tra hàm rỗng ** - Underscore ```JavaScript _.noop - ES2015 : - ```JavaScript () => {} - ** Hàm lấy thời gian hiện tại ** - Underscore ```JavaScript _.now() - ES2015 : - ```JavaScript Date.now() - ** Template ** - Underscore ```JavaScript var greeting = _.template("hello <%= name %>"); greeting({ name: 'moe' }); - ES2015 : - ```JavaScript const greeting = ({ name }) => `hello ${name}`; greeting({ name: 'moe' }); ###Tài liệu tham khảo : https://babeljs.io/docs/learn-es2015/ https://www.reindex.io/blog/you-might-not-need-underscore