初识JavaScript
- JavaScript一种直译式脚本语言,是一种动态类型、弱类型、基于原型的语言,内置支持类型。它的解释器被称为JavaScript引擎,为浏览器的一部分,广泛用于客户端的脚本语言,最早是在HTML(标准通用标记语言下的一个应用)网页上使用,用来给HTML网页增加动态功能。
- 为了取得技术优势,微软推出了JScript,CEnvi推出ScriptEase,与JavaScript同样可在浏览器上运行。为了统一规格,因为JavaScript兼容于ECMA标准,因此也称为ECMAScript。
1.注释
单行 // 多行 /* */
2.引用方式
<head> <meta charset="UTF-8"> <title></title> <script src="commons.js"></script> </head> <body> <script> alert('derek') </script> </body>
3.JavaScript代码要放在<body>最下面,可以让网页尽快的呈现给用户,减少浏览者的等待时间,避免因为JS代码块阻塞网页的呈现。
常用数据类型
1.变量
局部变量必须一个 var 开头,如果未使用var,则默认表示声明的是全局变量
// 全局变量 name = 'derek'; function demo() { // 局部变量 var age = 18; // 全局变量 gender = 'M' }
2.数字
JavaScript中不区分整数值和浮点数值,JavaScript中所有数字均用浮点数值表示。
转换:
- parseInt(..) 将某值转换成数字,不成功则NaN
- parseFloat(..) 将某值转换成浮点数,不成功则NaN
特殊值:
- NaN,非数字。可使用 isNaN(num) 来判断。
- Infinity,无穷大。可使用 isFinite(num) 来判断
3.字符串
(1)charAt (输入索引位置获取字符)
a='derek' "derek" a.charAt(2) "r" a.charAt(4) "k"
(2)substring (输入起始位置,结束位置获取字符)
a.substring(2,4) "re"
(3)lenght (获取当前字符串长度)
a.length 5
(4)concat (字符串拼接)
a.concat('123') "derek123"
(5)查看索引位置
a.indexOf('k') 4 a.indexOf('r') 2
(6)split (分割字符)
a.split('e') (3) ["d", "r", "k"] a.split('e',1) ["d"] a.split('e',2) (2) ["d", "r"]
更多
4.布尔值
true(真)和false(假),要用小写
== 比较值相等 != 不等于 === 比较值和类型相等 !=== 不等于 || 或 && 且
5.数组
a = [11,22,33,44] -->数组 (4) [11, 22, 33, 44] a.splice(1,2) -->切片 (2) [22, 33] a.splite(1,3,66)
Array.length 数组的大小 Array.push() 尾部添加元素 Array.pop() 删除并返回数组的最后一个元素 Array.unshift() 在数组头部插入一个元素 Array.shift( ) 在数组头部移除一个元素 Array.slice( ) 切片 Array.reverse( ) 反转 Array.join( ) 将数组元素连接起来以构建一个字符串 Array.concat( ) 拼接 Array.sort( ) 排序 Array 对数组的内部支持 Array.splice( start, deleteCount, value, ...) 插入、删除或替换数组的元素 obj.splice(n,0,val) 指定位置插入元素 obj.splice(n,1,val) 指定位置替换元素 obj.splice(n,1) 指定位置删除元素 Array.toLocaleString( ) 把数组转换成局部字符串 Array.toString( ) 将数组转换成一个字符串
6、字典
创建字典
>dic = {'k1':'v1','k2':'v2'}; <Object {k1: "v1", k2: "v2"}
语句
1.循环
(1)for循环,两种方式
a = [11,22,33,44] for(var item in a){ console.log(a[item]) } 11 22 33 44
a = [11,22,33,44] for(var i=0;i<a.length;i += 1){ console.log(a[i]) } 11 22 33 44
(2)while循环
while(条件){ // break; // continue; }
2.条件语句
(1)if语句
if(条件){ }else if(条件){ }else if(条件){ }else{ }
(2)switch条件语句
switch(name){ case '1': age = 123; break; case '2': age = 456; break; default : age = 777; }
函数
// 普通函数 function func(arg){ return true; } // 匿名函数 var func = function(arg){ return "derek"; } // 自执行函数 (function(arg){ console.log(arg); })('derek')
正则表达式
1.匹配模式
/.../ 用于定义正则表达式 /.../g 表示全局匹配 /.../i 表示不区分大小写 /.../m 表示多行匹配
2.test
(判断字符串是否符合规定的正则)
rep = /d+/ -->只要有符合匹配的就返回true /d+/ rep.test('derek') false rep.test('derek123') true rep = /^d+$/ -->全部符合匹配的才返回true /^d+$/ rep.test('derek123') false rep.test('123') true
3.exec
exec(string) 用于获取正则匹配的内容
4.规则
d 数字,等同于[0-9] D 非数字,等同于[^0-9] s 空白字符 S 非空白字符 w 字母、数字、下划线,等同于[0-9A-Za-z_](汉字不属于w) W 非字母、数字、下划线,等同于[^0-9A-Za-z_]
元字符 名称 匹配对象 . 点号 单个任意字符(除回车 、换行 、行分隔符u2028和段分隔符u2029外) [] 字符组 列出的单个任意字符 [^] 排除型字符组 未列出的单个任意字符 ? 问号 匹配0次或1次 * 星号 匹配0交或多次 + 加号 匹配1次或多次 {min,max} 区间量词 匹配至少min次,最多max次 ^ 脱字符 行的起始位置 $ 美元符 行的结束位置 | 竖线 分隔两边的任意一个表达式 () 括号 限制多选结构的范围,标注量词作用的元素,为反向引用捕获文本 1,2... 反向引用 匹配之前的第一、第二...组括号内的表达式匹配的文本
定时器
setInterval(“执行函数”,“时间”)表示创建一个定时器
<script> function func(){ console.log(1); } //创建一个定时器 setInterval('func()',5000); //5000表示5秒,每隔五秒执行一次func() </script>
做个滚动字符的实例
<body> <div id="i1">欢迎来到Anderson_An的blog</div> <script> function func(){ var tag = document.getElementById('i1'); var content = tag.innerText; var f = content.charAt(0); var l = content.substring(1,content.length); var new_content = l + f; tag.innerText = new_content; } setInterval('func()',500); </script> </body>