二十分钟学会Javascript初级语法，图片来自网络
Javascript基本用法
-
Javascript代码写在
<script>标签内<script> //Javascript代码写在这里 </script> -
Javascript代码可以写在
body标签内<body> <script> //Javascript代码写在这里 </script> </body> -
Javascript代码可以写在
<head>标签内<head> <script> //Javascript代码写在这里 </script> </head> -
Javascript代码可以写在外部的独立js文件内
<head> <script src="xxx.js"></script> </head>
在
<body>和<head>标签内的Javascript代码是不同的，在<head>标签内的JS代码在页面加载的时候就会运行，而在<body>内的JS代码只有在需要的时候才会执行。一般会把多个页面都是用到的JS代码放到独立的js文件中。
Javascript显示数据的方法
- 使用弹出框
window.alert()或者alert()方法。其中，window是Javascript的一个内置对象，可省略不写。 - 使用
document.write()方法直接写入html源码。 - 使用
console.log()方法将调试信息打印到浏览器控制台。
Javascript字面量
//数字字面量（Number）
var a = 3.14; //浮点数
var b = 1; //整数
var c = 13e5; //科学计数法
//字符串字面量（String）
var d = 'string'; //字符串
var e = "string"; //字符串
//数组和对象字面量（Array & Object）
var f = [1,2,3]; //数组
var g = {a:"a",b:"b"} //对象
//函数字面量（Function）
var h = function(){}; //函数
Javascript变量
<script>
var a = 1; //这是一个全局变量
b = 2; //这是一个全局变量
function f(){
var c = 3; //这是一个局部变量
d = 4; //这是一个全局变量
}
</script>
注意，没有使用
var关键字标识的字段都是全局变量，使用了var关键字标识的变量如果在方法内声明，则为局部变量，否则也为全局变量，主要观测其所在的作用域。
Javascript语句标识符
在Javascript中，也有类似于Java和C#等高级面向对象语法的语句标识符，主要有break/try...catch/continue/do...while/for/for..in/function/if...else/return/switch/throw/while/var
Javascript代码折行
使用\\可以对JS代码进行折行处理:
document.write('hello \
world');
Javascript注释语法
- 使用
//进行单行注释 - 使用
/* ... */进行多行注释
Javascript数据类型
- 字符串（String）类型
- 数字（Number）类型
- 布尔（Boolean）类型
- 数组（Array）类型
- 对象（Object）类型
- 空（Null）类型
- 未定义（Undefined）类型
Javascript对象
var obj = { //创建对象
a:"a",
b:"b",
c:2,
method:function(){}
}
var d = obj.a; //访问对象属性
var e = obj.b;
var f = obj.method; //访问对象方法
Javascript函数
function a(){ //无返回值函数
//...
}
function b(){ //有返回值的函数
return 1;
}
var c = b(); //调用函数
Javascript作用域
- 在Javascript中，对象和函数也是一种变量。
- 作用域是可访问变量、对象和函数的集合。
- 函数作用域：作用域在函数内修改。
- 变量在函数内声明，则其作用域为局部作用域。
- 全局变量有全局作用域，网页中所有的脚本和网页都可以使用。
Javascript事件
<some-HTML-element some-event='some JavaScript'>
<some-HTML-element some-event="some JavaScript">
常用的HTML事件有：onchange/onclick/onmouseover/onmouseout/onkeydown/onload
绝对等于和绝对不等于
-
===表示绝对等于（值和类型都相等） -
!==表示绝对不等于(值或类型不相等)
遍历对象的属性
var person = {name:"Anderson",age:25}
for(x in person){
txt = txt + person[x];
}
Javascript typeof操作符
typeof "Anderson" //返回string
typeof 3.14 //返回number
typeof false //返回boolean
typeof [1,2,3,4] //返回object
var a;
typeof a //返回undefined
a = null;
typeof a //返回null
typeof undefined // undefined
typeof null // object
Javascript 构造器属性
"John".constructor // 返回函数 String() { [native code] }
(3.14).constructor // 返回函数 Number() { [native code] }
false.constructor // 返回函数 Boolean() { [native code] }
[1,2,3,4].constructor // 返回函数 Array() { [native code] }
{name:'John', age:34}.constructor // 返回函数 Object() { [native code] }
new Date().constructor // 返回函数 Date() { [native code] }
function () {}.constructor // 返回函数 Function(){ [native code] }
function isArray(myArray) {
return myArray.constructor.toString().indexOf("Array") > -1;
function isDate(myDate) {
return myDate.constructor.toString().indexOf("Date") > -1;
}
}
JavaScript 变量提升
- JavaScript 中，函数及变量的声明都将被提升到函数的最顶部。变量可以在使用后声明，也就是变量可以先使用再声明
- JavaScript 初始化不会提升
函数提升（Hoisting）
- 提升（Hoisting）是 JavaScript 默认将当前作用域提升到前面去的的行为。
- 提升（Hoisting）应用在变量的声明与函数的声明。
JavaScript 严格模式(use strict)
- "use strict" 指令在 JavaScript 1.8.5 (ECMAScript5) 中新增
- 它不是一条语句，但是是一个字面量表达式，在 JavaScript 旧版本中会被忽略
- "use strict" 的目的是指定代码在严格条件下执行。严格模式下你不能使用未声明的变量。
href="#"与href="javascript:void(0)"的区别
-
#包含了一个位置信息，默认的锚是#top也就是网页的上端。 - 而
javascript:void(0), 仅仅表示一个死链接。 - 在页面很长的时候会使用
#来定位页面的具体位置，格式为：# + id。 - 如果你要定义一个死链接请使用
javascript:void(0)。
附录 文章更新日志
2016-06-03 初稿
2016-06-06 修正文章中的错别字
2016-06-22 修正文章中的一处笔误
