- Merge object
- Thêm property
- Thêm property khi thõa điều kiện
- Xóa property khỏi object
- Xóa property với key chỉ định
- Sắp xếp property
- Property mặc định
- Đổi tên property
Merge object
part1 và part2 sẽ được merge vào user1
const part1 = { id: 100, name: 'An Luu' }
const part2 = { id: 100, password: 'Password!' }
const user1 = { ...part1, ...part2 }
//=> { id: 100, name: 'An Luu', password: 'Password!' }Thêm property
Clone một object đồng thời thêm một số property mới vào object mới clone
const user = { id: 100, name: 'An Luu'}
const userWithPass = { ...user, password: 'Password!' }
user //=> { id: 100, name: 'An Luu' }
userWithPass //=> { id: 100, name: 'An Luu', password: 'Password!' }Thêm property khi thõa điều kiện
Trường hợp này hay dùng nhất là lúc chúng ta truyền lên API một object, nếu thõa điều kiện, sẽ thêm một số property vào trong object
const user = { id: 100, name: 'An Luu' }
const password = 'Password!'
const userWithPassword = {
...user,
id: 100,
...(password && { password })
}
userWithPassword //=> { id: 100, name: 'An Luu', password: 'Password!' }Xóa property khỏi object
// hàm này sẽ trả về object mới ko bao gồm password
const noPassword = ({ password, ...rest }) => rest
const user = {
id: 100,
name: 'An Luu',
password: 'Password!'
}
noPassword(user) //=> { id: 100, name: 'An Luu' }Xóa property với key chỉ định
const user1 = {
id: 100,
name: 'An Luu',
password: 'Password!'
}
const removeProperty = prop => ({ [prop]: _, ...rest }) => rest
// ---- ------
// \ /
// dynamic destructuring
const removePassword = removeProperty('password')
const removeId = removeProperty('id')
removePassword(user1) //=> { id: 100, name: 'An Luu' }
removeId(user1) //=> { name: 'An Luu', password: 'Password!' }Sắp xếp property
Đôi khi chúng ta sẽ muốn thay đổi các property theo một thứ tự nào đó, nếu sắp xếp toàn bộ luôn thì chắc dùng Object.keys rồi thay xếp cái mảng key này lại.
Để di chuyển id lên đầu, trước hết gán giá trị undefined cho nó trước, sau đó, override lại giá trị này bằng cách resting
const user3 = {
password: 'Password!',
name: 'An Luu',
id: 300
}
const organize = object => ({ id: undefined, ...object })
// -------------
// /
// dời id lên đầu
organize(user3)
//=> { id: 300, password: 'Password!', name: 'An Luu' }Còn di chuyển xuống dưới cùng
const user3 = {
password: 'Password!',
name: 'An Luu',
id: 300
}
const organize = ({ password, ...object }) =>
({ ...object, password })
// --------
// /
// dời password xuống cuối
organize(user3)
//=> { name: 'An Luu', id: 300, password: 'Password!' }Property mặc định
Ví dụ, user2 không có chứa quotes, hàm setDefaults đảm bảo tất cả object đều chứa property là quotes, nếu ko nó thêm vào []
const user2 = {
id: 200,
name: 'An Luu'
}
const user4 = {
id: 400,
name: 'You',
quotes: ["I've got a good feeling about this..."]
}
const setDefaults = ({ quotes = [], ...object}) =>
({ ...object, quotes })
// hoặc nếu muốn dời thằng quotes lên đầu
// const setDefaults = ({ ...object}) => ({ quotes: [], ...object })
setDefaults(user2)
//=> { id: 200, name: 'An Luu', quotes: [] }
setDefaults(user4)
//=> {
//=> id: 400,
//=> name: 'You',
//=> quotes: ["I've got a good feeling about this..."]
//=> }Đổi tên property
Thí dụ bạn ko muốn trong object chứa property ID, nó phải viết thường id, đầu tiên chúng ta remove ID ra khỏi object, sau đó add lại bằng tên là id
const renamed = ({ ID, ...object }) => ({ id: ID, ...object })
const user = {
ID: 500,
name: "An Luu"
}
renamed(user) //=> { id: 500, name: 'An Luu' }
Initializing...