// 获取当前选项卡ID
function getCurrentTabId(callback)
{
chrome.tabs.query({active: true, currentWindow: true}, function(tabs)
{
if(callback) callback(tabs.length ? tabs[0].id: null);
});
}
// 获取当前标签ID
$('#get_current_tab_id').click(() => {
getCurrentTabId(tabId => {
alert('当前标签ID:' + tabId);
});
});
就是这一句
if(callback) callback(tabs.length ? tabs[0].id: null);
是什么意思呢, 如果?? 就??
###首先,if语句省略了 {}。
if(callback) callback(tabs.length ? tabs[0].id: null);
其次,上面这行代码等同于下面所示:
if(callback){
if(tabs.length === 0){
callback(null);
} else {
callback(tabs[0].id);
}
}
关于是否用三目运算符来编写,还是要看团队成员是否都能接受。如果不能接受,还是不要这样写,维护成本高。毕竟写出的代码不仅是让计算机能执行,还是要给人看的。
###这不是很简单嘛……
如果 callback不为空 那么
执行回调(如果tab.length不为空,则返回tabs[0].id的值,否则返回null)
回调的里面是一个三目运算符,相当于另一个if判断。这种语法其实还是挺常见的,不过感觉还是C/C++里面喜欢这么用。java程序员不喜欢简洁,更喜欢写成if (callback != null)
这种形式。如果是比较新的语言,还支持??
、?.
这种运算符,有兴趣的可以了解一下。
先用 if
判断 callback
是否存在,存在的话就执行它;而执行的时候,通过 三目运算 符确定给 callback
传递什么参数, tabs.length
为零,即 tabs
至少有一个子项的时候,传第一个子项的 id
,否则就传 null
。
等价于:
if(callback){
if(tabs.length === 0){
callback(null);
} else {
callback(tabs[0].id);
}
}
如果是我的话,在不需要维护的项目里会写得面目全非:
callback instanceof Function && callback(tabs.length ? tabs[0].id: null);
使用 ES2020
更佳:
callback instanceof Function && callback(tabs?.[0]?.id || null);
###- 这相当于
if
的简单写法,当只有一行的时候可以省去{}
。不过我的规范不允许这么做。 -
null
调用会报错,所以判断一下再调用比较好
这段代码为了提高健壮性,采用了一定处理。
整个代码等效于:
if(callback){ // 判断callback是否是有效的,这里其实还可以改进,这里只判断了是非“无效值”,而不是判断的确实有效,即callback可能是非函数类型的,后面一样会异常
if(tabs.length == 0){ // 再判断对应全局(上层)变量参数是否至少有一个
callback(null);
} else {
callback(tabs[0].id);
}
}
这里的代码配合合适的callback实参(函数)定义和变量定义,就可以很好的完成工作啦。
###js高程里面有写,都不推荐这种写法
###if后的括弧中的表达式为callback
,就是判断 callback
这个变量是否存在。callback
可能存在,也可能为null,也可能为undefind。如果存在则把callback
作为函数调用一下,tabs.length ? tabs[0].id: null
就是他的参数。