Nội dung bài viết
Video học lập trình mỗi ngày
Việc sử dụng shorthand coding đương nhiên là được trú trọng nhiều trong mỗi lập trình viên, vì nó giúp chúng ta tiết kiệm được nhiều thời gian gõ code, tất nhiên là việc debug cũng dễ dàng hơn. Bài viết này sẽ giới thiệu 10 kỹ thuật viết code nhanh và gọn được sử dụng nhiều đối với tôi.
1. Multiple condition checking
Việc kiểm tra nhiều điều kiện khác nhau thông thường chúng ta mất nhiều code hơn, sau này có indexOf()
nhưng ES6 đã giới thiệu một phương pháp khác đó là includes
//Longhand if (value === 1 || value === 'one' || value === 2 || value === 'two') { // Execute some code } // Shorthand 1 if ([1, 'one', 2, 'two'].indexOf(value) >= 0) { // Execute some code } // Shorthand 2 if ([1, 'one', 2, 'two'].includes(value)) { // Execute some code }
Chú ý: Tất nhiên là hiện đại nhưng kèm theo đó là hại điện trong phương pháp sử dụng includes
đó là việc phải khởi tạo một array mới, liệu có tốt hay không???
2. Object Property Assignment
Nếu như chúng ta đặt tên biến và key Object giống nhau thì thay vì:
let firstname = 'Amitav'; let lastname = 'Mishra'; //Longhand let obj = {firstname: firstname, lastname: lastname}; //Shorthand let obj = {firstname, lastname};
Cách này rất hay, và thật sự bạn cảm thấy hay nhất khi viết RestFul APi.
3. Repeat a string for multiple times
Lúc trước khi Repeat thì chúng ta ai cũng nghĩ đến việc sử dụng for()
, nhưng việc sử dụng Repeat()
ngắn và gọn hơn rất nhiều.
//Longhand let str = ''; for(let i = 0; i < 5; i ++) { str += 'Hello '; } console.log(str); // Hello Hello Hello Hello Hello // Shorthand 'Hello '.repeat(5);
4. Merging of arrays
let arr1 = [20, 30]; //Longhand let arr2 = arr1.concat([60, 80]); // [20, 30, 60, 80] //Shorthand let arr2 = [...arr1, 60, 80]; // [20, 30, 60, 80]
5. Get character from string
let str = 'jscurious.com'; //Longhand str.charAt(2); // c //Shorthand str[2]; // c
6. Remove properties from object
Nếu như lúc xưa chúng ta sử dụng delete
để remove Object. Điều đó không sai, và để tiếp tục sử dụng code một cách ngắn gọn thì tôi khuyên bạn sử dụng Rest parameter với destructuring assignment.
let obj = {x: 45, y: 72, z: 68, p: 98}; // Longhand delete obj.x; delete obj.p; console.log(obj); // {y: 72, z: 68} // Shorthand let {x, p, ...newObj} = obj; console.log(newObj); // {y: 72, z: 68}
7. AND(&&) Short circuit evaluation
Nếu bạn chỉ cần check một điều kiện true hay false để gọi tiếp một function thì có thể sử dụng AND(&&)
là đủ.
//Longhand if (isLoggedin) { goToHomepage(); } //Shorthand isLoggedin && goToHomepage();
Cũng như ai học React rồi thì cú pháp này cũng quen thuộc
{ this.state.isLoading && }
8. Assigning values to multiple variables
Chúng ta có thể gán giá trị cho nhiều biến trong một dòng bằng cách sử dụng array destructuring
//Longhand let a, b, c; a = 5; b = 8; c = 12; //Shorthand let [a, b, c] = [5, 8, 12];
9. Multi-line String
Thay vì mỗi lần xuống dòng thì phải thêm dấu +
. Thì bây giờ đương nhiên là dễ dàng với việc sử dụng `
//Longhand console.log('JavaScript, often abbreviated as JS, is a\n' + 'programming language that conforms to the \n' + 'ECMAScript specification. JavaScript is high-level,\n' + 'often just-in-time compiled, and multi-paradigm.' ); //Shorthand console.log(`JavaScript, often abbreviated as JS, is a programming language that conforms to the ECMAScript specification. JavaScript is high-level, often just-in-time compiled, and multi-paradigm.` );
10. For loop
Kỹ thuật thứ 10 này là nói về for loop
. Thay vì sử dụng for truyền thống thì thay bằng việc sử dụng for...of hay for...in cũng có kết quả tương tự nhưng code lại ngắn gọn hơn nhiều so với cách truyền thống.
let arr = [10, 20, 30, 40]; //Longhand for (let i = 0; i < arr.length; i++) { console.log(arr[i]); } //Shorthand //for of loop for (const val of arr) { console.log(val); } //for in loop for (const index in arr) { console.log(arr[index]); }
Reference: Sự khác biệt khi sử dụng for...of đó là viên ngọc quý.
Tóm lại
Việc sử dụng cách viết code ngắn gọn có rất nhiều ưu điểm chính vì thế đây là một kỹ thuật được khuyến khích được áp dụng trong mỗi lập trình viên hiện nay. Đó cũng là một điểm cộng khi nhìn vào mã code của mỗi người. Nhìn vào mà sáng sủa dễ đọc là sướng rồi. Chứ nhìn vào mà rối thì thôi rồi lượm ơi.