JavaScript 和 React 的使用技巧
提示 1：字符串到整数转换的最简单方法。
提示 2：浮点数到整数转换的最简单方法。
提示 3：始终使用全局对象，无需使用 localStorage
提示 3：除非必要，否则不要使用三元运算符 (?:)
建议四：不要这样做
建议五：不要这样做
建议六：不要这样做
提示7：不要这样做
提示 8：不要这样做
建议9：不要这样做
由 Mux 主办的 DEV 全球展示挑战赛：展示你的项目！
提示 1：字符串到整数转换的最简单方法。
const value_1 = "1"
const value_2 = "2"
function add(field_1, field_2){
return field_1 + field_2;
}
add(+value_1, +value_2);
提示 2：浮点数到整数转换的最简单方法。
const floatToInt = 23.9 | 0;
提示 3：始终使用全局对象，无需使用 localStorage
注意[如果数据是静态的，则应使用静态数据。请勿在此处使用任何类型的秘密或机密数据。]
const user = {
first_name: "Rowan",
last_name: "Atkinson"
}
window.user=user
提示 3：除非必要，否则不要使用三元运算符 (?:)
const DemoComponent = ()=>{
const [show, setShow] = useState(false)
return (<div>
{show? <Message/>: ''}
</div>)
}
正确使用 (&&)
const DemoComponent = ()=>{
const [show, setShow] = useState(false)
return (<div>
{show && <Message/>}
</div>)
}
建议四：不要这样做
if (variable1 !== null || variable1 !== undefined || variable1 !== '') {
let variable2 = variable1;
}
简短易懂地完成这项任务
const variable2 = variable1 || 'new';
建议五：不要这样做
Math.floor(4.9) === 4 // true
简短易懂地完成这项任务
~~4.9 === 4 // true
建议六：不要这样做
switch (something) {
case 1:
doSomething();
break;
case 2:
doSomethingElse();
break;
case 3:
doSomethingElseAndOver();
break;
// And so on...
}
简短易懂地完成这项任务
const cases = {
1: doSomething(),
2: doSomethingElse(),
3: doSomethingElseAndOver()
};
【注：这种方法存在性能问题，只有在万不得已的情况下才建议使用这种方法。switch 语句比这种方法更快。】
提示7：不要这样做
if(x == 1 || x == 5 || x == 7) {
console.log('X has some value');
}
简短易懂地完成这项任务
([1,5,7].indexOf(x) !=- 1) && console.log('X has some value!');
提示 8：不要这样做
const param1 =1;
const param2 = 2;
const param3 = 3;
const param4 = 4;
function MyFunc =(param1, param2, param3, param4)=>{
console.log(param1, param2, param3, param4)
}
MyFunc(param1, param2, param3, param4)
简短易懂地完成这项任务
const params = {param1: 1, param2: 2, param3: 3, param4: 4}
function MyFunc =({param1, param2, param3, param4})=>{
console.log(param1, param2, param3, param4)
}
MyFunc(params)
建议9：不要这样做
function Myfunc(value){
if(value){
console.log("you have a value")
}else{
throw new Error("You don't have a value")
}
}
简短易懂地完成这项任务
注意：如果先检查错误，则不会进入 else 代码块；但如果先检查错误，则会检查第一个值是否存在，如果不存在，则会进入 else 代码块。
function Myfunc(value){
return !value ? throw new Error("You don't have a value") : console.log("you have a value")
}