学习总结第九周(JS基础 字面量~正则)

文章目录

字面量和变量

1)字面量

一些不可改变的值 如1,2,3,4,5
字面量可以直接使用,但一般不会使用

2)变量

变量可以用来保存字面量,而且变量的值可以任意改变

3)声明变量

在js中一般用var关键字来声明一个变量

标识符

在js中所有可以由我们自主命名事物都可以称为是标识符
eg:变量名 函数名 属性名
命名规则;
● 标识符可以含有字母 数字 下划线 $
● 标识符不能以数字开头
● 标识符不能是ES中的关键字或保留字
● 一般采用驼峰命名法
js底层保存标识符实际上采用的Unicode编码 理论上 所有utf-8的内容都可以作为标识符

在这里插入图片描述

数据类型

字符串String 数值 Number 布尔值 Boolean 空值Null
未定义Undefined Object 对象

前五种为基本数据类型 Object为引用数据类型

1.字符串

在js中用引号引起来,双引号和单引号都行

var str="hello"

但是不能双套双 单套单

var str='我说:"今天天气不错"'
document.write(str);

//结果  我说:"今天天气不错"

在字符串中可以使用转义字符,当表示一些特殊符号时可以转义为普通符号

var str="我说:\"今天天气不错\""
document.write(str);
//结果  我说:"今天天气不错"

2.Number

在js中 所有数值都是Number类型
包括整数和浮点数(小数)
可以使用typeof检查变量类型
语法: typeof 变量
js中
Number.MAX_VALUE表示数字的最大值 1.7976931348623157e+308
Number.MIN_VALUE 表示大于0的最小值 5e-324
如果数值超过最大值,则会返回一个Infinity表示正无穷
NaN 是一个特殊数字,表示Not A Number

(1)运算

整数运算基本可以保证精确
如果使用js进行浮点运算,可能得到一个不精确的值

3.Null&Undefined

(1)Null

该类型只有一个值:null
专门用来表示一个为空的对象
使用typeof检查一个Null值时 会返回object

(2)Undefined

该类型只有一个值 undefined
当声明一个变量,但是并不给变量赋值时,它的值就是undefined
使用typeof检查时,返回的值是 undefined

4.Object

强制类型转换

主要指将其他类型的数据转换为 String Number Boolean

1.将其他类型转换为String

1)法一:调用被转换数据类型的toString()方法

该方法不会影响原来的变量
会将转换的结果返回

注意:null和undefined没有toString ()方法

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script type="text/javascript">
			var a=123;
			var b=a.toString();
			console.log(typeof a);
			console.log(typeof b);
			console.log(a);
		</script>
	</head>
	<body>
	</body>
</html>
//结果
/* number
 * string
 * 123
 */

法二:调用String()函数

在这里插入图片描述

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script type="text/javascript">
			var a=123;
			var b=String(a);
			console.log(typeof a);
			console.log(typeof b);
			console.log(a);
		</script>
	</head>
	<body>
	</body>
</html>
//结果
/* number
 * string
 * 123
 */

2.将其他数据类型转换为Number

1.法一 使用Number()函数

在这里插入图片描述
在这里插入图片描述

2)法二 parseInt() parseFloat()

在这里插入图片描述
parseInt()可以将一个字符串中有效的整数内容取出来,然后转换为Number
遇到其他符号直接停止
parseFloat()作用和parseInt()类似,不同的是它可以获取有效的小数
如果对非String使用parseInt()或parseFloat(),它会先将其转换为String,然后再操作

ps:可以在parseInt()中传递第二个参数,来指定数字进制,两个参数之间用逗号隔开

3.其他转Boolean

在这里插入图片描述

运算符

当对非Number类型的值进行运算时,会将这些值转换为Number,然后再运算
任何值和NaN 运算都会得到NaN

1.算术运算符

1)+

对两个字符串进行加法运算,则会进行字符串的拼接
任何值和字符串相加都会先转换为字符串,然后再和字符串做拼接
注意:相减等其他运算都是转换为数值进行运算,因此可以通过-0等来将字符串转换为Number类型
可以使用 数据类型+“” 来转换为String类型
这是一种隐式转换,浏览器自动完成,实际上也是调用String()函数


