Toán Tử Logic
Toán tử &&
// Cách dài dòng
if (this.condition) {
this.action();
}
// Cách ngắn gọn
this.condition && this.action();
Toán tử ||
// Cách dài dòng
let result;
if (this.input) {
result = this.input;
} else {
result = 0;
}
// Cách ngắn gọn
let result = this.input || 0;
Toán tử !
// Kiểm tra giá trị falsy
if (!value) {
// Xử lý khi value rỗng/null/undefined/0/false
}
Toán tử !!
// Chuyển đổi sang boolean
const flag = !!value;
Toán Trải Rộng
// Hợp nhất object
const config = { ...defaults, ...options };
// Nối mảng
const combined = [...arrayA, ...arrayB];
Phép Gán Phân Rã
// Với object
const { id, name, email } = user.profile;
// Với mảng
const [first, second] = items;
Chuỗi Mẫu
const message = `
Chào ${userName},
Cảm ơn đã đăng ký ${serviceName}!
`;
Xử Lý Mảng
const numbers = [1, 2, 3];
// Kiểm tra tất cả phần tử
const allValid = numbers.every(n => n > 0);
// Kiểm tra ít nhất một phần tử
const hasEven = numbers.some(n => n % 2 === 0);
// Lọc phần tử
const filtered = numbers.filter(n => n > 1);
// Biến đổi phần tử
const doubled = numbers.map(n => n * 2);
// Tổng hợp giá trị
const total = numbers.reduce((sum, num) => sum + num, 0);
Loại Bỏ Trùng Lặp
// Giá trị cơ bản
const unique = [...new Set(values)];
// Đối tượng
const uniqueObjects = Array.from(new Map(
items.map(item => [item.key, item])
).values());
Sắp Xếp Mảng
// Tăng dần
numbers.sort((a, b) => a - b);
// Giảm dần
numbers.sort((a, b) => b - a);
Định Nghĩa Thuộc Tính
// Tên thuộc tính động
const dynamicKey = 'status';
const item = {
id: 1,
[dynamicKey]: 'active'
};
// Thuộc tính có điều kiện
const getUser = includeEmail => ({
name: 'Alex',
...(includeEmail && { email: 'alex@example.com' })
});
Kiểm Tra Kiểu Dữ Liệu
// Phương pháp chính xác
function getType(value) {
return Object.prototype.toString.call(value).slice(8, -1);
}
Chuyển Đổi Tập Hợp
const elements = document.querySelectorAll('.item');
const elementArray = [...elements];
Sao Chép Nông
const shallowCopy = { ...original };
Sao Chép Sâu
// Dùng thư viện
import { cloneDeep } from 'lodash';
const deepCopy = cloneDeep(original);
Tìm Giá Trị Lớn Nhất
const maxValue = Math.max(...values);
Kỹ Thuật Vue.js
Thêm Phương Thức Prototype
// main.js
import Vue from 'vue';
import utilities from './utils';
Vue.prototype.$utils = utilities;
Đóng Băng Dữ Liệu
export default {
data() {
return {
staticData: Object.freeze(largeDataSet)
};
}
};