[TOC] * * * * * # 1.JavaScript简介 * * * * * ## 1.简介 ### A.诞生的背景 1995年网景公司开发的 开发目的:受制于当时的带宽,做表单验证 97年被提交给ECMA,98年获取ISO认证 ### B.功能 a.数据处理 b.用户交互 c.服务器端开发 # 2.JavaScript组成 * * * * *  # 3.JavaScript语法 * * * * * #### 1.注释 //单行注释 /**/多行注释 #### 2.什么是标示符 变量,函数,属性的名字，或者函数的参数。 标示符的命名规则： a.由字母,数字，下划线(_)或美元符号($)组成 b.不能以数字开头 c.不能使用关键字，保留字作为标示符 d.不能包含算术运算符,或特殊字符(#,etc) ### 3.1 变量 * * * * * ECMAScript的变量是松散类型 松散类型:可以用来保存任何类型的数据 什么是变量? 从字面上看，变量是可变的量； 从编程角度讲，JavaScript变量是存储数据值的容器。 如何使用:声明 赋值 取值 //var a;使用var关键字进行声明 //= 使用等于号进取赋值 a.变量可以先声明,再赋值 b.也可以声明的同时赋值 ~~~ var a = 10; ~~~ ### 3.2数据类型 * * * * * ~~~ 1.数据类型 2.typeof instanceof ~~~ #### A.数据类型的分类 - >1.1原始类型:number,string,boolean,undefined,null ~~~ a.number var a =10,b=20.1; b.string //用单引号或双引号包裹的叫string类型 var c= “hello world”; var c = 'good'; c.boolean //只有两个值true或false d.undefined var a; //一个变量之声明未赋值就是undefined e.null 1.null值表示一个空对象 2.如果定义的变量准备在将来用来保存对象,那么最好将改变量初始化null而不是其他值 使用typeof操作符来识别基本类型 ~~~ - >1.2 引用数据类型:array,object,function > ### array ``` //声明变量 var arr = [1,2,3,4] //获取数组的长度 arr.length //读取数组的值(数组的下标从0开始) arr[index] //向数组的末尾添加值 arr[arr.length]=5; ``` > ### object ``` //声明对象 var chengchao = { name:”chengchao”, age:20 } //读取变量的属性 console.log(chengchao.name); ``` >### function ~~~ //定义:封装特点功能的代码块 //声明函数 function a(){ console.log(“hello world”) } //调用函数 a(); ~~~ >声明提前 ~~~ 在正式执行脚本之前，将所有var声明的变量，提前预读到(当前作用域的)顶部，集中声明创建。 然后再开始执行程序。 ***赋值留在本地。 ~~~ ~~~ eg: console.log(a); //undefined var a=10; ~~~ > 全局变量和局部变量 ~~~ 全局变量:在函数外声明的变量 局部变量:在函数内部声明的变量 ~~~ # 4.数据类型的转换 * * * * * ### 4.1强制转换 ~~~ String,Boolean-->number 任意-->数字：Number(); Number(true) //1; Number(false) //0; //只能识别纯数值的字符串 var a = "20"; var b = "hello world"; console.log(Number(a));// 20; console.log(Number(b)); //NaN ~~~ ### 4.2自动转换 > 定义:不需要程序员干预，js自动完成的类型转换 算数计算中的自动转换： #### 1.[算数计算]()中，数据都默认转为[数字]()，再计算,不能转为数字则为NaN ~~~ Boolean类型：true-->1 false-->0 eg: var a=1; var b=true; var c = "hello world"; console.log(a+b); //2 console.log(a-c); //NaN ~~~ #### 2.[特殊]()+运算中，碰到字符串，+就变为字符串拼接 另一个不是字符串的数据，被自动转为字符串 比较运算(>,<,>=,<=,==,!=)中的自动转换： 默认将所有类型转为数字再比较 将两个值做比较-->返回值：true、false ### 4.3强制转换 >#### 1. 任意-->[数字]()：3个API a.特点:只能识别纯数字的字符串 ``` Number(x) eg： var a ="20"; console.log(Number(a)) //只能识别这样的字符串 ``` b. [将字符串转为数字]()：2个API parseInt(str): 从第一个字符开始依次读取每个数字,只要碰上第一个非数字字符就停止,自动跳过开头的空字符 ***[不识别小数点]() > Tip:何时使用：将字符串转为整数时 ~~~ var width="20px"; console.log(Number(width)) //NaN console.log(parseInt(width)) //20 ~~~ parseFloat(str):用法同parseInt >比较Number()和parseInt() ~~~ var b=true; console.log(Number(b)) //1 console.log(parseInt(String(b))) //NaN ~~~ >#### 2. 任意类型-->字符串：2个API ~~~ x.toString(); x不是undefined或null时，才可用 String(x) ~~~ >#### 3.任意类型-->Boolean: Boolean(x) ~~~ 只有5个值转为false： "" NaN undefined null 0 其余都转为true ~~~ # 5.运算符和表达式 * * * * * ### 5.1算术运算 ~~~ +,-,*,/,%,++,-- ~~~ ### 5.2比较运算:将两个值做比较-->返回值：true、false ~~~ >,<,>=,<=,==,!= ~~~ >Tip: ***比较运算中： a. 默认将所有类型转为数字再比较 [特殊情况]() NaN：NaN不等于，不大于，不小于任何值（包括自己） NaN和任何数据做!=比较时，始终返回true isNaN(n):本意是判断一个值是否是NaN ### 5.3逻辑运算：将多个关系运算综合起来，得出最终结论，返回值:true、false ~~~ && || ! ~~~ ### 5.4赋值运算 ~~~ += -= *= /= %= ~~~ ### 5.5三目运算 ~~~ var a=(10>4)?10:4； ~~~ # 6.递增和递减 ### 6.1递增 a++和++a; #### 1.单独使用a都会加一 ``` eg: var a=10; a++ ``` #### 2.在表达式中使用 - 前加加,a自增后运算 - 后加价,a先运算后自增 ~~~ var a=10; var b; b=a++; console.log(b) //10; ~~~ ### 6.2递减 同上 ## 例子 ~~~ var a = parseInt(window.prompt("请输入年龄")); if(a>18){ alert("成年人") }else if(a>12){ alert("青年人") } ~~~ ~~~ var a = window.confirm("你是否选择购买"); console.log(a); ~~~