1、什么JavaScript? 运行环境 : 浏览器
是一种具有安全性的客户端的脚本语言 用来实现与web页面交互 脚本语言:语言嵌入到html代码中
js可以让页面中静止的元素动起来
2、js的历史背景(了解) 布莱登.艾奇
JavaScript诞生于1995年。起初它的主要目的是处理以前由服务器端负责的一些表单验证。在那个绝大多数用户都在使用调制解调器上网的时代,用户填写完一个表单点击提交,需要等待几十秒,完了服务器反馈给你说某个地方填错了……在当时如果能在客户端完成一些基本的验证绝对是令人兴奋的。当时走在技术革新最前沿的Netscape(网景)公司,决定着手开发一种客户端语言,用来处理这种装简单的验证。当时就职于Netscape公司的布兰登·艾奇开始着手计划将1995年2月发布的LiveScript同时在浏览器和服务器中使用。为了赶在发布日期前完成LiveScript的开发,Netscape与Sun公司成立了一个开发联盟。而此时,Netscape为了搭上媒体热炒Java的顺风车,临时把LiveScript改名为JavaScript,所以从本质上来说JavaScript和Java没什么关系 95 — 网景 liveScript java javascript h5 : h5 和 js 关系 : 是一样的 目的都是让静止的东西动起来 动画
3、javascript的组成? ECMAScript 欧洲计算机制造商协会 是一个组织 ,用来规范js语法 ES5 ES6 BOM 文档对象模型 DOM 浏览器对象模型
4、javascript 代码实现 内部脚本或外部连接 内部引入 1、所有的js代码必须出现在 <script>标签内 初学建议放到 body下面 2、<script>标签位置任意 除了title标签内 外部引入 3、使用 <script src=”路径”></script> 4、具有src属性的script标签内js代码无效
5、javascript的几个输出语句 alert() 弹出对话框 阻塞其他代码执行 console.log() 控制台输出 用于调试
alert和 console.log 换行用“\n” document.write( ); 在浏览器输出
document.write 可以识别CSS的内联样式和HTML标签的自带样式 快捷键 : ctrl + / 单行注释 ctrl + shift + / 多行注释 ctrl + 上箭头 向上调整代码 (下箭头 向下调整代码) ctrl + D 删除一整行 总结 :
. 前面的叫 对象 document.write()
. 后面的有括号 叫方法 document.write()
. 后面没有括号 叫 属性
6、js中的注释 // 单行注释 /**/ 多行注释
7、js中的字面量(常量) 固定不变的量 数值number 整数 十进制整数 0–9 90 二进制 0 1 组成 八进制 0–7组成 一般以 0开头 076 十六进制 0–9 a–f 一般以 0x 颜色 : #ffffff 小数 字符 string 用引号括起来的单个字或多个字以及5位数以上的数字串 但是注意 引号嵌套
外面用双引号,里面就用单引号,反之相反 布尔值 : true 真 false 假
8、js中标识(zhi)符(变量)的命名规范 1、 由 字母 数字 下划线 $ 组成 2、不能用数字开头 3、不能用系统指定的关键字 命名 例如 : a3 sname age -age(错误) _json 5a(错误) 不要情绪化命名 驼峰式命名法 : 小驼峰 qianFengJiaoYu getElementById() 大驼峰 QianFengJiaoYu 匈牙利命名 : iNum = 90 oBtn object
9、js中的变量 什么是变量 : 在程序运行的过程中 值有可能会发生变化
10、变量的定义和赋值 var 定义变量 (var 可以省略 不建议) var num = 90;
定义多个变量时,用逗号隔开
五位数以上的数字串用双引号括起来改成字符串
变量必须先定义 后使用
11、js中输出结果时注意几个问题: 1、如果输出的是变量 不能加引号 2、如果输出的是字符 , 必须加引号 3、如果输出的是数字 , 可以不加引号 4、如果输出字符和变量,中间必须用 + 连接
12、变量的数据类型(重点) 基本数据类型 : 字符型 string 值有多个 数值型 number 值有多个 布尔型 boolean 值有两个 true 真 false 假 复合数据类型(引用数据类型,对象数据类型) : object 对象 特殊数据类型 : undefined null function 函数
13、(扩展) 测试变量的数据类型 typeof 变量
typeof typeof( 变量 ) 结果都是string typeof( 变量 ) 值的情况 : string number boolean undefined object function (没有null)
14、运算符和表达式 (重点) 运算符 : 操作运算的符号 表达式 : 一个常量、一个变量、一个式子 都称为表达式 每一类运算符有哪些?? 每一类运算符对应的表达式?? 每一类运算符对应的表达式的值??
15、算术运算符 运算符 : + – * / % (二元运算符 双目)
++ — (一元运算符 单目)
– * / % 运算符对应的表达式值 : 1、两侧都是数值 正常计算 2、有一侧是纯数字字符串 字符串自动转换成数值 正常计算 3、有一侧是非数字字符串 结果NaN NaN : not a number 不是一个数 NaN不等于任何数和他自己 % 模运算符 (求余数): 1、结果取决于 “%” 左侧的操作数 2、大数 % 小数 = 余数 如 5%3=2
3、小数 % 大数 = 小数(绝对值) 如 3%5=3
4、任何数 % 10 === 个位数 + : 表示 加法运算 和 连接
数字和字符串相加 表示 连接 100+”10″ – 10 –> 10000 结果类型 number 单目 ++ 自增 –自减 注意 :自增和自减运算符 操作数必须是变量 i++ 或 ++i
i++和++i的异同: 相同点 : 自增变量的值都会自增1 不同点 : 表达式的值不同
如果 ++i , 先将自增变量i的值赋值给 j , 然后自增变量i再自增1 (先赋值 后自增)
如果 i++ ,先将自增变量i的值自增1,在将自增变量i的值赋值给 整个表达式j
16、赋值运算符 = 赋值 将右侧的值 赋值给 左侧的变量
注意 : = 符号左侧必须是变量 如 y = 10-x 复合赋值运算符 : += -= *= /= %= x+=10 等价 x = x + 10
17、关系运算符 运算符 : > >= < <= ==等于 ===全等于 !=不等于 !==不全等 表达式 : 3>4 2===3
表达式的值 : 表达式成立 为true,不成立 为 false 表达式值几种情况 : 1、两侧都是数值 正常比较 2、两侧都是字符 正常比较 根据字符的ASCII码 值 进行比较 a–97 A–65 0–48 往后每个数加1 3、某一侧是纯数字字符串 字符串自动转成数值 4、不能正常比较的结果都是 false
== 和 === 区别 : == 只比较值是否相等 === 先 比较类型,再比较值
18、逻辑运算符 运算符 : && 与 || 或 ! 非 表达式 (参与逻辑运算的一般为 布尔类型 ) 3>4 && 6==5 3>4 || 9==9 !true 表达式的值 : && (且) : && 两侧都为真 ,结果为true , 否则为 false 3>4 && 6==5 –> false
|| (或) : || 两侧都为假 ,结果为 假 ,否则就为真 3>4 || 9==9 –> true !true –>false !false—>true
19、条件运算符 (三目运算符) 运算符 : ? : 表达式 : 表达式1 ? 表达式2 : 表达式3 8<7 ? 89:90 10?1:2 表达式的值 :
如果表达式1的结果为真,取 表达式2的值作为整个条件表达式的值 ,否则 取表达式3为整个条件表达式的值
计算机中表示真假的几种情况 (一般用于判断中): 1、非0为真,0为假 2、所有字符串为真 空串为假 “” “”?1:2 3、所有对象为真 4、所有函数为真 5、null 和 undefined 为假