<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script>
const object ={
name : 'python',
price : 10000,
publisher : 'media'
}
if (object.name !==undefined){
console.log('name tag')
} else {
console.log('not name tag')
}
if (object.author !== undefined){
console.log('author tag')
} else {
console.log('not author tag')
}
//same
object.name1 = object.name !== undefined ? object.name1 : 'not named'
object.author1 = object.author !== undefined ? object.author1 : 'not author'
//multiple allocation
const {name2, price2} = object
console.log('속성 이름 그대로 꺼내서 출력')
console.log(name2, price2)
console.log('')
const {a = name2, b = price2} = object
console.log('another name print out')
console.log(a,b)
</script>
</head>
<body>
</body>
</html>### Conditional Checks for Property Existence
- **First Check**: Determines if the `name` property exists in `object`. Since `object.name` is defined (`'python'`), it logs `'name tag'`.
- **Second Check**: Checks if the `author` property exists. Since `object.author` is `undefined` (the property doesn't exist), it logs `'not author tag'`.
### Conditional Assignment
- Attempts to assign values to `object.name1` and `object.author1` based on the existence of `object.name` and `object.author`, respectively. However, there's a logical error in the approach:
- `object.name1 = object.name !== undefined ? object.name1 : 'not named'` is intended to assign `'not named'` to `object.name1` if `object.name` is `undefined`. However, since `object.name1` itself is `undefined` before this assignment, attempting to use it in the ternary operation results in an unintended outcome. The correct approach to achieve the intended functionality would be to use `object.name` directly in the truthy part of the ternary operation: `object.name1 = object.name !== undefined ? object.name : 'not named'`.
- Similarly, `object.author1` is intended to be set to `'not author'` since `object.author` is `undefined`, but due to the incorrect setup, the expression doesn't perform as intended. The correct setup should be: `object.author1 = object.author !== undefined ? object.author : 'not author'`.
### Multiple Assignment with Destructuring
- **Direct Destructuring**: `{name2, price2} = object` attempts to directly extract `name2` and `price2` properties from `object`. However, this will result in a syntax error because the variables `name2` and `price2` are not declared properly in this context. The correct syntax for destructuring with new variable names would be: `const {name: name2, price: price2} = object`.
- The intention is to log the properties `name` and `price` using their direct names from `object`, but due to the incorrect destructuring assignment, this code won't execute as expected.
- **Renaming and Providing Default Values**: The snippet `{a = name2, b = price2} = object` also contains a mistake. The correct way to rename properties while destructuring and provide default values is like so: `const {name: a = 'defaultName', price: b = 'defaultPrice'} = object`. This code tries to rename `name` to `a` and `price` to `b` while destructuring, but is incorrectly written and will not work as expected.
### Corrections for Intended Functionality
To correct the script and achieve the intended functionality, consider the following changes:
- For conditional assignments, use the direct values from `object` for truthy assignments:
```
object.name1 = object.name !== undefined ? object.name : 'not named';
object.author1 = object.author !== undefined ? object.author : 'not author';
```
- Correct the destructuring assignment to properly declare variables and, if renaming is intended, use the correct syntax:
```
const {name: name2, price: price2} = object;
console.log(name2, price2);
const {name: a = 'defaultName', price: b = 'defaultPrice'} = object;
console.log(a, b);
```
These corrections will ensure that the code checks for property existence as intended, correctly assigns conditional values, and properly uses destructuring assignment to extract and optionally rename properties from objects.
'개념 > 혼자 공부하는 Javascript' 카테고리의 다른 글
| chapter 6) Add object properties dynamically (1) | 2024.12.15 |
|---|---|
| chapter 6) Array_Copy (0) | 2024.12.14 |
| chapter 6) href of output script (0) | 2024.12.12 |
| chapter 6) method inside of this keyword (0) | 2024.12.11 |
| chapter 5) callback (1) | 2024.12.10 |