1.JavaScript
1.1.简介
JavaScript是一种具有面向对象能力的、解释型的程序设计语言。更具体一点,它是基于对象和事件驱动并具有相对安全性的客户端脚本语言。它的主要目的是,验证发往服务器端的数据、增加Web互动、加强用户体验度等。
1.1.1.javascript组成:ECMAScript,DOM,BOM
ECMAScript定义的只是这门语言的基础,与Web浏览器没有依赖关系,而在基础语法上可以构建更完善的脚本语言。JavaScript的运行需要一定的环境,脱离了环境 JavaScript 代码是不能运行的,JavaScript只能够寄生在某个具体的环境中才能够工作。JavaScript 运行环境一般都由宿主环境和执行期环境共同构成,其中宿主环境是由外壳程序生成的,如Web浏览器就是一个外壳程序,它提供了一个可控制浏览器窗口的宿主环境。执行期环境则由嵌入到外壳程序中的JavaScript引擎(或称为JavaScript解释器)生成,在这个环境中JavaScript能够生成内置静态对象,初始化执行环境等。
Web浏览器自定义的DOM组件,以面向对象方式描述的文档模型。DOM定义了表示和修改文档所需的对象、这些对象的行为和属性以及这些对象之间的关系。DOM对象,是我们用传统的方法(Javascript)获得的对象。DOM属于浏览器,而不是JavaScript语言规范里的规定的核心内容。
前面的DOM是为了操作浏览器中的文档,而为了控制浏览器的行为和操作,浏览器还提供了BOM(浏览器对象模型)。
ECMAScript(基础语法)
JavaScript的核心语法ECMAScript——描述了该语言的语法和基本对象
DOM(文档对象模型)
文档对象模型(DOM)——描述了处理网页内容的方法和接口
BOM(浏览器对象模型)
浏览器对象模型(BOM)——描述了与浏览器进行交互的方法和接口
1.1.2.开发工具
.浏览器:Chrome
.开发工具:Hbuilder
.进入浏览器控制台 Console:F12 控制台的作用:console 对象代表浏览器的JavaScript控制台,用来运行JavaScript命令,常常用来显示网页运行时候的错误信息。Elements用来调试网页的html和css代码。
1.2.基本用法
JS需要和 HTML一起使用才有效果,我们可以通过直接或间接的方式将JS代码嵌入在 HTML页面中。
我们可以将JavaScript代码放在html文件中任何位置,但是我们一般放在网页的head或者body部分。由于页面的加载方式是从上往下依次加载的,而这个对我们放置的js代码运行是有影响的。
放在<head>部分,最常用的方式是在页面中head部分放置<script>元素,浏览器解析head 部分就会执行这个代码,然后才解析页面的其余部分.
放在<body>部分,JavaScript代码在网页读取到该语句的时候就会执行。
JS的三种使用方式:
1.行内JS
在HTML标签上直接写JS代码
2.内部JS
在script标签中写的js代码,script标签可以放在head标签中或body标签中(建议放在body标签最后)
3.外部JS
定义JS文件,通过script标签的scr属性引入对应的JS文件。
注:script标签设置了src属性,则在script双标签之间的JS代码不会生效。
2.基础语法
2.1.语句和注释
语句:
1.JS代码以一行为单位,代码从上往下执行,一行一条语句
2.语句不加分号结尾,如果一行定义多条语句,每句语句只会必须以分号结尾。(建议都加分号)
3.表达式不需要以分号结尾,如果加了分号则JavaScript引擎会当做语句执行,生成无用的语句。
JavaScript程序的执行单位为行(line),也就是一行一行地执行。一般情况下,每一行就是一个语句。语句(statement)是为了完成某种任务而进行的操作,语句以分号结尾,一个分号即表示一个语句结束。多个语句可以写在一行内(不建议这么写代码),但是一行写多条语句时,语句必须以分号结尾。
表达式不需要分号结尾。一旦在表达式后面添加分号,则JavaScript引擎就将表达式视为语句,这样会产生一些没有任何意义的语句。
注释:
1.JS代码注释 单行注释:用//起头;
多行注释:放在/*和*/之间。
2.html代码注释方式:<!-- -->
2.2.标识符和关键字
标识符就是一个名字,用来给变量和函数进行命名,有特定规则和规范
规则:
由Unicode字母、_、$、数字组成、中文组成
(1)不能以数字开头
(2)不能是关键字和保留字
(3)严格区分大小写
规范:
1.见名知意
2.驼峰命名或下划线规则
关键字(也称保留字):
声明变量时,不要使用关键字。
2.3.变量
变量即一个带名字的用来存储数据的空间,数据可以存储到变量中,也可以从变量中取出数据。
JS是一个弱类型语言,在类型中不需要指明数据类型,直接用var修饰符进行声明。
注:也可以不使用var修饰符,直接声明并赋值
2.3.1.变量声明方式赋值
1.先声明在赋值
2.声明并赋值
2.3.2.变量的注意点
1.如果变量只声明而未赋值,则显示undefinded
2.如果变量未声明就使用,则会报错
3.可以使用val同时声明多个变量
4.如果重新声明一个已存在的变量,是无效
5.如果重新声明一个已存在的变量并赋值,则会覆盖
6.JS是一种动态的弱类型语言,可以声明任意类型的变量
2.3.3.变量提升
JavaScript引擎的工作方式是先解析代码,获取所有被声明的变量,然后再一行一行地运行。这造成的结果,就是所有的变量的声明语句,都会被提升到代码的头部,这就叫做变量提升。
注意:变量提升只对var命令声明的变量有效,如果变量使用的不是var命令声明的,就不会发生变量提升。
2.4.数据类型
虽说JS是弱类型语言,变量没有类型,但数据本身是有类型的。针对不同的类型,我们可以进行不同的操作。
JavaScript中有6种数据类型,其中有五种简单的数据类型:Undefined、Null、布尔、数值和字符串。一种复杂数据类型Object。
数 值(Number):整数和小数(比如1和3.14)
字符串(String):字符组成的文本(比如"Hello World")
布尔值(Boolean):true(真)和 false(假)两个特定值
Undefined: 表示“未定义”或不存在,即此处目前没有任何值
Null: 表示空缺,即此处应该有一个值,但目前为空
对象(object)(引用):各种值组成的集合
1)、对象(object)(name:"zhangsan",age:"18"
2)、数组(array)[1,2,3]
3)、函数(function) function test()
2.4.1.undefined
undefined类型的值是undefined。
undefined 是一个表示"无"的原始值,表示值不存在。
出现undefined的常见情况:
(1)当一个变量只声明而未赋值,这个变量的值就是undefined
(2)当定义函数需要形参,调用函数未传递实参时,该参数值为undefined.
(3)函数没有返回值时,默认返回undefined。
2.4.2.NULL
null 类型是只有一个值的数据类型,即特殊的值 null。它表示空值,即该处的值现在为空,它表示一个空对象引用。
使用Null类型值时注意以下几点:
1)使用typeof操作符测试null返回object 字符串。
2) undefined派生自null,所以等值比较返回值是true。未初始化的变量和赋值为null的变量相等。
2.4.3.布尔类型
布尔类型有两个值:true、false。常用来做判断和循环的条件
2.4.4.数据型
数值型包含两种数值:整型和浮点型。
1)所有数字(整型和浮点型)都是以64位浮点数形式储存。所以,JS中1与1.0相等,而且1加上1.0得到的还是一个整数。浮点数最高精度是17位小数,由于浮点数运算时可能不精确,尽量不要使用浮点数做判断。
2)在存储数值型数据时自动将可以转化为整形的浮点数转化为整形。
2.4.5.字符串
使用'或””引起来,如:"hello',"good"。
使用加号'+'进行字符串的拼接,如:console.log('hello'+'everybody');
3.4.6.对象
对象是一组数据和功能的集合。
说明:
0:表示使用对象字面量方式定义的对象。空的大括号表示定义包含默认属性和方法的对象。
数组:var 数组名 = [];
对象:var 对象名 = {};
函数:
function 方法名(){
}
2.5.类型转换
2.5.1.自动类型转换
值 | 字符串 | 数字 | 布尔值 |
undefined | "undefined" | NaN | false |
null | "null" | 0 | false |
true | "true" | 1 | true |
false | "false" | 0 | false |
""(空字符串) | "" | 0 | false |
“1.5” | "1.5" | 1.5 | true |
"one" | "one" | NaN | true |
0 | "0" | 0 | false |
-0 | "0" | 0 | false |
NaN | "NaN" | NaN | false |
Infinity | "Infinity" | Infinity | true |
-Infinity | "-Infinity" | -Infinity | true |
1 | "1" | 1 | true |
1.转字符串:所有的值转字符串都是加引号
2.转布尔型:有值为true,无值为false (0为false,非0为true)
3.转数值型:空值是0,非空的数值型字符串能转换,非数值字符串转换为NaN
2.5.2.函数转换(String to Number)
JS 提供了 parselnt()和 parseFloat()两个全局转换函数。前者把值转换成整数,后者把值转换成浮点数。只有对String类型调用这些方法,这两个函数才能正确运行;对其他类型返回的都是NaN(Not a Number)。
parselnt()
在转换之前,首先会分析该字符串,判断位置为0处的字符,判断它是否是个有效数字,如果不是,则直接返回NaN,不再继续,如果是则继续,直到找到非字符。
parseFloat()
该方法与 parselnt( 方法的处理方式相似,从位置。开始查看每个字符,直到找到第一个非有效的字符为止,然后把该字 符之前的字符串转换成数字。不过,对于这个方法来说,第一个出现的小数点是有效字符。如果有两个小数点,第二个小数点将被看作无效的,parseFloat()方法会把这个小数点之前的字符串转换成数字。
注意:转换时会从值的第零个位置开始找有效数字,直到找到无效数字paresflaot在转化时会比parseInt多识别一个小数点。。
2.5.3.显示转换
几乎每个数对象都提供了toString()函数将内容转换为字符串形式,其中Number提供的toString()函数可以将数字转换为字符串。
Number 还提供了 toFixed()函数将根据小数点后指定位数将数字转为字符串,四舍五入
注意:值不能为null
JS为Number、Boolean、String对象提供了构造方法,用于强制转换其他类型的数据。此时操作的是整个数据,而不是部分。注意:可以转换null
最后一种强制类型转换方法String()是最简单的,因为它可把任何值转换成字符串。要执行这种强制类型转换,只需要调用作为参数传递进来的值的toString()方法,即把1转换成"1”,把true转换成"true”,把false转换成"false",依此类推。强制转换成字符串和调用toString()方法的唯一不同之处在于,对null或undefined值强制类型转换可以生成字符串而不引发错误.