一、JS简介,JS和H5的关系
1.简介 :
JavaScript一种在浏览器中解释运行的脚本语言,它的解释器被称为JavaScript引擎,为浏览器的一部分,是广泛用于客户端的脚本语言,最早是在HTML网页上使用,用来给HTML(HTML5)网页增加动态功能。在1995年时,由Netscape公司的Brendan Eich,在网景导航者浏览器上首次设计实现而成。因为Netscape与Sun合作,Netscape管理层希望它外观看起来像Java,因此取名为JavaScript。
2.可以实现:
用户交互(表单验证)、网页特效(漂浮的广告)、客户端的显示(页面内容,速度快)、网页游戏、
地图搜索、股市信息查询、web聊天。。。
3.发展趋势:
当今和未来是移动优先时代,腾讯系、百度系、阿里系、Facebook、韩国kakaotalk等巨头纷纷巨额投入,游戏、网
购、社交、视频、直播、分享经济等。。。
传统经济搭乘移动互联快车,健身、婴儿用品、餐饮、洗浴、休闲旅游。。。等传统行业纷纷建立自己的移动平台。
4.javascript组成:
二、编写及运行JS
1.JS初识:
如何在HTML中使用JS
<html>
<body>
<script type="text/javascript"> (Script标签)
//第一句javascript代码: (JS注释)
(JS代码) alert(“我用来弹出消息框!”) ;
//第二句:
(JS代码) document.write(“我会把内容显示在页面上,能够输出任何HTML代码!”);
</script>
</body>
</html>
注:JS大小写敏感
2.JS基础:
1.)script标签和属性,可以写在HTML中任意位置,可出现多个,一般会写在标签中
<script type="text/javascript" >
JS代码写在这里。
</script>
language已废弃。原来用于代码使用的脚本语言。由于大多数浏览器忽略它,所以不要用了。
src 表示要引入的外部文件
type 表示脚本语言的类型
2.)使用script标签引入外部javaScript文件
注意:
1、引入文件不可以使用单标
<script type="text/javascript" src="demo1.js“/ >
2、引入文件不可以在标签中写代码
<script src="demo1.js">alert('xxxx')</script>;
3.)注释
单行注释 //
多行注释 /* /
文档注释 /* */
4.)运行顺序
Javascript和HTML代码在同一个文件中写,它们的执行顺序是从上朝下,谁在前先执行谁。
5.)、编辑工具和运行环境
编辑工具:写代码的工具
如:dreamweaver,editplus,Notepad++
运行环境:看结果的地方
如:IE,firefox,chrome
三、JS变量
变量用来在计算机中存储和表示数据。
变量定义(声明):
var age; //var 是关键字,age是变量名
赋值:
age = 20; //20是数据 “=”是赋值
定义的同时赋值:
var age=20;
可以一次定义多个变量:
var myname=“早上好", age=10,weight=100;
使用变量:
alert(hello world);
注:1, 变量必须先赋值再使用
四、JS的数据类型
1.Undefined类型:
Undefined类型只有一个值undefined,它是变量未被赋值时的值。
2.Null类型
Null类型也只有一个值null 。Null类型的语义是“一个空的对象引用”,注意和空字符串区别开。
3.Boolean类型
布尔有两种取值true和false,表示真或假。非0代表真,0代表假。
4.String类型
又叫字符串类型,用双(单)引号括起来的一串字符。
5.Number类型
包含整数± 123456789101112 和浮点数±1.123456578 × 10的300次方。
6.Object类型
JavaScript中最为复杂的类型就是Object,它是一系列属性的无序集合。
7.使用typeof关键字查看变量类型
var age=20;
alert(typeof age);
JS的数据类型
五、JS变量的命名规则和关键字
1.变量命名规则:
不以数字开头,数字、字母以及下划线均可用来组成变量名,但不能使用关键字及保留字。
2.关键字及保留字:
3.变量命名规范
尽量使用有意义的单词作为变量名,也尽量不要与HTML、CSS中的关键字冲突。
有驼峰命名法和西班牙命名法
注:(以小写字母b,f,i,s开头表示类型,后接大写开头的有意义的单词)等等
六、JS的运算符
1.算术(数学)运算符,由算术运算符组成的式子叫算术表达式,结果是数值类型:
2.赋值运算符:
3.关系运算符,由关系运算符组成的式子叫关系表达式,关系表达式返回的结果是布尔类型:
4.逻辑运算符:
逻辑短路:
当逻辑运算符的前面的变量或者表达式(式子)能够决定整个表达式的结果时,则逻辑运算符后面的变量或者
表达式(式子),不再进行运算。
注: 运算符的优先级
5.JS运算符的优先级:
6.字符串连接符,字符串拼接表达式:
+ 运算符用于把文本值或字符串变量加起来(连接起来)。
例:
var str=“java”;
var str=str+”script”;
结果是 javascript
var str1=“苹果单价:”;
var str1=str1+5; //把数值类型与字符串类型连接,结果会得到字符串类型
结果是 苹果单价:5
七、JS变量的类型转换
1、JS是弱类型语言
1)变量声明时不需要指明类型
var age;
age=20;
2)变量的类型在使用中可变
age=“年龄:”+age;
注:JS变量的类型由其存放的数据类型确定
2、JS的类型转换
1)隐式(自动)转换,
注:不同的数据类型参与表达式运算过程时将会转换为同一类型进行运算
字符串与数值类型运算的隐式转换规则:
1.字符串加数字,数字就会转成字符串。
2.数字减字符串,字符串转成数字。如果字符串不是纯数字就会转成NaN。字符串减数字也一样。两个字符串相减也先转成数字。
3.乘,除,大于,小于跟减的转换也是一样。
2)显示(手动)转换
字符串转数值:
parseInt()、parseFloat()、Number()
数值转字符串:
toString()
注:NaN表示不是数字,但是仍是数值类型, not a number,NaN是Number类型。
3、 Number与parseInt和parseFloat的区别
1)、Number():看的是整体,只要字符串内的内容不是合法的数字,则结果为NaN;否则,就会正常转换为数字类型。
2)、parseInt()和parseFloat()的转换规则比较接近(类似);
从前朝后,如果第一个字符是非数字,那么,结果为NaN;如果第一个字符是数字:
1)、parseInt():如果遇到小数点或者其它非数字字符或结尾,那么就把前面的内容正常转换为数字
2)、parseFloat():如果遇到第二个小数点或者其它非数字字符或结尾,那么就把前面的内容正常转换为数字