文章目录
学习总结 JS
一、JS基础内容
1.JS代码按从上到下执行
2.控制浏览器弹出一个警告
alert(" ");
3.让计算机在页面中输出一个内容document.write( )可以向body中输出一个内容
4.向控制台输出一个内容
console.log( )
5.console.time( )开启计时器
6.console.timeEnd( )终止计时器
JS编写的位置
1.可以将js代码编写到外部js文件中,然后通过script标签引入
写到外部文件中可以在不同的页面中同时引用,也可以利用到浏览器的缓存机制
推荐使用的方式
2.可以将js代码编写到script标签
script标签一旦用于引入外部文件了,就不能在编写代码了,即使编写了浏览器也会忽略
如果需要则可以在创建一个新的script标签用于编写内部代码
可以将js代码编写到标签的onclick属性中当我们点击按钮时,js代码才会执行
虽然可以写在标签的属性中,但是他们属于结构与行为耦合,不方便维护,不推荐使用
二、基本语法、注释、变量、数据类型、进制
1.JS注释
/* */
多行注释,注释中的内容不会被执行,但是可以在源代码中查看
// 单行注释
2.注意:
1.JS中严格区分大小写
2.JS中每一条语句以分号(;)结尾;如果不写分号,浏览器会自动添加,但会消耗一些系统资源;而且有些时候,浏览器会加错分号,所以在开发中分号必须写
3.JS中会忽略多个空格和换行,所以我们可以利用空格和换行对代码进行格式化
3.字面量、变量
字面量
字面量都是不可改变的值
字面量都是可以直接使用,但是我们一般都不会直接使用字面量
变量
变量可以用来保存字面量,而且变量的值是可以任意改变的
变量更加方便我们使用,所以在开发中都是通过变量去保存一个字面量,而很少直接使用字面量
声明变量
在JS中使用var关键字来声明并赋值一个变量
var a=1;
输出变量
alert( );
输出字面量 字符串str
alert(”“)
标识符
在JS中所有的可以 由我们自主命名的都是可以称为标识符
例如:变量名、函数名、属性名都属于标识符
命名一个标识符时需要遵守如下的规则:
1.标识符中可以含有字母、数字、_、$
2.标识符不能以数字开头
3.标识符不能是ES中的关键字或保留字
4.标识符一般都采用驼峰命名发(首字母小写,每个单词的开头字母大写,其余字母小写)
4.数据类型
数据类型指的是 字面量的类型
在JS中一共有六种数据类型
String 字符串
Number 数值
Boolean 布尔值
Null 空值
Undefined 未定义
Object 对象
其中String Number Boolean Null Undefined 属于基本数据类型
而Object属于引用数据类型
1).String字符串
在JS中字符串需要使用引号引起来;使用双引号或单引号都可以,但是不要混着用;引号不能嵌套
在字符串中我们可以使用 \ 作为转义字符,
当表示一些特殊符号时可以使用 \ 进行转义
\" 表示”
\’ 表示’
\n 表示换行
\t 制表符
\\ 表示\
2).Number
在JS中所有的数值都是Number类型,包括整数和浮点数
JS中可以表示的数字的最大值
Number.MAX_VALUE 1.7976931348623157e+308
大于0的最小值
Number.MIN_VALUE 5e-324
可以使用一个运算符typeof,来检查一个变量的类型
语法**:typeof 变量**
console.log(typeof );
检查字符串时,会返回string
检查数值时,会返回number
如果使用Number表示的数字超过了最大值,则会返回一个
Infinity 表示正无穷
-Infinity 表示负无穷
使用typeof检查Infinity也会返回Number
NaN 是一个特殊的数字,表示Not A Number
使用typeof检查一个NaN也会返回number
在JS中整数的运算基本可以保证精确;如果使用JS进行浮点元素,可能得到一个不精确的结果,千万不要用JS进行对精确度要求比较高的运算
3).Boolean 布尔值
布尔值只有两个主要用来做逻辑判断
true真 false假
使用typeof检查一个布尔值时,会返回boolean
console.log(typeof );
Null
Null类型的值只有null
null这个值专门用来表示一个为空的对象
使用typeof检查一个null值时,会返回object
4).Undefined(未定义)
Undefined类型的值只有一个,就undefind
当声明一个变量,但是并不给变量赋值时,它的值就是undefined
当声明一个变量,但是并不给变量赋值时,它的值就是undefined
使用typeof检查一个undefined时也会返回undefined
5).强制类型转换
指将一个数据类型强制转换为其他的数据类型
类型转换主要指,将其他的数据类型,转换为String Number Boolean
将其他的数据类型转换为String
调用xxx的yyy()方法,就是xxx.yyy( )
方法一:
调用被转换数据类型的toString()方法;该方法不会影响到原变量,它会将转换的结果返回;但是注意:nul1和undefined这两个值没有toString;如果调用他们的方法,会报错
方法二:
调用String( )函数,并将被转换的的数据作为参数传递给函数
使用String()函数做强制类型转换时,对于Number和Boolean实际上就是调用的toString()方法;但是对于nu1l和undefined,就不会调用toString()方法;它会将 null 直接转换为“nu1l",将undefined直接转换为“undefined”
将其他类型转换为Number
转换方式一:使用Number( )函数
字符串–>数字
1.如果是纯数字字符串,则直接将其转换为数字
2.如果字符串中有非数字的内容,则转换为NaN
3.如果有字符串是一个空串或者是一个全是空格的字符串,则转换为0
布尔–>数字
true 转成1
false 转成0
null–>数字
null 转成0
undefined–>数字
undefined 转换成NaN
转换方式二:
专门用来对付字符串
parseInt( ) 把一个字符串转换为一个整数
parseFloat( ) 把一个字符串转换为一个浮点数
调用parseInt( )函数将a转换为Number
parseInt( )可以将一个字符串中的有效的整数内容取出来
(parseFloat( )作用和parseInt( )类似,不同的是它可以获得有效的小数)
如果对非String使用parseInt()或parseFloat();它会先将其转换为String,然后在操作
调用Boolean( )函数将a转换为布尔值
数字–>布尔
除了0和NaN,其余都是true
字符串–>布尔
除了空串,其余都是true
null和undefined都会转换为false
对象也会转换为true
方式二:(隐式类型转换)
为任意的数据类型做两次非运算,即可将其转换为布尔值
6).基本数据类型与引用数据类型
JS中的变量都是保存到栈内存中的
基本数据类型的值直接在栈内存中存储,值与值之间是独立存在,修改一个变量不会影响其他的变量
对象是保存到堆内存中的,每创建一个新的对象,就会在堆内存中开辟出一个新的空间,而变量保存的是对象的内存地址(对象的引用),如果两个变量保存的是同一个对象引用,当一个通过一个变量修改属性时,另一个也会受到影响
当比较两个基本数据类型的值时,就是比较值。
而比较两个引用数据类型时,它是比较的对象的内存地址,如果两个对象是一摸一样的,但是地址不同,它也会返回false
5.其他进制的数字
在JS中,如果需要表示16进制的数字,则需要以0x开头
如果需要表示8进制的数字,则需要以0开头
如果要表示2进制的数字,则需要以0b开头(不是所有浏览器都支持)
三、对象 Object
对象属于一种复合的数据类型,在对象中可以保存多个不同数据类型的属性。
1.对象的分类:
(1)内建对象
由ES标准中定义的对象,在任何的ES的实现中都可以使用
比如: Math String Number Boolean Function Object …
(2)宿主对象
由JS的运行环境提供的对象,目前来讲主要指由浏览器提供的对象
比如 BOM DOM
(3)自定义对象
由开发人员自己创建的对象
2.创建对象
使用new关键字调用的函数,是构造函数constructor
构造函数是专门用来创建对象的函数
使用typeof检查一个对象时,会返回object
使用工厂方法创建对象
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script type="text/javascript">
function Person(name,age,gender){
this.name=name;
this.age = age;
this.gender=gender;
}
Person.prototype.toString = function(){
return "person[name="+this.name+",age="+this.age+",age="+this.age+",gender"+this.gender+"]"
};
var per = new Person("孙悟空",1800,"男");
var per2 = new Person("玉兔精",16,"女");
var per3 = new Person("白骨精",18,"女");
var result = per.toString();
console.log(per);
</script>
</head>
<body>
</body>
</html>
3.属性
在对象中保存的值称为属性
函数也可以称为对象的属性(如果一个函数作为一个对象的属性保存,那么我们称这个函数时这个对象的方法,调用函数就说调用对象的方法)
属性名
不强制要求遵守标识符的规范,如果要使用特殊的属性名,不能采用.的方式来操作,需要用另一种方式:语法:对象[“属性名”];读取时也采用这种方式
使用[ ]这种形式去操作属性更加灵活,在[ ]中可以直接传递一个变量,这样变量值是多少就会读取那个属性
属性值
JS对象的属性值,可以是任意的数据类型,也可以是一个函数
hasOwnProperty( )
可以使用对象的hasOwnProperty()来检查对象自身中是否含有该属性
向对象添加属性
语法: 对象.属性名= 属性值;
读取对象中的属性值
语法:对象.属性名
(如果读取的对象中没有的属性,不会报错而是会返回undefined)
修改对象的属性值
语法:对象.属性名=新值
删除对象的属性
语法:delete 对象.属性名
枚举对象中的属性
使用for . . . in 语句
语法:for(var 变量 in 对象){
}
for . . . in语句 对象中有几个属性,循环体就会执行几次,每次执行时,会将对象中的一个属性的名字赋值给变量
4.对象字面量
使用对象字面量,可以在创建对象时,直接指定对象中的属性
语法:{
属性名:属性值,
属性名:属性值,
. . . .
}
5.in 运算符
通过该运算符检查一个对象中是否含有指定的属性,如果有则返回true,没有则返回false
语法:“属性名” in 对象
属性名和属性值是一组一组的名值对结构,名与值之间用:连接;多个名值对之间用,隔开;如果一个属性之后没有其他的属性了,就不写。
函数
函数也是一个对像
函数可以封装一些功能(代码),在需要时可以执行这些功能(代码)
函数中可以保存一些代码在需要的时候调用
使用typeof检查一个函数对象时,会返回function
在实际开发中很少使用构造函数来创建一个函数对象
{
创建一个函数对象
可以将要封装的代码以字符串的形式传递给构造函数
var fun = new Function(“console.log('Hello 这是我的第一个函数’);”);
封装到函数中的代码不会立即执行,函数中的代码会在函数调用的时候执行
调用函数
语法:函数对象()
当调用函数时,函数中封装的代码会按照顺序执行
}
1.创建函数
使用函数声明创建一个函数
语法:
function 函数名[形参1,形参2,. . .形参N){
语句 . . .
}
使用函数表达式来创建一个函数
var 函数名 = function([形参1,形参2 . . . 形参N]){
语句 . . . .
}
2.参数
调用函数时解析器不会检查实参的类型,
所以要注意,是否有可能会接收到非法的参数,如果有可能则需要对参数进行类型的检查
函数的实参可以是任意数据类型
调用函数时,解析器也不会检查实参的数量,多余实参不会被赋值
如果实参的数量少于形参的数量,则没有对应实参的形参将是undefined
实参
实参可以是任意数据类型,也可以是一个对象,当参数过多时可以将参数封装到一个对象中
实参可以是一个对象也可以是一个函数
注意:
sayhello( ) 调用函数,相当于使用的函数的返回值
sayhello 函数对象,相当于直接使用函数对象
3.函数返回值
可以使用 return 来设置函数的返回值
语法:
return 值
return后的值将会会作为函数的执行结果返回,可以定义一个变量,来接收该结果
在函数中return后的语句都不会执行
如果return后的语句后不跟任何值就相当于返回一个undefined,如果函数不写return,则也会返回undefined
调用函数
function sum(a,b,c){
var d=a+b+c;
return d;
}
var result = sum(4,5,6);
console.log("result="+result);
变量result的值就是函数执行的结果
函数返回什么result的值就是什么
返回值类型
返回值可以是任意的数据类型,也可以是一个对象,也可以是一个函数
4.立即执行函数
函数定义完,立即被调用,这种函数叫做立即执行函数
立即执行函数往往只会执行一次
5.构造函数
创建一个构造函数,专门用来创建Person对象的
构造函数就是一个普通的函数,创建方式和普通函数没有区别,
不同的是构造函数习惯上首字母大写
构造函数和普通函数的区别就是调用方式的不同
普通函数是直接调用,而构造函数需要使用new关键字来调用
构造函数的执行流程
1.立刻创建一个新的对象
2.将新建的对象设置为函数中的this
3.逐行执行函数中的代码
4.将新的对象作为返回值返回
使用用同一个构造函数创建的对象称为一类对象,我们称为一类对象,也将一个构造函数称为一个类;我们将通过一个构造函数创建的对象,称为是该类的实例
使用instanceof可以检查一个对象是否是一个类的实例
语法:
对象 instanceof 构造函数;如果是,则返回true,否则返回false
console.log(per instanceof Person);
console.log(per2);
console.log(per3);
任何对象和Object做instanceof检查时返回都是true
创建一个Person构造函数
在Person构造函数中,为每一个对象都添加了一个sayName方法,目前我们的方法是在构造函数内部创建的,也就是构造函数每执行一次就会创建一个新的sayName方法,也是所有实例的sayName都是唯一的。这样就导致了构造函数执行一次就会创建一个新的方法,执行10000次就会创建10000个新的方法,而10000个方法都是一摸一样的,这是完全没有必要的,可以使所有的对象共享同一个方法
function Person(name,age,gender){
this.name=name;
this.age = age;
this.gender=gender;
this.sayName = fun;
}
function fun (){
alert("Hello,大家好,我是"+this.name);
}
var per = new Person("孙悟空",1800,"男");
var per2 = new Person("玉兔精",16,"女");
var per3 = new Person("白骨精",18,"女");
per.sayName();
per2.sayName();
per3.sayName();
console.log(per);
console.log(per2);
console.log(per3);
将sayName方法在全局作用域中定义;将函数定义在全局作用域,污染了全局作用域的命名空间;而且定义在全局作用域中也很不安全
6.原型prototype
们所创建的每一个函数,解析器都会向函数中添加一个属性prototype这个属性对应着一个对象,这个对象就是我们所谓的原型对象
这个属性对应着一个对象,这个对象就是我们所谓的原型对象
如果函数作为普通函数调用prototype没有任何作用;当函数以构造函数的形式调用时,它所创建的对象中都会有一个隐含的属性,指向该构造函数的原型对象,我们可以通过__proto__来访问该属性
原型对象就相当于一个公共的区域,所有同一个类的实例都可以访问到这个原型对象,我们可以将对象中共有的内容,统一设置到原型对象中
当我们访问对象的一个属性或方法时,它会先在对象自身中寻找,如果有则直接使用,如果没有则会去原型对象中寻找,如果找到则直接使用
以后我们创建构造函数时,可以将这些对象共有的属性和方法,统一添加到构造函数的原型对象中,这样不用分别为每一个对象添加,也不会影响到全局作用域,就可以使每个对象都具有这些属性和方法了
Person.prototype.sayName = function(){
alert("Hello大家好,我是"+this.name);
}
原型对象也是对象,所以它也有原型,当我们使用一个对象的属性或方法时,会现在自身中寻找,自身中如果有,则直接使用,如果没有则去原型对象中寻找,如果原型对象中有,则使用,如果没有则去原型的原型中寻找,Object对象的原型没有原型,如果在Object中依然没有找到,则返回undefined
四、作用域
作用域指一个变量的作用的范围
在JS中一共有两种作用域:
1.全局作用域
直接编写在script标签中的JS代码,都在全局作用域
全局作用域在页面打开时创建,在页面关闭时销毁
在全局作用域中有一个全局对象window,
它代表的是一个浏览器的窗口,它由浏览器创建,我们可以直接使用
在全局作用域中:创建的变量都会作为window对象的属性保存
全局作用域中的变量都是全局变量,在页面的任意的部分都可以访问的到
2.函数作用域
调用函数时创建函数作用域,函数执行完毕以后,函数作用域销毁
每调用一次函数就会创建一个新的函数作用域,他们之间是互相独立的
在函数作用域中可以访问到全局作用域的变量
当在函数作用域操作一个变量时,它会先在自身作用域中寻找,如果有就直接使用,如果没有则向上一级作用域中寻找,直到找到全局作用域,如果全局作用域没有则会报错ReferenceError
在函数中要访问全局变量可以使用window对象
在函数作用域也有声明提前的特性,使用var关键字声明的变量,会在函数中所有的代码执行之前被声明,函数声明也会在函数中所有的代码执行之前执行
3.注意
1.在函数中,不适用var声明的变量都会成为全局变量
2.定义形参就相当于在函数作用域中声明了变量
4.变量的声明提前
使用var关键字声明的变量,会在所有代码执行之前被声明(但不会被赋值);但是如果声明变量时不使用var关键字,则变量不会被声明提前
5.函数的声明提前
使用函数声明形式创建的函数 function 函数( ){ }
它会在所有的代码执行之前就被创建,所以我们可以在函数声明前来调用函数
使用函数表达式创建的函数,不会被声明提前,所以不能在声明前调用
五、事件
事件,就是文档或浏览器窗口中发生的一些特定的交互瞬间。
JavaScript 与HTML 之间的交互是通过事件实现的。
对于Web应用来说,有下面这些代表性的事件:点击某个元素、将鼠标移动至某个
元素上方、按下键盘上某个键,等等。
我们可以在事件对应的属性中设置一些js代码,这样当事件被触发时,这些代码将会执行
这种写法我们称为结构和行为耦合,不方便维护,不推荐使用
可以为对应事件绑定处理函数的形式来响应事件,这样当事件被触发时,其对应的函数将会被调用
六、运算符
运算符也叫操作符
通过运算符可以对一个或多个值进行运算,并获取运算结果
比如:typeof就是运算符,可以来获得一个值的类型,它会将该值的类型以字符串的形式返回 例如:number string boolean undefined object
1.算术运算符
当对非Number类型的值进行运算时,会将这些值转换为Number然后在运算;任何值与NaN做运算都得NaN
+ —— 可以对两个值进行加法运算,并将结果返回。
如果对两个字符串进行加法运算,则会做拼串,会将两个字符串拼接为一个字符串,并返回
任何的值和字符串做加法运算,都会先转换为字符串,然后再和字符串做拼串的操作
我们可以利用这一特点,来将一个任意的数据类型转换为String,我们只需要为任意的数据类型+一个"" 即可将其转换为String,这是一种隐式的类型转换
-
*
/
任何值做 - * /运算时都会自动转换为Number
我们可以利用这一特点做隐式的类型转换
可以通过为一个值-0 *1 /1来将其转换为Number
原理和Number()函数一样,使用起来更加简单
%
2.一元运算符
只需要一个运算符
+ 正号
- 负号 对数字进行负号的取反
对于非Number类型的值,它会将先转换为Number,然后在运算,可以对一个其他的数据类型使用+,来将其转换为number,它的原理和Number()函数一样
3.自增自减
自增++
过自增可以使变量在自身的基础上增加1
对于一个变量自增以后,原变量的值会立即自增1
自增分成两种:后++(a++)和前++(++a)
无论是a++ 还是++a,都会立即使原变量的值自增1
不同的是a++ 和++a的值不同
a++的值等于原量的值(自增前的值)
++a的值等于新值(自增后的值)
自减
通过自减可以使变量在自身的基础上减1
自减分成两种:后 – (a – )和前 – ( – a)
无论是a – 还是 – a 都会立即使原变量的值自减1
不同的是a – 和 – a的值不同
a – 是变量的原值(自减前的值)
– a 是变量的新值(自减以后的值)
4.逻辑运算符(三种)
!非
可以用来对一个值进行非运算,所谓非运算就是值对一个布尔值进行取反操作,true变false,false变true; 如果对一个值进行两次取反,它不会变化; 如果对非布尔值进行元素,则会将其转换为布尔值,然后再取反;所以我们可以利用该特点,来将一个其他的数据类型转换为布尔值;可以为一个任意数据类型取两次反,来将其转换为布尔值,原理和Boolean( )函数一样
&& 与
&&可以对符号两侧的值进行与运算并返回结果
运算规则:
两个值中只要有一个true,就返回true
如果两个值都为false,才返回false
JS中的“或”属于短路的或,如果第一个值为true,则不会检查第二个值
如果第一个值为true,则直接返回第一个值;如果第一个值为false,则返回第二个值
5.赋值运算符
=
+=
-=
*=
/=
%=
6.关系运算符
比较两个值之间的关系,如果关系成立它会返回true,如果关系不成立则返回false
>
>=
<
<=
非数值类情况
对于非数值进行比较时,会将其转换为数字然后在比较
如果符号两侧的值都是字符串时,不会将其转换为数字进行比较,而会分别比较字符串中字符的Uticode编码
任何值和NaNcy做任何比较都是false
比较两个字符串时,比较的是字符串的字符编码,比较字符编码时是一位一位进行比较如果比较的两个字符串型的数字,可能会得到不可预期的结果
注意:在比较两个字符串型的数字时,一定一定一定要转型
7.Uticode编码
在字符串中使用转义字符输入Unicode编码
\u四位编码;十六进制
在网页中使用Unicode编码
&#编码;这里的编码需要的是10进制
8.相等运算符
比较两个值是否相等,相等返回true,不相等返回false
==
如果类型不同则会自动进行类型转换
undefined 衍生自 null,所以这两个值做相等判断时,会返回true
NaN不和任何值相等,包括他本身;可以通过isNaN()函数来判断一个值是否是NaN
!= 不相等
不相等用来判断两个值是否不相等,如果不相等返回true,否则返回false
不相等也会对变量进行自动的类型转换,如果转换后相等它也会返回false
=== 全等
用来判断两个值是全等,它和相等类似,不同的是它不会自动转换类型
如果两个值的类型不同,直接返回false
!== 不全等
用来判断两个值是否不全等,它和相等类似,不同的是它不会自动转换类型
如果两个值的类型不同,直接返回true
9.条件运算符(三元运算符)
语句:
条件表达式?语句1:语句2;
执行流程:条件运算符在执行时,首先对条件表达式进行求值,
如果该值为true,则执行语句1,并返回执行结果
如果该值为false,则执行语句2,并返回执行结果
10.,运算符
使用,可以分割多个语句,一般可以在声明多个变量时使用,可以声明多个变量并赋值
11.运算符的优先级
不需要记忆,遇到不清楚的用()改变优先级
七、语句
在JS中可以使用{ }来为语句进行分组
同一个{ }中的语句我们称为是一组语句,它们要么都执行要么都不执行
1.流程控制语句
JS中的程序是从上到下一行一行执行的
通过流程控制语句可以控制程序执行流程,
使程序可以根据一定的条件来选择执行
2.语句的分类:
1.条件判断语句
2.条件分支语句
3.循环语句
3.条件判断语句(if语句)
使用条件判断语句可以在执行某个语句之前进行判断,如果条件成立才会执行语句,条件不成立则语句不执行。
语法一:
if(条件表达式)
语句
if语句在执行时,会先对条件表达式进行求值判断,如果条件表达式的值为true,则执行if后的语句,如果条件表达式的值为false,则不会执行if后的语句。
语法二:
if(条件表达式){
语句1 . . . .
}else {
语句2 . . . .
}
语法三:
if(条件表达式){
语句 . . .
}else if(条件表达式){
语句 . . .
}else if(条件表达式){
语句 . . .
}else{
语句 . . .
}
4.补充:prompt
可以弹出一个提示框,该提示框中 会带有一个文本框,用户可以在文本框中输入一段内容,该函数需要一个字符串作为参数,该字符串将会作为提示框中的提示文字,用户输入的内容将会作为函数的返回值返回,可以定义一个变量来接收该内容
var score = prompt("请输入小明的期末成绩:");
5.条件分支语句
条件分支语句也叫switch语句
语法:
switch(条件表达式){
case 表达式:
语句 . . .
break;
case 表达式:
语句 ...
break;
default:
语句 ...
break;
}
执行流程:
switch … case … 语句
在执行时会依次将case后的表达式的值和switch后的条件表达式的值进行全等比较,
如果比较结果为true,则从当前case处开始执行代码。
如果比较结果为false,则继续向下比较
如果比较结果都为false,则只执行default后的语句
6.循环语句
通过循环语句可以反复执行一段代码多次
while循环
语法:
while(条件表达式){
语句 . . .
}
while语句在执行时,先对条件表达式进行求值判断,如果值为true,则执行循环体,循环体执行完毕以后,继续对表达式进行判断,如果为true,则继续执行循环体,以此类推
如果结果为false,则终止循环
创建一个循环,往往需要三个步骤
1.创初始化一个变量
2.在循环中设置一个条件表达式
3.定义一个更新表达式,每次更新初始化变量
do . . . while循环
语法:
do{
语句 . . .
}while(条件表达式)
while&do . . .while区别
实际上这两个语句功能类似,不同的是while是先判断后执行,而do … while会先执行后判断,do … while可以保证循环体至少执行一次,而while不能
7.for循环
语法:
for(初始化表达式;条件表达式;更新表达式){
语句 . . .
}
break&continue
不能在if语句中使用break和continue
break关键字可以用来退出switch或循环语句
break关键字,会立即终止离他最近的那个循环语句
可以为循环语句创建一个1abe1,来标识当前的循环
label:循环语句
使用break语句时,可以在break后跟着一个labe1,这样break将会结束指定的循环,而不是最近的
continue
continue关键字可以用来跳过当次循环
同样continue也是默认只会对离他最近的循环循环起作用
八、this
解析器在调用函数每次都会向函数内部传递进一个隐含的参数,这个隐含的参数就是this,this指向的是一个对象,这个对象我们称为函数执行的上下文对象,根据函数的调用方式的不同,this会指向不同的对象
1.以函数的形式调用时,this永远都是window
2.以方法的形式调用时,this就是调用方法的那个对象
3.以构造函数的形式调用时,this就是新创建的那个对象
九、toString
当我们直接在页面中打印一个对象时,事件上是输出的对象的toString()方法的返回值
如果我们希望在输出对象时不输出[object Object],可以为对象添加一个toString()方法
十、垃圾回收
就像人生活的时间长了会产生垃圾一样,程序运行过程中也会产生垃圾,这些垃圾积攒过多以后,会导致程序运行的速度过慢,所以我们需要一个垃圾回收的机制,来处理程序运行过程中产生垃圾
当一个对象没有任何的变量或属性对它进行引用,此时我们将永远无法操作该对象,此时这种对象就是一个垃圾,这种对象过多会占用大量的内存空间,导致程序运行变慢,所以这种垃圾必须进行清理。
在JS中拥有自动的垃圾回收机制,会自动将这些垃圾对象从内存中销毁,我们不需要也不能进行垃圾回收的操作
我们需要做的只是要将不再使用的对象设置null即可
正则表达式
邮件规则
1.前边可以是xxxx乱七八糟
2.跟着一个@
3.后边可以是xxxx乱七八糟
4. .com获取其他的乱七八糟
正则表达式
正则表达式用于定义一些字符串的规则,计算机可以根据正则表达式,来检查一个字符串是否符合规则,获取将字符串中符合规则的内容提取出来
语法:
var 变量= new RegExp(“正则表达式”,“匹配模式”);
使用typeof检查正则对象,会返回object
判断正则表达式的方法:
test( )
使用这个方法可以用来检查一个字符串是否符合正则表达式的规则,如果符合则返回true,否则返回false
var reg = new RegExp(“a”);这个正则表达式可以来检查一个字符串中是否含有a
在构造函数中可以传递一个匹配模式作为第二个参数,可以是
i 忽略大小写
g 全局匹配模式
使用字面量来创建正则表达式
语法:var 变量=/正则表达式/匹配模式
使用字面量的方式创建更加简单
使用构造函数创建更加灵活
使用 | 表示或者的意思
[ ]里的内容也是或的关系( eg:[ab]==a|b;[ a-z])
[ ^ ]除了
量词:通过量词可以设置一个内容出现的次数,只对它前边的一个内容起作用
{n}正好出现n次
{m,n}出现m~n次
{m,}m次以上
+ ——表示至少一个
*——0个或多个相当于{0}
?——0个或一个,相当于{0,1}
^ ——表示开头
$ ——表示结尾
如果在正则表达式中同时使用^ $则要求字符串必须完全符合正则表达式
检查一个字符串中是否含有.
. 表示任意字符
在正则表达式中使用\作为转义字符
\ . 来表示 .
\ \ 表示 \
注意:使用构造函数时,由于它的参数是一个字符串,而\是字符串中转义字符,
如果要使用\则需要使用\\来代替
\w 任意字母、数字、_ [A-z0-9_]
\W 除了字母、数字、__[^A-z0-9_]
\d 任意的数字[0-9]
\D 除了数字[^0-9]
\s 空格
\S 除了空格
\b 单词边界
\B 除了单词边界
reg = /child/;
console.log(reg.test("Hello children"));
var str = " hello ";
console.log(str);
//去掉字符串中前后的空格
//去除空格用""来替代
str = str.replace(/\s/g,"");
//去除开头的空格
str = str.replace(/^\s*/,"");
//去除结尾的空格
str = str.replace(/\s*$/,"");
///^\s*|\s*$/g匹配开头和结尾的空格
str = str.replace(/^\s*|\s*$/g,"");
console.log(str);
电子邮件
hello | .nihao@ | abc | .com.cn |
---|---|---|---|
任意字母数字下划线 | .任意字母数字下划线 @ | 任意字母数字 | .任意字母(2-5位) |
\w{3, } | (\.\w+)* @ | [A-z0-9]+ | (\. [A-z] {2,5}) {1, 2} |
文档加载
浏览器在加载一个页面时,是按照自上向下的顺序加载的,读取到一行就运行一行,如果将script标签写到页面的上边,在代码执行时,页面还没有加载
onload事件会在整个页面加载完成之后才触发
为window绑定一个onload事件;该事件对应的响应函数将会在页面加载完成之后执行,这样可以确保我们的代码执行时所有的DOM对象已经加载完毕了
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script type="text/javascript">
window.onload = function(){
var btn = document.getElementById("btn");
btn.onclick = function(){
alert("hello");
};
}
</script>
</head>
<body>
<button id="btn">我是一个按钮</button>
<script type="text/javascript">
</script>
</body>
</html>
DOM
Document Object Model文档对象模型
文档 文档表示的就是整个的HTML网页文档
对象 对象表示将网页中的每一个部分都转换为了一个对象。
模型 使用模型来表示对象之间的关系,这样方便我们获取对象。
节点Node
是构成我们网页的最基本的组成部分,网页中的每一个部分都可以称为是一个节点。
比如:html标签、属性、文本、注释、整个文档等都是一个节点。
常用节点:
文档节点:整个HTML文档
浏览器已经为我们提供文档节点 对象这个对象是window属性;可以在页面中直接使用,文档节点代表的是整个网页
元系节点:HTML文档中的HTML标签
属性节点:元素的属性
文本节点:HTML标签中的文本内容
节点的属性
获取元素节点
- getElementById( ) 通过id属性获取一个元素节点对象
- getElementsByTagName( ) 通过标签名获取一组元素节点对象
这个方法会给我们返回一个类数组对象,所有查询到的元素都会封装到对象中 - getElementsByName( ) 通过name属性获取一组元素节点对象
innnerHTML 通过这个属性可以获取到元素内部的html代码
如果需要读取元素节点属性,直接使用 元素·属性名
例子:元素.id 元素.name 元素.value
注意:class属性不能采用这种方式,读取class属性时需要使用 元素.className
下周计划
继续按照计划学习,复习本周学习的知识,上手练一练,准备本阶段考核;继续复习高数,复习C语言,每周三道算法题,跟着小组计划走。
生活碎片
最近还真是如履薄冰了