从左往右运算
第一个:数值相加再拼串
第二个:字符串和“2”拼接,再和“3”拼接

2)一元运算符

在这里插入图片描述

3)自增减

在这里插入图片描述

2.逻辑运算符

1)!

在这里插入图片描述

2)&&

在这里插入图片描述

3)||

在这里插入图片描述

4)非布尔的与或运算

在这里插入图片描述

3.关系运算符

在这里插入图片描述
在这里插入图片描述

4.Unicode编码的使用

在字符串中使用转义字符输入Unicode编码 编码是十六进制
\u四位编码
在网页中 这里的编码需要10进制
&#编码

5.相等运算符

在这里插入图片描述
在这里插入图片描述注意:null和0做相等运算转换的是false

undefined衍生自null,两者比较为true
NaN不和任何值相等,包括它本身
可以通过isNaN()函数判断是否是NaN

6.条件运算符

在这里插入图片描述

7.运算符优先级

在这里插入图片描述

语句

1.分类

● 条件判断语句
● 条件分支语句
● 循环语句

2.if语句

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

3.switch语句

在这里插入图片描述
在这里插入图片描述

4.while语句

先判断后执行
在这里插入图片描述
创建循环的三个步骤
1.初始化变量
2…在循环中设置一个条件表达式
3.定义一个更新表达式,每次初始化变量

5.do while

先执行后判断在这里插入图片描述

6.for

在这里插入图片描述

对象

1.简介

属于一种复合的数据类型,在对象中可以保存多个不同数据类型的属性

2.分类

1)内建对象

由ES标准定义的对象,在任何的ES实现中可直接使用
如Math String Number Boolean Function Object…

2)宿主对象

由JS的运行环境提供的对象,目前来讲主要指由浏览器提供的对象
比如BOM DOM

3)自建对象

由开发人员自己创建的对象

2.基本操作

1)创建对象

在这里插入图片描述

2)向对象中添加属性

在这里插入图片描述

3)读取属性

在这里插入图片描述

4)修改属性

在这里插入图片描述

5)删除属性

在这里插入图片描述

3.属性名和属性值

1)属性名

属性名不强制要求遵守标识符的规范
对象.属性名=属性值;
如果要使用特殊的属性名(如123 等),不能采用 . 的方式来操作
读取时也要采用该方式
另一种方式: 对象[“属性名”]=属性值;

在这里插入图片描述

2)属性值

可以是任意数据类型,可以是对象也可以是函数

3)in运算符 检查属性是否存在

使用in检查对象对象中是否含有某个属性时,如果对象中没有但是原型中有 ,也会返回true

4)hasOwnProperty 检查属性

可以使用hasOwnProperty ()来检查对象自身中是否含有该属性
使用该方法只有当对象自身含有该属性时,才会返回true

4.基本数据类型和引用数据类型

1)基本数据类型

基本数据类型会直接在栈内存中存储
值与值之间独立存在,修改一个变量不会影响其他的变量

2)引用数据类型

对象保存在堆内存中的,每创建一个新的对象,就会在堆内存中开辟新空间
而变量保存的是对象的内存地址(对象的引用),
如果两个变量指向同一个地址,当一个变量修改属性时,另一个变量的属性值也会修改

3)注意事项

5.对象字面量

使用对象字面量来创建对象
var 对象名={}
作用与 var 对象名=new Object() 一样

优势:在这里插入图片描述
在这里插入图片描述

函数

1.简介

在这里插入图片描述

2.创建,调用函数对象(不常用)

在这里插入图片描述

3.使用函数声明来创建函数

语法:

function 函数名 (【形参1,形参2.....】)
       {
              语句;
       }

4.使用函数表达式来创建函数

语法:

var fun3=function()
{
  语句;
};

注意:使用函数表达式来创建函数,由于可以看做赋值语句,需在最后加加一个分号

5.函数的参数

在这里插入图片描述

function sum(a,b){
   var a=1;
   var b=2;
   console.log(a+b);
}

在调用函数时,可以在()中指定实参
实参将会赋值给函数中对应的形参

