JavaScript基础语法总结(二)

这篇文章，是非常简要地总结一下动态脚本语言JavaScript的最基础语法，方便熟练快速的写前端一些程序。

6. 数组

定义一个数组有如下三种语法：

var a = [2,3,45,6,8];
var b = [];
var c = new Array();

上述的第一句代码在定义数组的时候已经完成了初始化，而后面两句只是创建了一个空数组。

与其他常见的强类型语言不通，在JavaScript中，数组中的元素类型可以不同，也可以随意为任意元素赋值，整个数组是动态变化的。

示例代码如下：

<body>
<script type="text/javascript">
var a=[2,3,4];
 alert(a);
 a[2]='just do it';
 alert(a);
 a[5]=222;
 alert("array a length is "+a.length+"\n"+a);
</script>
</body>

注意：访问未赋值的数组元素时，该元素的值为undefined。

7. 对象

在JavaScript中，对象的属性和方法调用也是通过”.”操作符来进行的，如下面代码所示:

// 获得浏览器版本
alert("浏览器版本为："+navigator.appVersion);

在这里只给出json串方式，像创建一个结构体，创建对象的示例：

<body>
<script type="text/javascript">
var x={
"name":"junyu",
"gender":"male",
"age":25
 };
 alert(x+"\n"+x.name+"\n"+x.gender+"\n"+x.age+"\n"); 
</script>
</body>

8. with语句

with语句是一种简洁的写法，避免重复写对象名称，例如若需要如下代码：

document.writeln("Hello<br/>");
document.writeln("JavaScript<br/>");
document.writeln("World<br/>");

需要重复写document。这样，我们可以使用with语句使之简洁：

with(document){
writeln("Hello<br/>");
writeln("JavaScript<br/>");
writeln("World<br/>");
}

9. for in 循环

for in循环本质上是一种foreach循环，主要有两个作用：

遍历数组中的所有元素；
遍历JavaScript对象的所有属性；

语法格式如下：

for(index in object){
 statement...
}

注意：index代表的是索引，而并非元素

使用示例代码如下：

<body>
<script type="text/javascript">
var x=["hello","javascript","world"];
for(var idx in x){
 document.writeln("x["+idx+"]="+x[idx]+"<br/>");
 }
 document.writeln("<br/><br/>");
 document.writeln("navigator's attributes are:<br/>");
for(propName in navigator){
 document.writeln("navigator's attribute "+propName+"is "+
 navigator[propName]+"<br/>");
 } 
</script>
</body>

执行后结果为：

x[0]=hello
x[1]=javascript
x[2]=world


navigator's attributes are:
navigator's attribute vendorSubis 
navigator's attribute productSubis 20030107
navigator's attribute vendoris Google Inc.
navigator's attribute maxTouchPointsis 0
navigator's attribute hardwareConcurrencyis 4
navigator's attribute appCodeNameis Mozilla
navigator's attribute appNameis Netscape
navigator's attribute appVersionis 5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/48.0.2564.97 Safari/537.36
navigator's attribute platformis Win32
navigator's attribute productis Gecko
navigator's attribute userAgentis Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/48.0.2564.97 Safari/537.36
navigator's attribute languageis zh-CN
navigator's attribute languagesis zh-CN,zh
navigator's attribute onLineis true
navigator's attribute cookieEnabledis true
navigator's attribute getStorageUpdatesis function getStorageUpdates() { [native code] }
navigator's attribute doNotTrackis null
navigator's attribute geolocationis [object Geolocation]
navigator's attribute pluginsis [object PluginArray]
navigator's attribute mimeTypesis [object MimeTypeArray]
navigator's attribute webkitTemporaryStorageis [object DeprecatedStorageQuota]
navigator's attribute webkitPersistentStorageis [object DeprecatedStorageQuota]
navigator's attribute serviceWorkeris [object ServiceWorkerContainer]
navigator's attribute getBatteryis function getBattery() { [native code] }
navigator's attribute sendBeaconis function sendBeacon() { [native code] }
navigator's attribute getGamepadsis function getGamepads() { [native code] }
navigator's attribute webkitGetUserMediais function webkitGetUserMedia() { [native code] }
navigator's attribute javaEnabledis function javaEnabled() { [native code] }
navigator's attribute vibrateis function vibrate() { [native code] }
navigator's attribute requestMIDIAccessis function requestMIDIAccess() { [native code] }
navigator's attribute mediaDevicesis [object MediaDevices]
navigator's attribute permissionsis [object Permissions]
navigator's attribute presentationis [object Presentation]
navigator's attribute requestMediaKeySystemAccessis function requestMediaKeySystemAccess() { [native code] }
navigator's attribute registerProtocolHandleris function registerProtocolHandler() { [native code] }
navigator's attribute unregisterProtocolHandleris function unregisterProtocolHandler() { [native code] }

10. typeof和instanceof运算符

typeof运算符用于判断某个变量的数据类型，它既可以作为一个函数使用，也可以作为一个运算符使用，例如 typeof a可以返回变量a的数据类型，返回的是字符串。

示例代码如下：

<body>
<script type="text/javascript">
var a = 5;
var b = true;
var c = "hello javascript";
 alert(typeof(a)+"\n"+typeof(b)+"\n"+typeof(c)+"\n");
</script>
</body>

与typeof类似的还有instanceof运算符，instanceof用于判断变量是否是指定类型的实例，返回布尔变量，如果是，返回true，如果不是，返回false。

示例代码如下：

<body>
<script type="text/javascript">
var a = [1,2,3];
 alert(a instanceof Array);
 alert(a instanceof Object);
 alert(a instanceof String);
</script>
</body>

注意：结果可以发现，第一个和第二个弹框都显示true，第三个显示false，所以在JavaScript中，实际数组也是对象，因为所有的类都是Object的子类。

参考文献

[1] 李刚. 疯狂html 5/css 3/javascript讲义，北京：电子工业出版社

秒客网

JavaScript基础语法总结(二)