JavaScript语法基础和部分使用

JavaScript

一、使用js的方式

使用html标签

<script type = 'text/javascript'>内容</script>

或者 从外部引入js文件

<script type = 'text/javascript' src = ''></script> <!--标签内不能写东西-->

二 使用js输出内容的方法

alert("弹出来了！")//系统的弹框document.write('写出来了') //显示在html页面里console.log("又出来了") //在控制台显示

js的注释

1. 单行注释 //
2. 多行注释 /**/

四 变量的定义(使用var关键字定义)

(1) 变量的命名规范

1. 变量以数字字母下划线 $符号组成
2. 不要以数字作为开头
3. 不能使用关键字作为变量名
4. 见名知意
5. 变量的命名 必须遵循小驼峰命名法
6. 变量区分大小写
7. 注意： 在方法里面定义的变量 如果加了var 则表示是局部变量 不是全局变量

(2) 定义变量

var age;

(3) 变量得赋值

age = 10;

(4) 定义变量并赋值

var name = ‘张三’

(5) 一次定义多个变量

var name = ‘张三’,age = 10,sex = ‘w’;

五 数据类型

(1) 数据类型分为

1. Boolean 布尔类型
2. Number 数值类型
3. String 字符串类型
4. Array 数组类型
5. Object 对象类型

特殊类型：null undefined

(2) undefined 类型

定义 没有赋值得变量 为 undefined类型

注意: 变量一定要在 定义完成就赋值

(3) null类型 (是一个空得对象)

var n = null;

document.write(typeof n);

(4) Boolean类型（True/False）

1. String 非空白得字符串为 真 空字符串为假

2. Number 非0数字 为真 0或者NaN 为假

3. Object 对象不为空 为真 null为假

4. undefined 为假

   Boolean(‘abc’)

(5) Number 类型

Number 类型 包含: 整形和浮点型

var num = 12.0;

alert(num) //12 会自动转换成整形 因为 浮点类型存储得空间使整形得2倍 所以会自动转换

浮点型

var num = 12.2;

var num = 0.2;

var num = .8 //不建议

(6) NaN 非数值 Not a Number

为NaN得情况

0/0 NaN

12/0*0 NaN

isNaN() 函数 判断这个数 是否为 NaN

    alert(isNaN(1))  //    document.write(isNaN(25))  //false    document.write(isNaN('zhangsan'))  // true    document.write(isNaN(true))  // false    document.write(isNaN(NaN))  // true

(7) 转换成整形和浮点型

parseInt() 转换成 整形

parseFloat() 转换成浮点型

六 js得运算符

(1) 算数运算符

+ - * / %

(2) 链接符号 +

(3) 关系运算符

> < <= >= == === != !==

== 只判断值是否相等

=== 判断值和类型都是否相等

!= 只判断值是否不等

!== 判断值和类型是否都不相等

(4) 逻辑运算符

&& || !

(5) 赋值运算符

= += -= *= /= %=

(6) 自增 自减

++ –

(7) 三元运算符/三目运算符

bool?真:假

document.write(3>5?’lv傻’:’不傻’)//不傻

七 流程控制

三种结构

1. 顺序结构
2. 分支结构
3. 循环结构

(1)分支结构

1.if单分支

if(){}

2.if 双向条件分支

if(){}else{}

3. if 多向条件分支

if(){}else if(){}else{}

4 if的嵌套

if(){    if(){    }else{        if(){        }    }}else{}

5 switch 语句

格式:

switch(值){  case 值1:    语句1;    break;  case 值2:    语句2;    break;  default:    语句;    break;}

其中的break 当语句执行完毕 就跳出当前的分支结构 不会在往下继续执行 常用于 精确值的快速定位

default 相当于 if里面的else 当没有满足条件的case的时候 去执行

(2) 循环结构

1. while(条件){ //条件为真就一直执行 避免死循环 就真的死了

   语句

   }

   var num = 1;while(num<=3){ document.write(num+'<br />'); num++;}

   ​

2. do{

   语句

   }while(条件);

   var num = 1;do{ document.write(num+'<br />'); num++;}while(num>1);

3. for(var i = 初始值;i<条件;i++){

   语句

   }

   for(var i=0;i<=9;i++){document.write(i);}

   ​

(3) 关键字 break

跳出当前的循环体 或者 switch的分支结构

(4) 关键字 continue

跳出本次循环 继续下一次循环

八 数组

(1) 数组的概念

数组的意思就是 一组数据

数组的作用是:用一个单独的变量名 来存储一系列的值

(2) 数组的定义

new Array(参数1,参数2[,])

var arr = new Array() //定义一个空数组

var arr = new Array(10) //创建一个包含10个元素的数组，没有赋值

var arr = [1,2,3,4,5] //直接定义赋值

(3) 数组的 取值

var arr = [1,2,3,4]

arr[2] //取索引值为2的值

(4) 数组值的修改 和添加

arr[2] = ‘a’

将数组下标为 2 的值 改为a 如果存在则为修改 不存在 则为 添加

(5) 数组的长度

数组名.length

(6) 数组的下标

下标就是索引值 从0开始 依次递增

下标可以是 变量 或者表达式

(7) 数组的常用方法

