Web - JS基础语法与表达式

原创

stark张宇

发布于 2025-02-21 21:53:38

9800

代码可运行

文章被收录于专栏：stark张宇

运行总次数：0

代码可运行

概述

这篇文章主要介绍了 JavaScript 的基础语法，包括代码书写位置、ERPL 环境、变量（命名规则、默认值、初始化）、数据类型（基本和复杂，及各类型特点、转换）、表达式和运算符（算数、特殊算数、关系、逻辑、赋值、自增自减）等内容。

书写位置

在body中的标签，在内部书写JavaScript代码，将代码单独保存为.js格式文件，然后在html文件中使用。

<body>
    <script type="text/javascript">
        alert('这是javascript的第一行代码');
    </script>

    <script src="js/mini.js"></script>
</body>

ERPL环境

控制台也是一个ERPL环境，可以使用它临时测试表达式的值，运行顺序，read读->eval执行->print打印->loop循环。

变量

变量是计算机语言中能存储计算结果或能表示抽象概念，变量不是数值本身，它们仅仅是一个用于存储数值的容器。

要想使用变量，第一步就是声明它，并给它赋值,变量的值可以被改变，改变变量值不再需要书写关键字了。

变量的合法命名，另外在附加一句，函数、类名、对象的属性等也都要遵守这个命名规则：

只能由字母、数字、下划线、$组成，但不能以数字开头。
不能是关键字或保留字
变量名大小写敏感，a和A两个不同的变量。

一个变量只定义，但没有赋初值，默认值是undefind，一个变量只有定义完，并赋初值之后，才算正式初始化完成。

数据类型

JavaScript中存在两大数据类型：基本数据类型、复杂数据类型。 基本数据类型中有Number、String、Boolean、Undefined和null,复杂数据类型有Object、Array、Function、Map、Set等等。

简单数据类型

使用typeof运算符可以检测值或者变量的类型。

基本类型值如下：

类型名	值举例	typeof检测结果
数字类型	5	number
字符串类型	'慕课网'	string
布尔类型	true	boolean
undefined类型	undefined	undefined
null类型	object	null

Number（数字）类型

所有数字不分大小、不分整浮、不分正负，都是数字类型，在小数中0是可以省略的。

较大数或较小数（绝对值较小）可以写成科学计数法。

let a = 3e8; //300000000
let b = 3e-4; //0.0003

不同进制的数字，二进制数值以0b开头，八进制数值以0开头，十六进制数字以0x开头。

NaN:NaN是英语"not a number"的意思，即不是一个数，但它是一个数字类型的值。 0除以0的结果是NaN，事实上，在数学运算中，若结果不能得到数字，其结果往往都是NaN。

String（数字）类型

字符创就是人类的自然语言，字符串要用引号包裹，双引号或者单引号均可。

数字11和字符串11在语义上是不同的，前者表达的一个数量，后者是一个文本。

使用加号"+"可以用来拼接多个字符串,要将一个变量的值插入到字符串中，要斩断链接，新版的Es中增加了反引号表示法，可以更方便进行变量插值。

let year = 2024;
let string = "北京冬奥会在" + year + "年召开";
console.log(string);

有时候需要使用空字符串，直接书写闭合的引号对即可。

字符串的length属性表示字符串长度。

let strLength = '我是stark张宇，请大家多多指教';
console.log(strLength.length);

字符创的常用方法，方法就是可以调用的函数，字符串有丰富的方法：

let strLength = '我是stark张宇，请大家多多指教';

//得到指定位置字符，字符串的下标从0开始
console.log(strLength.charAt(5));

//提取子串 得到从0到9结束的子串，不包括10
//如果省略第二个参数，返回的子串会一直到字符串的结尾
console.log(strLength.substring(0,10));
//将得到从0开始，长度为2的子串
console.log(strLength.substr(0,2));
strLength.slice();

//将字符串变为大写
console.log(strLength.toUpperCase());
//将字符串变为小写
console.log(strLength.toLowerCase());

//检索字符串 返回某个指定的字符串值在字符串中首次出现的位置
//如果要检索的字符串没有出现，则该返回-1
console.log(strLength.indexOf('zcc'));

布尔类型

布尔型值只有2个：true和false，分别表示真和假。

undefind

一个没有被赋值的变量的默认值的变量默认值是undefind，而undefind的类型也是undefind，undefind又是值，又是一种类型，这种类型只有它自己一个值。

null