注意:
● 调用函数时,解析器不会检查实参的类型,所以要注意,是否有可能会接收到非法的参数,如果有可能需要对参数进行类型的检查
● 调用函数时,解析器也不会检查实参的数量
多余实参不会被赋值
● 如果实参数量少于形参的数量,则没有对应实参的形参是undefined
● 函数的实参可以是任意数据类型

6.函数返回值

function sum(a,b,c)
{
  var d=a+b+c;
  return d;
}
var result=sum(4,7,8)
console.log("result="+result);
//结果:  result=19

在函数中return后的语句不会执行
如果return语句后不跟任何相当于返回一个undefined
如果函数中不写return,也会返回一个undefined
return后可跟任意类型

7.实参可以是对象

这种方法在输入信息较多时更加方便
当参数过多时,可以将参数封装到一个对象中,然后通过对象传递

var obj=
			{
				name:"孙悟空",
				age:18,
				address:"花果山水帘洞",
				gender:"男"
			}
function sayHello(object)
			{
				console.log(obj.name+","+obj.gender);
			}
sayHello(obj);

8.返回值类型

返回值可以是任意类型,可以是对象,也可以是函数

在这里插入图片描述

9.立即执行函数

在这里插入图片描述

10.方法

在这里插入图片描述
调函数
fun();
调方法
obj.sayName();
在这里插入图片描述

11.枚举对象的属性

在这里插入图片描述
在这里插入图片描述
若想打印属性值,需要使用以下格式,不能使用obj.n
因为obj[ ]中可以添加变量
因为该对象中没有属性名为n

在这里插入图片描述

12.构造函数

特点:虽然没写return ,但是会自动返回对象
在这里插入图片描述

1)执行流程

  • 创建一个新的对象
  • 将新建的对象设置为函数中的this,在构造函数中可以使用this来引用新建的对象
  • 逐行执行函数中的代码
  • 将新建的对象作为返回值返回

2)实例和类

通过构造函数创建的对象叫做实例
构造函数就是类

3)instanceof

使用instanceof 可以检查一个对象是否是一个类的实例
语法:
对象 instanceof 构造函数

所有对象都是Object的后代
所以任何对象和Object做instanceof 检查时都会返回true

4)优化

在这里插入图片描述
解决方案:将方法在全局作用域中定义

<!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;
				this.sayName=function(){
					alert("hello,我是:"+this.name);
				}
			}
			var per1=new Person("猪八戒",20,"男");
			var per2=new Person("沙和尚",20,"男");
			per1.sayName();
			per2.sayName();*/
			//优化
			function Person (name,age,gender)
			{
				this.name=name;
				this.age=age;
				this.gender=gender;
				this.sayName=fun;
				}
			}
			function fun(){
				alert("hello,我是:"+this.name);
			}
		</script>
	</head>
	<body>
	</body>
</html>

原型对象

1.概述

在这里插入图片描述
在这里插入图片描述

2.作用

在这里插入图片描述

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script type="text/javascript">
			function myClass(){
			}
			myClass.prototype.a=123;
			myClass.prototype.sayHello=function(){
				alert("你好");
			}
			var m1=new myClass();
			console.log(m1.a);
			m1.sayHello();
		</script>
	</head>
	<body>
	</body>
</html>

创建构造函数时,可以将这些对象共有的属性和方法,同一添加到构造函数的原型对象中
在这里插入图片描述

作用域

1.概述

作用域指一个变量的作用范围

2.全局作用域

直接编写在script标签中的JS代码,都在全局作用域
全局作用域在页面打开时创建,在页面关闭时销毁
在全局作用域中有个全局window ,
它代表的是一个浏览器窗口,由浏览器创建 可直接使用

在全局作用域中
创建的变量都会作为Window对象的属性保存
创建的函数都会作为Windows的方法保存;

在这里插入图片描述
全局作用域中的变量都是全局变量
在页面中的任意部分都可访问到
在函数中不使用var声明的变量都是全局变量

3.函数作用域

在这里插入图片描述
在这里插入图片描述

4.变量、函数的声明提前

1)变量声明提前

