姜玉琪_20210118
知识点总结:
1、 JavaScript中的几个概念
JavaScript遵循 ECMA-262 规范,目前其最新版是 ECMAScript 2018,而获得所有主流浏览器完全支持 的则是 ECMAScript 5。我们将以ECMAScript 5版本为基础,兼顾 ECMAScript 6 版本中获得较大支持 的新特性进行介绍
直接量
直接量(Literal)就是具体的值,即能够直接参与运算或显示的值,如字符串、数值、布尔值、正则表 达式、对象直接量、数组直接量、函数直接量等
//空字符串直接量
1 //数值直接量
true //布尔值直接量
/a/g //正则表达式直接量
null //特殊值直接量
{} //空对象直接量
[] //空数组直接量
function(){} //空函数直接量,也就是函数表达式
转义序列
转义序列就是字符的一种表示方式(映射)。由于各种原因,很多字符无法直接在代码中输入或输出, 只能通过转义序列间接表示
Unicode 转义序列方法:\u + 4位十六进制数字。
Latin-1 转义序列方法:\x + 2位十六进制数字。
//对于字符“©” , Unicode 转义为 \u00A9,ASCII 转义为 \xA9
document.write("\xa9"); //Latin-1 显示字符©
document.write("\u00a9"); //Unicode 显示字符©
转义字符
转义字符是字符的一种间接表示方式。在特殊语境中,无法直接使用字符自身。例如,在字符串中包含 说话内容。
2、变量
变量相当于容器,值相当于容器内装的东西,而变量名就是容器上贴着的标签,通过标签可以找到 变 量,以便读、写它存储的值
1、 声明变量
var 变量名 = 初始化值;
在一个 var 语句中,可以声明一个或多个变量,也可以为变量赋值,未赋值的变量初始化为 undefined(未定义)值。当声明多个变量时,应使用逗号运算符分隔
2 、关于JS的弱类型(动态类型)
JavaScript 是弱类型语言,对于变量类型的规范比较松散。
具体表现如下: 变量的类型分类不严谨、不明确,带来使用的随意性。
声明变量时,不要求指定类型。
使用过程不严格,可以根据需要自动转换变量类型。
变量的转换和类型检查没有一套统一、规范的方法,导致开发效率低下。
由此带来的优缺点如下:
优点:使用灵活,简化了代码编写。
缺点:执行效率低,在开发大型应用时,程序性能会受到影响。
简单说就是,同一变量可以接受不同的数据类型。
3、 变量作用域
在 JavaScript 中, 对象和函数同样也是变量,变量作用域为可访问变量,对象,函数的集合
JavaScript 变量可以分为全局变量和局部变量: 全局变量:不是声明在函数体内部的变量,变量在整个页面脚本中都是可见的,可以被自由访问。 局部变量:变量仅能在声明的函数内部可见,函数外是不允许访问的。只要函数运行完毕,变量就 会被删除
局部变量
// 此处不能调用 carName 变量
function myFunction() {
var carName = "Volvo";
// 函数内可调用 carName 变量
}
alert(carName); //error: carName is not defined
全局变量
var carName = " Volvo";
// 此处可调用 carName 变量
function myFunction() {
// 函数内可调用 carName 变量
}
向未声明的 javascript 变量来分配值 如果您把值赋给尚未声明的变量,该变量将被自动作为全局变量声明。
const 关键字
const 用于声明一个或多个常量,声明时必须进行初始化,且初始化后值不可再修改
const PI = 3.141592653589793;
PI = 3.14; // 报错
PI = PI + 10; // 报错
const 定义常量与使用 let 定义的变量相似:
二者都是块级作用域
都不能和它所在作用域内的其他变量或函数拥有相同的名称
两者还有以下两点区别:
const 声明的常量必须初始化,而 let 声明的变量不用
const 定义常量的值不能通过再赋值修改,也不能再次声明。而 let 定义的变量值可以修改。
3、 数据类型
五种原始数据类型:
4、流程控制语句
1、 if 判断
if 语句 在一个指定的条件成立时执行代码。
if...else 语句 在指定的条件成立时执行代码,当条件不成立时执行另外的代码。
if...else if....else 语句 使用这个语句可以选择执行若干块代码中的一个。
2 、循环
for 语句 :循环指定次数
while语句: 当指定的条件为 true 时循环执行代码
do-while语句: 最少执行1次循环
break和continue :break: 跳出整个循环 continue:跳出本次循环
5、 函数
1、一个函数的声明(或者说是函数的定义)
包含: 1. 关键字function
- 函数名称 3.
- 参数列表,包围在括号中并由逗号分隔
- 定义函数的 JavaScript 语句,用大括号 {} 括起来
函数 square 使用了一个参数,叫作 number 。这个函数只有一个语句,它说明该函数将函数的参数 (即 number )自乘后返回。函数的 return 语句确定了函数的返回值。 函数声明后不会立即执行,会在我们需要的时候调用。 原始参数(比如一个具体的数字)被作为值传递给函数;值被传递给函数,如果被调用函数改变了这个 参数的值,这样的改变不会影响到全局或调用函数。
2、Function() 构造函数
通过前边的内容我们学习了函数通过关键字 function 来定义。 函数同样可以通过内置的 JavaScript 函数构造器(Function())定义
6、 调用函数
定义一个函数并不会自动的执行它。定义了函数仅仅是赋予函数以名称并明确函数被调用时该做些什 么。调用函数才会以给定的参数真正执行这些动作。例如,一旦你定义了函数 square 。
7、 嵌套函数和闭包
1、你可以在一个函数里面嵌套另外一个函数。嵌套(内部)函数对其容器(外部)函数是私有的。它自身 也形成了一个闭包。一个闭包是一个可以自己拥有独立的环境与变量的表达式(通常是函数)。
既然嵌套函数是一个闭包,就意味着一个嵌套函数可以”继承“容器函数的参数和变量。换句话说,内部 函数包含外部函数的作用域。
可以总结如下:
内部函数只可以在外部函数中访问。
内部函数形成了一个闭包:它可以访问外部函数的参数和变量,但是外部函数却不能使用它的参数 和变量。
2、闭包
闭包是 JavaScript 中最强大的特性之一。JavaScript 允许函数嵌套,并且内部函数可以访问定义在外部 函数中的所有变量和函数,以及外部函数能访问的所有变量和函数。
但是,外部函数却不能够访问定义在内部函数中的变量和函数。这给内部函数的变量提供了一定的安全 性。
8、js实现图片切换
步骤:
a.创建HTML页面,页面中有一个div标签,div标签内包含一个img标签。
b.body的背景色为黑色;div的类样式为container:设置为居中,加边框,宽度为850px;img的id 为pic,宽度850px;
c.五张图片的名字依次是0~4.jpg,放在项目的img文件夹下,图片一开始的src为第0张图片。
d.编写函数:changePicture(),使用setInterval()函数,每过3秒调用一次。
e.定义全局变量:num=1。
f. 在changePicture()方法中,设置图片的src属性为img/num.jpg。
g. 判断num是否等于4,如果等于4,则num=0;否则num++。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>图片切换</title>
<style type="text/css">
.container {
/*居中*/
margin: auto;
border: 1px solid black;
width: 850px;
}
img {
width: 850px;
}
</style>
</head>
<body>
<div class="container">
<img src="img/0.jpg" id="pic">
</div>
<script>
//全局变量
var num = 1;
//获取图片对象
var picObj = document.getElementById("pic");
//改变图片的src属性
function changePicture() {
//得到图片的src属性,替换它的值
picObj.src = "img/" + num + ".jpg";
//如果图片到了第4张图片,则重新变成第1张,否则就加1
if (num == 4) {
num = 0;
} else {
num++;
}
}
//每过3秒调用一次
setInterval("changePicture()", 3000);
</script>
</body>
</html>
9、javascript的事件
1 、事件的作用 我们刚才的案例中的script标签在不修改代码的基础上,就必须放在body标签之后 ; 原因是因为必须在 页面加载完成之后,我们才可以获取到图片标签 ; 若想把script标签放在body标签之前,这里可以通过 添加页面加载成功事件来处理。
事件是可以被 javascript 侦测到的行为(类似监听器)。
网页中的每个元素都可以产生某些可以触发 javascript 函数的事件。
例如 : 页面加载成功的之后我们来 触发某个函数,又如我们可以在用户点击某个标签时产生一个单击事件来触发某个函数。
注意:事件通常要与函数配合使用,当事件发生时函数才会执行。
常见的事件:
10、 json数据格式
JSON(JavaScript Object Notation, JS 对象标记) 是一种轻量级的数据交换格式。它基于ECMAScript的 一个子集,采用完全独立于编程语言的文本格式来存储和表示数据。简洁和清晰的层次结构使得 JSON 成为理想的数据交换语言。 易于人阅读和编写,同时也易于机器解析和生成,并有效地提升网络传输效 率。
JSON是存储和交换文本信息的语法,类似 XML。
JSON 比 XML 更小、更快,更易解析。
心得体会:
从最开始学习JavaScript到了现在,对它有了一个大概的认识,但是对知识的运用程度还是不够熟练,需要再具体的去练习它。还有就是离开老师的代码就自己不会具体的实现,可能还是练的不够!
近期评论