JavaScript 学习笔记(二)——基础语法
2022/6/6 1:21:36
本文主要是介绍JavaScript 学习笔记(二)——基础语法,对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!
JavaScript 基础语法
1.语法规范
ECMAScript 的语法大量借鉴了 C 及其他类 C 语言(如 Java 和 Perl)的语法。
1. 区分大小写
-
JavaScript区分大小写,包括关键字、变量、函数名、所有标识符;
-
querySelector的S是大写,你写成小写就会报错;
-
alert()全部是小写,你写一个大写字母就会提示你该函数不存在;
-
myname、myName、mynamE、MyName他们真不是一个东西;
2. 注释
JavaScript支持两种注释方式;
-
单行注释
//这是注释内容
-
多行注释
/* * 这是一个多行 * (块级)注释 */
虽然上面注释中的第二和第三行都以一个星号开头,但这不是必需的。之所以添加那两个星号,纯粹是为了提高注释的可读性(这种格式在企业级应用中用得比较多)。
-
注释部分不会执行,合理的注释能显著提高代码的可读性;
-
可以通过浏览器源文件看到注释内容,所以什么该注释什么不该注释要注意;
-
3.语句
ECMAScript 中的语句以一个分号结尾;如果省略分号,则由解析器确定语句的结尾。
如下例所示:
var sum = a + b // 即使没有分号也是有效的语句——不推荐 var diff = a - b; // 有效的语句——推荐
虽然语句结尾的分号不是必需的,换行也可以表示一个语句结束,但我们建议任何时候都不要省略它。因为加上这个分号可以避免很多错误(例如不完整的输入),开发人员也可以放心地通过删除多余的空格来压缩 ECMAScript 代码 (代码行结尾处没有分号会导致压缩错误)。另外,加上分号也会在某些情况下增进代码的性能,因为这样解析器就不必再花时间推测应该在哪里插入分号了。
可以使用 C 风格的语法把多条语句组合到一个代码块中,即代码块以左花括号({)开头,以右花括号(})结尾:
if (test) { test = false; alert(test); }
虽然条件控制语句(如 if 语句)只在执行多条语句的情况下才要求使用代码块,但最佳实践是始终在控制语句中使用代码块——即使代码块中只有一条语句,例如:
if (test) alert(test); // 有效但容易出错,不要使用 if (test) { // 推荐使用 alert(test); }
在控制语句中使用代码块可以让编码意图更加清晰,而且也能降低修改代码时出错的几率。
4. 标识符
所谓标识符,就是指变量、函数、属性、参数的名字,或者用做某些循环语句中的跳转位置的标记。标识符可以是按照下列格式规则组合起来的一或多个字符:
只能由数字、字母、下划线和美元符号($)组成
不能以数字开头
不能是保留字和关键字
大小写敏感 age Age 这是两个完全不同的变量
见名知意(尽量使用英文全称)
单词个数超过两个之后
驼峰式命名 className
下划线命名 class_name
5.关键字和保留字
ECMA-262 描述了一组具有特定用途的关键字,这些关键字可用于表示控制语句的开始或结束,或者用于执行特定操作等。按照规则,关键字也是语言保留的,不能用作标识符。以下就是 ECMAScript的全部关键字(带*号上标的是第 5 版新增的关键字):
ECMA-262 还描述了另外一组不能用作标识符的保留字。尽管保留字在这门语言中还没有任何特定的用途,但它们有可能在将来被用作关键字。以下是 ECMA-262 第 3 版定义的全部保留字:
6.变量
能够保存的数据:5种基本数据 1种引入数据
5种基本数据: number boolean string null undefined
一种引用数据: 对象(函数也是一种特殊的对象)
在日常生活中,有些东西是固定不变的,有些东西则会发生变化。例如,人的姓名和生日是固定不变的,但心情和年龄却会随着时间变化而变化。人们把那些会发生变化的东西称为变量。
变量的概念基本上和初中代数的方程变量是一致的,只是在计算机程序中,变量不仅可以是数字,还可以是任意数据类型。
当程序需要将值保存起来以备将来使用时,便将其赋值给一个变量。变量(variable)是一个用于保存值的占位符,可以通过变量名称来获得对值的引用。
变量在JavaScript中就是用一个变量名表示,变量名是大小写英文、数字、$和_的组合,且不能用数字开头。变量名也不能是JavaScript的关键字,如if、while等。申明一个变量用var语句,比如:
var a; // 申明了变量a,此时a的值为undefined var $b = 1; // 申明了变量$b,同时给$b赋值,此时$b的值为1 var s_007 = '007'; // s_007是一个字符串 var Answer = true; // Answer是一个布尔值true var t = null; // t的值是null
在JavaScript中,使用赋值符号 = 对变量进行赋值。可以把任意数据类型赋值给变量,同一个变量可以反复赋值,而且可以是不同类型的变量,但是要注意只能用var申明一次,例如:
var a = 123; // a的值是整数123 a = 'ABC'; // a变为字符串
7.var声明
初次给变量赋值时,有var 和无var 的区别:
var abc = 'Hello, world'; abcd = "abcd";
-
有var,系统就会在当前作用域的第一行代码隐式的声明一个变量(变量提升);
无var,系统帮你创建一个(全局)变量(运行到这里的时候)。
var aa = 0; bb=1; console.log(delete aa) console.log(delete bb) //console.log(Object.getOwnPropertyDescriptor(window, 'aa')); //console.log(Object.getOwnPropertyDescriptor(window, 'bb'));
-
有var,不可以使用delete,console.log(delete abc)输出false;
无var,可以使用delete,console.log(delete abcd)输出true。
注意 :delete 是 js 用于删除对象属性和数组元素的,但有var声明的无论是全局变量还是局部变量都不能使用delete(这种属性的configurable=false)。
-
严格模式下,使用没有var声明的变量会报错。
strict模式
JavaScript在设计之初,为了方便初学者学习,并不强制要求用var申明变量。这个设计错误带来了严重的后果:如果一个变量没有通过var申明就被使用,那么该变量就自动被申明为全局变量:
i = 10; // i现在是全局变量
在同一个页面的不同的JavaScript文件中,如果都不用var申明,恰好都使用了变量i,将造成变量i互相影响,产生难以调试的错误结果。
使用var申明的变量则不是全局变量,它的范围被限制在该变量被申明的函数体内(函数的概念将稍后讲解),同名变量在不同的函数体内互不冲突。
为了修补JavaScript这一严重设计缺陷,ECMA在后续规范中推出了strict模式,在strict模式下运行的JavaScript代码,强制通过var申明变量,未使用var申明变量就使用的,将导致运行错误。
启用strict模式的方法是在JavaScript代码的第一行写上:
'use strict';
这是一个字符串,不支持strict模式的浏览器会把它当做一个字符串语句执行,支持strict模式的浏览器将开启strict模式运行JavaScript。
来测试一下你的浏览器是否能支持strict模式:
'use strict'; // 如果浏览器支持strict模式, // 下面的代码将报ReferenceError错误: ---- abc = 'Hello, world'; alert(abc);
运行代码,如果浏览器报错,请修复后再运行。如果浏览器不报错,说明你的浏览器太古老了,需要尽快升级。
不用var申明的变量会被视为全局变量,为了避免这一缺陷,所有的JavaScript代码都应该使用strict模式。
变量提升
变量的提升是指会把变量的声明提升到前面,但是不提升变量赋值;
alert(a); //Uncaught ReferenceError: a is not defined a = 100;
alert(b);//undefined var b = 200;
第二段代码,var声明的全局变量b 在js中会进行代码提升,也就是说var b = 200; 会被分解为 var b;b=200; 代码解析的第时候会将var b; 提升到最前面,并且在内存中开辟一个空间,由于b没有被赋值,默认为undefined。
第一段代码中当js 执行alert() 函数时候由于没有进行var声明,变量没有被提升,不存在内存开辟,所以在alert时候直接报错。
-
–解释器在执行js代码的时候,会把所有的声明,包括变量和函数的声明,提到最前面;
-
变量的提升本质上是声明的提升。
这篇关于JavaScript 学习笔记(二)——基础语法的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!
- 2024-12-28一步到位:购买适合 SEO 的域名全攻略
- 2024-12-27OpenFeign服务间调用学习入门
- 2024-12-27OpenFeign服务间调用学习入门
- 2024-12-27OpenFeign学习入门:轻松掌握微服务通信
- 2024-12-27OpenFeign学习入门:轻松掌握微服务间的HTTP请求
- 2024-12-27JDK17新特性学习入门:简洁教程带你轻松上手
- 2024-12-27JMeter传递token学习入门教程
- 2024-12-27JMeter压测学习入门指南
- 2024-12-27JWT单点登录学习入门指南
- 2024-12-27JWT单点登录原理学习入门