使用var关键字声明的变量,会在所有代码执行之前被声明,但不赋值
如果不使用var,变量不会被声明提前

2)函数声明提前

使用函数声明形式创建的函数function 函数(){}
会在所有代码执行之前就被创建 (也就是执行优先)
在这里插入图片描述

5.this关键字

在这里插入图片描述
在这里插入图片描述

function fun 
{
  console.log(this.name);
}

var obj ={
  name:"孙悟空",
  sayName:fun
}
var obj2={
  name:"猪八戒",
  sayName:fun
}

obj.sayName();  //this<=>obj

1)运用(使用工厂方法创建对象)

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script>
			
			function fun(name,age,gender)
			{
				var obj=new Object();
				obj.name=name;
				obj.age=age;
				obj.gender=gender;
				obj.sayName=function(){
					alert(this.name);
				};
				return obj;//将对象返回
			}
			
			var obj1=fun("猪八戒",28,"男");
			var obj2=fun("沙和尚",29,"男");
			
			obj2.sayName();
			document.write(obj1.name);
			
			
			
			
			
		</script>
	</head>
	<body>
	</body>
</html>

使用构造法方法创建的对象,使用的构造函数都是Object
所以创建的对象都是Object类型。导致无法区分出多种不同的类型

正则表达式

正则表达式是由一个字符序列形成的搜索模式
当在文本中搜索数据时,可以用搜索模式来描述要查询的内容
正则表达式可以是一个简单的字符或一个更复杂的模式
正则表达式可用于所有文本搜索和文本替换的操作

1.简介

正则表达式用于定义一些字符串的规则
计算机可以根据正则表达式来检查一个字符串是否符合规则
获取将字符串中符合规则的内容提取出来

2.正则表达式的语法

1)使用构造函数创建正则表达式对象

语法
var 变量=new RegExp( “正则表达式”,“匹配模式”);
在这里插入图片描述

2)使用字面量创建正则表达式

语法: var 变量=/正则表达式/匹配模式


//创建一个正则表达式,检查一个字符串中是否含有a或b
reg=/a|b/;
console.log(reg.test("bcd"));

3.正则表达式的方法

1)test()

使用这个方法可以用来检查一个字符串是否符合正则表达式的规则 ,
如果符合则返回true ,否则返回false 区分大小写

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script>
			//这个正则表达式用来检查一个字符串是否含有a
			var reg=new RegExp("a");
			var str="a";
			console.log(reg.test(str));
		</script>
	</head>
	<body>
	</body>
</html>

4.正则表达式语法

1)或| []

eg:eg: [a-z]任意小写字母
[A-Z]任意大写字母
[ab]=a|b

检查一个字符串中是否含有abc或adc或aec
reg=/a[bde]c/

2)除了[^]

除了ab
reg=[^ab]

3)量词

通过量词可以设置一个内容出现的次数

量词 描述
n+ 匹配任何包含至少一个 n 的字符串。
n* 匹配任何包含零个或多个 n 的字符串。
n? 匹配任何包含零个或一个 n 的字符串。

在这里插入图片描述

4)/^a/ /a$/

在这里插入图片描述
在这里插入图片描述

5)注意事项

在这里插入图片描述

6)去除空格

在这里插入图片描述

5.字符串和正则相关的语法

1)split 拆分成数组

在这里插入图片描述

var str="1234b567"
var result=str.split(/b/);
console.log(result.length);//2
console.log(result)//1234,567

2)search() 搜索指定内容

在这里插入图片描述

3)match()

在这里插入图片描述

注意:match()会将匹配到的内容封装到一个数组中返回

4)replace(替换)

在这里插入图片描述

本周总结

这一周终于下大雪了,好久没有痛痛快快的在雪里玩过,堆雪人,打雪仗,当然最爽的还是从坡上滑下来,以及扶着某位室友,唯唯诺诺的滑雪,好多次都想逃出小组,去雪里玩耍
下周继续努力
希望能再下一场大雪,又恰好满课,躺在宿舍一天,巴适得很

  • 23
    点赞
  • 23
    收藏
    觉得还不错? 一键收藏
  • 3
    评论
评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值