1. push() 将接收的参数 添加到 数组的末尾 并返回 修改后数组的长度

2. pop() 将数组的最后一个值弹出 并返回 弹出的值

3. shift() 从数组前 弹出一个值 并返回 弹出的值

4. unshift() 从数组前 添加一个或多个值

5. reverse() 数组值的反转

6. sort() 数组的排序 原数组也发生了改变

7. concat() 追加数据 并创建一个新的数组 不影响原数组

8. slice() 从数组的指定区域 取出一段数据 不影响原数组

9. splice() 对原数组中的值 的区域 进行值的替换

10. join() 拼接数组中的值 为字符串

    ​

九 字符串

(1) 字符串的属性:

length 计算字符串的长度

注意：字符串一旦创建 就不可以再次修改

(2) 字符串按照索引值取值

myStr = ‘abcdefg’

myStr[0] //取值 取所以值为0对应的字符

myStr[0] = 2 //不可以对字符串的某个索引值 就行修改‘

(3) 字符串的函数

charAt(索引值) 根据对应的索引值 取出对应的字符

charCodeAt(索引值) 根据对应索引的值 获取ASCII值

String.fromCharCode(ASCII) 根据ASCII值 获取对应的字符

(4) 字符串的链接

1. 运算符号的+进行链接
2. str.concat(字符) 使用方法进行链接

(5) 字符串的查找方法

indexOf(“字符”) 返回字符所在的索引值 如果找不到 则返回 -1

lastIndexOf(‘字符’) 查找字符 最后一次出现的位置 如果找不到 返回-1

(7) 字符串的截取

substring(start,end) 从start截取到end 但是不包括end本身 如果只给一个索引值 那么从当前的索引值 截取到 最后

(8) 字符串的拆分

myStr.split(‘a’) 以字符a拆分成 数组

myStr.split(/\d/) 使用正则进行拆分

(9) 大小写转换

toLowerCase() 将字符转换成小写

toUpperCase() 将字符转换成大写

十 Math对象

Math对象常用的函数

Math.round()    //四舍五入Math.random()   //返回0-1的随机数 Math.random() * 20 表示取0到20的随机数Math.max(num1,num2) //返回最大的数Math.min(num1,num2) //返回最小的数Math.abs()      //绝对值Math.ceil()     //向上取整Math.floor()    //向下取整Math.pow(x,y)  //x的y次方

十一 正则

1. match() 方法

使用正则表达式在字符串中进行查找 并将查找的结果进行返回

js中使用正则注意：正则表达式写在 / /中间

var str = "helloworld12345"var bat = /\w/g   //表示匹配所有的字母数字下划线var string_new = str.match(bat)

string.match(‘正则’)

2. exec() 方法

使用正则表达式在字符串中进行查找 并返回该查找结果的第一个值 如果匹配失败返回null

rgExp.exec(str)

3. test() 方法

返回一个boolean值 它就是在字符串中是否能满足 正则表达式

rgExp.test()

4. search() 方法

返回查找内容字符串的第一个位置

string.search(rgExp)

5. split() 拆分方法

str.split(rgExp)

十二 对象 Object

对象的创建

对象创建的方式有三种：

1. var obj = new Object()

   var obj = new Object()   //使用new关键字创建对象obj.name = '张三';obj.sex = '男';name 和 sex 成为 对象的属性var obj = Object()    //省略new关键字创建对象 (不建议)

2. var obj = {名:值}

   var obj = { name:'张三', sex:'男'}var obj = { 'name':'张三', 'sex':'男'}//属性的引号 可加可不加

3. var obj = {}

   var obj = {};obj.name = '张三';obj.age = 22;obj.run = function(){};

4. 获取属性

   var obj = { name:'张三', sex:'男'}obj.name;   //获取name属性的obj['name'];

5. 给对象创建方法

   var obj = { run:function(){   document.write('我是方法'); }}

6. 删除对象的属性

   delete 对象名.属性名

   ​

十三 日期对象 Date

实例化 Date对象

var d = new Date();

格式化时间的函数

d.toDateString() 以特定的格式显示星期 月日年 d.toTimeString() 以特定的格式显示时分秒 和时区 d.toLocaleDateString() 以特定的地区格式显示年月日 d.toLocaleTimeString() 以特定的地区格式显示时分秒 d.toUTCString() 以特定的格式来显示完整的UTC的时间年月日时分秒

日期对象的常用方法

getDate() 从Date对象中获取一个月中的某一天1-31

getDay() 从Date对象中获取一个星期中的某一天0-6

getFullYear() 获取年

getMonth() 获取某个月份 0-11月

getHours() 获取小时

getMinutes() 获取分钟

getSeconds() 获取秒

getMilliseconds() 毫秒

getTime() 1970年1月1日 到现在的毫秒数

d.getFullYear()+’年’+(d.getMonth()+1)+”月”+d.getDate()+”日”+d.getHours()+’时’+d.getMinutes()+’分’+d.getSeconds()+’秒’ 年月日时分秒

定时执行

var time = setInterval(function(){

},1000); 1秒执行一次

clearInterval(定时执行的名字) 清除定时执行

setTimeout(function(){  alert('5')},1000)    //setTimeout 只会调用一次 如果要多次调用可以自身调用自身的方法