JavaScript中圆括号()和方括号[]的一个特殊用法

简介:

缘由:

    JS这个语言实在过于灵活,当然其不足之处也有很多。当今各种开源JS脚本铺天盖地,所以很多人的编程风格一下涌到你面前,特别是那些大师级的JS编码风格与技巧。

    在最近分析NIKE这个网站源码时,看到了如下数组表达方式:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
// always trusted origins, can be exact strings or regular expressions
 
var  alwaysTrustedOrigins = [(/\.nike.com/),
 
     (/\.nikedev.com/),
 
     (/\.nike.com.tw/),
 
     (/\.swoosh.com/),
 
     (/\.nikeid.com/),
 
     (/\.facebook.com/),
 
     (/\.rga.com/),
 
     (/\.custhelp.com/)];

 

使用上面定义的代码如下:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
  var  alwaysTrusted =  false , i = alwaysTrustedOrigins.length;
 
             while  (i-- && !alwaysTrusted) {
 
                 if  (alwaysTrustedOrigins[i]  instanceof  RegExp) {
 
                     alwaysTrusted = alwaysTrustedOrigins[i].test(remote.origin);
 
                 }
 
                 else  if  ( typeof  alwaysTrustedOrigins[i] ==  "string" ) {
 
                     alwaysTrusted = (remote.origin === alwaysTrustedOrigins[i]);
 
                 }
 
             }

 

显然,操作方式还是标准数组方式,但是数组元素就‘成为’两种数据类型。本质上上面表达仍然是对象类型,但是从接下来的应用代码可以看出,这种表达方式实现了两种情况下需求:

 

 在支持RegExp对象的环境下与不支持RegExp对象的环境下。

 

注意:上面使用的运算会可不一样:分别是instanceof  和typeof,需要结合JS的自动类型转换进行理解才对哟!

 

结论:上面是一种不错的数组元素表达技巧,一下考虑了环境是否兼容RegExp对象的两种环境下的编码,有意思!

 


另有引文如下,供大家一并参考(引文URL:http://www.jb51.net/article/40358.htm)。

大家对JavaScript中圆括号() 和 方括号[] 的特殊用法或许有些疑问,本文就带着这些疑问为大家详细介绍下,有疑问的朋友可不要错过了哈。

 

(1, 2, 3); 
// return 3; 很好奇,为什么会返回3?这是什么机制?圆括号起到了什么作用? 

(1, 2, 3, alert )("Amazing!"); 
// 这里就更好玩了,居然可以直接调用alert ;经过测试,全局函数都可以通过这样调用。 

下面是关于 方括号[] 的疑问: 
在JS中,[]几乎就和数组画上了等号,但也有神奇的时候。 

[1,2,3][1]; 
// return 2; 当然这种方法也经常使用,常用于数组的索引 和 调用的对象的响应属性名存放在某个变量时。 
[1,2,3][1,2]; 

//return 3 ; 这种情况就有趣多了,和上面圆括号的情况很像,都会返回括号内的最后一个值 

在(1,2,3)里,括号和逗号都是运算符,逗号运算符返回最后一个表达式的求值结果,具体规则可自己查。 
("Amazing")的括号表示函数调用。 
alert是一个函数对象,当它作为表达式的求值结果返回,当然可以被调用。 

[1,2,3]这里的方括号是声明数组常量,紧跟[1]表示取数组元素。[1,2,3][1]意为取[1,2,3]这个数组里的第一个元素,即2(下标从0开始) 

[1,2,3][1,2]=[1,2,3][(1,2)]=[1,2,3][2]=3













本文转自朱先忠老师51CTO博客,原文链接: http://blog.51cto.com/zhuxianzhong/1663942,如需转载请自行联系原作者



相关文章
|
1月前
|
JavaScript 前端开发
javascript中的switch用法
javascript中的switch用法
|
4月前
|
JavaScript 数据管理
Node.js 文件系统的各种用法和常见场景
Node.js 文件系统的各种用法和常见场景
53 1
|
5月前
|
存储 JavaScript 前端开发
JS中return的用法
JS中return的用法
29 0
|
4月前
|
JSON 前端开发 JavaScript
js中await用法
js中await用法
80 0
|
1月前
|
JavaScript 前端开发
js开发:请解释this关键字在JavaScript中的用法。
JavaScript中的`this`关键字根据执行上下文指向不同对象:全局作用域中指向全局对象(如`window`),普通函数中默认指向全局对象,但作为对象方法时指向该对象。在构造函数中,`this`指向新实例。箭头函数不绑定`this`,而是继承上下文的`this`值。可通过`call`、`apply`、`bind`方法显式改变`this`指向。
10 2
|
2月前
|
机器学习/深度学习 JavaScript Python
GEE机器学习——混淆矩阵Classifier.confusionMatrix()和errorMatrix()和exlain()的用法(js和python代码)
GEE机器学习——混淆矩阵Classifier.confusionMatrix()和errorMatrix()和exlain()的用法(js和python代码)
60 0
|
2月前
|
前端开发 JavaScript BI
JavaScript的过滤大师:深度解析Filter用法
JavaScript的过滤大师:深度解析Filter用法
64 0
|
3月前
|
JSON JavaScript 前端开发
深入理解JavaScript对象:从基础到高级用法
深入理解JavaScript对象:从基础到高级用法
63 0
|
3月前
|
JavaScript 前端开发 开发者
7个Js async/await高级用法
7个Js async/await高级用法
|
3月前
|
前端开发 JavaScript 程序员
JavaScript高级技巧:深入探索JavaScript语言的高级特性和用法
JavaScript高级技巧:深入探索JavaScript语言的高级特性和用法