在精不在多，3 分钟看 3 个 JS 小把戏
一起养成写作习惯！这是我参与「掘金日新计划 · 4 月更文挑战」的第4天，点击查看活动详情。
众所周知，JS 有很多小把戏（tricks），虽然有些基本用的很少，但是偶然遇到了，至少要能读懂吧~
话不多说，直接开冲~
trick 1 : 两组逻辑与或
来看以下代码片段：
let a="one",b="two",c="three";
let d = a && b && c;
console.log(d)输出什么？
是 true 吗? 还是 one/two/three 的其中一个？
正确答案是：
// "three"再来：
let a = "",b="two",c="three";
let d = a && b && c;
console.log(d)输出什么？
是 false 吗？还是 “”/two/three 的其中一个？
答案是：
// ""且慢，先别着急下结论，看完“与运算”，再来看看“或运算”：
let a="one",b="two",c="three";
let d = a || b || c;
console.log(d)输出还是 three 吗？
错，结果是：
// "one"再看：
let a = "",b="two",c="three";
let d = a || b || c;
console.log(d)输出是：
// "two"噢噢~看到这里，想必已经有大聪明猜到了其中的道理~~
- AND (&&)
两组逻辑与 ( && ) 运算符表示：
当其中每一个值都为“真”时，取最后一个值；
当其中存在值为“假”时，取第一个为“假”的值；
image.png
- OR (||)
两组逻辑或 ( || ) 运算符表示：
当其中存在值为“真”时，取第一个为“真”的值；
当其中每一个值都为“假”时，取最后一个值；
image.png
trick 2 : 将变量设为 key
有时候会碰到这样的需求：一个对象的 key 是一个变量；那我们该如何去设置？
这样？
var stu_address = 'address';
var student = {
name:'mick',
age : 10,
stu_address : 'chennai'
}
// {name:'mick', age : 10, stu_address : 'chennai'}输出，并没有达到预期的效果。
“trick 登场” ！
var stu_address = 'address';
var student = {
name:'mick',
age : 10,
[stu_address] : 'chennai'
}
//{name: 'mick', age: 10, address: 'chennai'}将对象中 key 用 [ ] 包住，则可将 key 设为动态键；
trick 3 : 数据和对象转换
这个常见，但也确实重要且好用~
数组转成对象：
let arr = [1,2,3,4,5,6,7,8,9]
const convert_obj = {...arr};
// {"0": 1, "1": 2, "2": 3, "3": 4, "4": 5, "5": 6, "6": 7, "7": 8, "8": 9,"9": 10}对象转成数组：
let obj = {
one : 'a',
two : 'b',
three : 'c'
};
/*1. Object.keys*/
const keys = Object.keys(obj) //['one', 'two', 'three']
/*2. Object.values*/
const values = Object.values(obj) // ['a', 'b', 'c']
/*3. Object.entries*/
const entries = Object.entries(obj) // [ ["one", "a"], ["two", "b"], ["three","c"] ]对于本瓜来说，第一个 trick 还是不错滴，平常用的少，可以加强理解；
OK，以上便是本篇分享，希望能有所帮助~
觉得不错，给个三连吧 👍👍👍
我是掘金安东尼，输出暴露输入，技术洞见生活。
本文参与 腾讯云自媒体同步曝光计划，分享自作者个人站点/博客。
原始发表：2022-04-13，如有侵权请联系 cloudcommunity@tencent.com 删除
评论
登录后参与评论
推荐阅读
目录
腾讯云开发者