null表示空，它是空对象，当我们需要将对象销毁、数组销毁或者删除事件监听时，通常将他们设置为null。

使用typeof检测null值，结果是object，这点尤其要注意，类型和typeof检测结果并不总是一一对应，比如数组用typeof检测结果也是object。

复杂数据类型

除基本类型外，Js的世界中还有复杂数据类型，复杂数据类型都是引用类型，引用类型的特性将在数组一课中介绍。

数据类型的转换

使用Number()函数

纯数字字符串能变成数字，不是纯数字的字符串将转为NaN。
布尔值true变为1，false变为0
undefind变成NaN,null变成0

使用parseInt()转换整数parseInt()函数的功能是将字符串转为整数

自动截掉第一个非数字字符之后的所有字符串
所有文字都将被截掉
如果字符串不是以数字开头，则转为NaN
parseInt()函数不四舍五入

parseFloat()函数parseFloat()函数的功能是将字符串转为浮点数

String()函数除了数字式科学计数法和非10进制数字会转为10进制的值，其余都是长的相同的字符串。

toString()函数几乎所有的值都有toString()方法，功能是将值转为字符串

Boolean()函数

0和NaN转为false，其他都数字都转为true。
空字符串变为false，其他都转为true
undefined和null转为false

隐式类型转化

如果参与数学运算的某操作数不是数字型，那么JavaScript会自动将此操作数转换为数字型，隐式转换的本质是内部调用Number函数。

表达式和预算符

算数运算符

算数运算符一共有5种：加(+)、减(-)、乘(*)、除(/)、取余(%),默认情况，惩处法的优先级要高于加法和减法；必要时可以使用圆括号来改变运算的顺序。

加号的两种作用：如果加号两边的变量都是Number类型，则为加法，否则为连字符。

取余运算也叫作求模运算，用百分号%表示，a % b 表示a除以b的余数，它不关心整数部分，只关心余数。

特殊算数运算

IEEE754

在JavaScript或者PHP中，有些小数的数学运算不是很精确，JavaScript使用了IEEE754二进制浮点数算数标准，这会使一些个别的小数运算产生丢失精度的问题。

解决办法：在进行小数运算时，要调用数字的

const a = 0.1;
const b = 0.2;
Number(( a + b ).toFixed(2));

幂和开根号

在JavaScript中没有提供幂计算、开根号的运算符，需要使用Math对象的相关方法进行计算。

//Math.pow(a,b) a的b次方
Math.pow(2,3) //2的3次方
Math.pow(3,2) //3的2次方 

//Math.sqrt(a) 根号下a的计算，负数直接得NaN
Math.sqrt(81) //9
Math.sqrt(-81) //NaN

向上取整和向下取整

Math.ceil(3.56) //向上取整 4
Math.floor(3.56) //向下取整 3

关系运算符

大于>、小于<两个符号和数学相同，大于等于运算符是>=,小于运算时<=。

相等和全等:如果想比较两个值是否相等，此时应该使用==运算符,两个等号运算符不比较值的类型，它会进行隐式转化后比较值是否相等。===运算符不仅比较值是否相同，也比较类型是否相同。

NaN作为一个特殊的数字类型值，它在用==比较的时候也有特殊的结果。

如何判断某变量值为NaN?isNaN函数可以用来判断变量值是否为NaN。

不相等和不全等：!=表示不相等，!==表示不全等。

逻辑运算符

逻辑运算符有3个: 非!、与&&、或||。

非也可以称为置反运算，是一个单目运算符，只需要一个操作数，置反运算的结果一定是布尔值。
与运算表示并且，称为与运算，口诀都真才真。
或运算表示或者，有真就真。

赋值运算符

JavaScript中等号表示赋值，==判断是否相等（不判断类型）,===判断是否全等，赋值运算符会将等号右边的数值，赋予等号左边的变量。

快捷赋值：表示在原数值基础上进一步进行运算。

let a1 = 3;
a1 += 5; // 等价于 a = a + 5;

自增/自减运算符:++和--是自增、自减运算符，表示在自身基础上加1或减1。

a++和++a的区别：a++先用再加，++a先加在用。

原创声明：本文系作者授权腾讯云开发者社区发表，未经许可，不得转载。

如有侵权，请联系 cloudcommunity@tencent.com 删除。

javascript

前端

原创声明：本文系作者授权腾讯云开发者社区发表，未经许可，不得转载。

如有侵权，请联系 cloudcommunity@tencent.com 删除。

javascript

前端

登录后参与评论

0 条评论

热度