javaScript基础知识汇总

一、基础语法

1、区分大小写:无论是变量、函数名还是操作符,都区分大小写。

2、标识符:就是变量、函数、属性或函数参数的名称。标识符可以由一个或多个字符构成,但需要满足以下条件:

第一个字符必须是一个字母、下划线(_)或美元符号($);

剩下的其他字符可以是字母、下划线、美元符号或数字。

命名规范------驼峰大小形式:即第一个单词的首字母小写,后面每个单词的首字母大写。

注意事项:关键字、保留字、true、false、null不能作为表示符。

3、注释:和C语言一样

4、严格模式:严格模式是一种不同的javascript解析和执行模型,一些不规范写法在这种模式下会被处理,对于不安全的活动将抛出错误。要对整个脚本启用严格模式,在脚本开头加上这一行:

"use strict"

5、语句:脚本中语句以分好结尾,省略分号意味着由解析器确定语句在哪里结尾。即使语句末尾分好不是必需的,也应该加上。

多条语句可以合并到一个C语言风格的代码块中,代码块由一个左花括号"{"表示开始,一个右花括号"}"标识结束。

例如:

if (test){

test=false;

console.log(test);

}

二、关键字与保留字

javascript中规定了一组保留的关键字,这些关键字有特殊用途,比如表示控制语句的开始和结束,或者执行特定的操作。按照规定,保留的关键字不能用作标识符或属性名。

三、变量

javascript变量可以用于保存任何类型的数据。每个变量只不过是一个用于保存任意值命令的占位符。有3个关键字可以声明变量:var、const和let。其中,var在javascript所有版本中都可以使用,但是const和let只能在javascript6及更晚版本中使用。

1、var关键字

要定义变量,可以使用var操作符(注意var是一个关键字),后跟变量名(即标识符):

var message;

这行代码定义了一个名为message的变量,可以用它保存任何类型的值。(不初始化的情况下,变量会保存一个特殊值undefined)。同时我们可以在变量定义的时候就进行初始化:

var message="xincun"

这里,message被定义为一个保存字符值xincun的变量。像这样初始化变量不会将它标识为字符串类型,只是一个简单的赋值而已。随后,不仅可以改变保存的值,也可以改变值的类型;

注意事项:同一个变量虽然可以赋值成不同类型的数据,但是不推荐这样做。

2、var声明作用域

使用var操作符定义的变量会成为包含它的函数的局部变量。比如,使用var在一个函数内部定义一个变量,就意味着该变量将在函数退出时被销毁。

如:

function test() {

var message="xincun" ;//局部变量

}

test();

console.log(message); //出错(因为是在函数中定义的局部变量,在函数外未定义所以报错)

在函数定义变量时省略var操作符,可以创建一个全局变量:

function test() {

message="xincun";

}

test();

console.log(message); //"xincun"(去掉var操作符后,message就变成了全局变量)

注意事项:

在同一个脚本中不建议通过省略var定义全局变量,在局部作用域中定义的全局变量很难维护,也会造成困惑。在严格模式下(use strict)未声明变量赋值,则会导致抛出RerenceError。定义多个同一类型的变量类型变量,使用逗号隔开。

3、var声明提升

在javascript中使用var关键字声明的变量会自动提升到函数作用域顶部,即所有变量声明都拉到函数作用域的顶部,此外,重复的对同一个变量进行声明是没有问题的(就更新变量值)。

function age() {

console.log(age);

var age=20;

var age=22;

}

foo(); //undefined (之所以不会报错,是因为javascript运行时把它等价为如下代码:)

function foo() {

var age;

console.log(age);

age=89;

}

foo();

letl声明变量,声明的范围是块作用域(比如:if语句的作用范围就是块作用域),而var声明的变量范围是函数作用域。

const的行为与let基本相同,唯一一个重要的区别是用它声明变量时必须同时初始化变量,并且尝试修改const声明的变量会导致运行时错误。

四、数据类型

javascript有6种简单数据类型:undefined,null,boolean,number,string,symbol。

1、typeof操作符

typeof操作用来确定任意变量类型。

"undefined":表示值未定义;

"boolean":表示值为布尔值;

"string":表示值为字符串;

"number":表示值为数值;

"object":表示值为对象(而不是函数)或null;

"function"表示值为函数;

"symbol"表示值为符号。

2、undefined类型

undefined类型只有一个值,就是特殊值undefined。当使用var或let声明了变量但是没有初始化时,就相当于给变量赋予了undefined值;

总结:一个变量声明了,但是没有初始化,或者一个没有声明的变量,调用typeof操作符,都会返回结果为"undefined"

3、NULL类型

NUll类型同样只有一个值,即特殊值null。逻辑上讲,null值表示一个空对象指针,这也是给typeof传一个null会返回"object"的原因。

在定义将来要保存对象值的变量时,建议使用null来初始化,不要使用其他值。这样只要检查这个变量是不是null就可以知道这个变量是否在后来被重新赋予了一个对象的引用。

4、Boolean类型

boolean类型是javascript中使用最频繁的类型之一,有两个字面值:true和false。这两个布尔值不同于数据,因此true不等于1,false不等于0。

注意:

布尔值字面量true和false是区分大小写的,因此True和False(及其他大小混写形式)是有效的标识符,但不是布尔值。

Boolean()转型函数可以在任意类型的数据上调用,而且始终返回一个布尔值。(这个就是强制类型转换,与python中bool函数功能相似)

5、Number类型

Number类型在javascript中表示整数和浮点数(某些语言中也叫双精度值)。不同的数值类型相应地有不同的数值字面量格式。这种方法中

6、NaN

有一个特殊的设置叫NaN,意思是"不是数值"(not a number),用来表示本来要返回数值的操作失败了(而不是抛出错误)。NaN有几个独特的属性。首先,任何设计NaN的操作系统返回NaN,在连续多步计算时这可能是个问题。其次NaN不等于包括NaN在内的任何值。

javascript中提供了isNaN()函数。该函数接受一个参数,可以是任意数据类型,然后判断这个参数是否"不是数值"。

7、数值转换

有3个函数可以将非数值转换为数值:Number(),parseInt()和parseFloat()。Number()是转型函数,可用于任何数据类型。后两个函数主要用于将字符串转换为数值。

Number()函数基于如下规则执行转换:

布尔值,true转换为1,false转换为0;

数值,直接返回;

null,返回0;

字符串,应用以下规则:

如果字符串包含数值字符,包括数值字符前面带加、减号的情况,则转换为一个十进制数值。

如果字符串包含有效的浮点值格式"1.1",则会转换为相应的浮点值。

如果字符串中包含有效的十六进制格式如:"oxf",则会转换为与该十进制值对应的十进制整数值。

如果字符串是空字符串(不包含字符),则返回0;

如果字符串包含上述请款之外的其他字符,则返回Nan。

对象:调用valueof()方法,并安装上述规则转换返回的值。如果转换结果是NaN,则调用toString()方法,再按照转换字符串的规则转换。

因为使用Number()函数转换字符串相对复杂且有反常规,通常在需要得到整数时,可以优先使用parseInt()函数。该函数更专注于字符串是否包含数值模式。 parseInt()函数也接收第二个参数,用于指定底数(进制数)。如:传入的第二参数为16,表示对要解析的值是十六进制。这是传入需要解析的数据,可以省略0x。这个函数的输出还是会以十进制的形式的输出转换后的数据。

注意事项:

当不传底数参数时,parseInt()函数自己决定如何解析,所以为避免解析出错,建议始终传给它第二参数。大多数情况下解析的数据都是十进制数,此时第二个参数就要传入10。

parseFloat()函数的工作方式跟pareInt()函数类似,都是从位置0开始检测每个字符。同样,它也是解析到字符串末尾或者解析到一个无效的浮点数值字符为止。这意味着第一次出现的小数点是有效的,但第二次出现的小数点就无效了,此时字符串的剩余字符都会被忽略。如"2.3.6" 会被转换为2.3。

parseFloat()函数始终忽略字符串开头的零,且该函数只解析十进制值,因此不能指定底数。

8、String类型

string(字符串)数据类型表示零或多个16位Unicode字符序列。字符串可以使用双引号(")、单引号(')或反引号(·)标识。这三种方式定义字符串的标果是一样的。

字符串的长度可以通过其length属性获取。

如:

len name="yuanyexiaolu";

console.log(name.length); //12 标识当前字符串含有12个字符

字符串特点:

javascript中的字符串是不可变的,意思是一旦创建,它们的值就不能变了。要修改某个变量中的字符串值,必须要先销毁原始的字符串,然后将包含新值的另一个字符串保存到该变量。

转换为字符串

有两种方式把一个值转换为字符串。首先是使用几乎所有值都有的toString()方法。这个方法唯一的用途就是返回当前值的字符串等价物。toString()方法可见于数值、布尔值、对象和字符串值。null和undefined值没有toString()方法。toString()函数可以接收一个底数参数,即以什么底数来输出数值的字符串表示。默认情况下,toSting()返回数值的十进制字符串表示。而通过传入参数,可以得到数值的二进制、八进制、十六进制,或者其他任何有效基数的字符串表示。

如:

len num=10;

console.log(num.toString()); //"10"

console.log(num.toString(2)): //"1010"

当你不确定一个值是不是null或undefined,可以使用string()转型函数,它始终会返回表示相应类型值的字符串。String()函数遵循如下规则:

如果值有toString()方法,则调用该方式(不传递参数)并返回结果。

如果值是null,返回"null" 如果值是Undefined,返回"undefined"。

注意:

用加号操作符给一个值加上一个空字符串""也可以将其转换为字符串

字面量模板

javaScript中新增了使用模版字面量定义字符串的能力,模版字面量保留换行字符,可以跨行定义字符串。

顾名思义,模版字面量在定义模版时特别有用。(由于模板字面量会保持反引号内部的空格,因此在使用时要格外注意。格式正确的模版看起来可能会缩进不当)。模版字面量使用反引号定义。

字符串插值

**模板字面量最常用的一个特性就是支持字符串插值,也就是可以在一个连续定义中插入一个或多个值。技术上讲,模板字面量不是字符串,而是一种特殊的javaScript句法表达式,只不过求值后得到的是字符串。**模板字面量在定义时立即求值并转换为字符串实例,任何插入的变量也会从他们最接近的作用域中取值。

字符串插值通过${}中使用一个javaScript表达式实现:

let value=5;

let exponent='second';

//以前,字符插值是这样实现的

let interpolatedString=value + " to the " + exponent + " power is "+ (value*value);

//现在,可以用模板字面量这样实现:

let interpolatedTemplateLiteral=${ value } to the ${exponent} power is ${value*value};

console.log(interpolatedString); //5 to the second power is 25

console.log(interpolatedTemplateLiteral) //5 to the second power is 25

所有插入的值都会使用toString()强制转换为字符串,而且任何javaScript表达式都可以用于插值。

嵌套的模板字符串无需转义:

console.log(hello, ${world}!); //hello, world

将表达式转换为字符串时会调用toString(),在插值表达式中可以调用函数和方法。此外,模块也可以插入自己之前的值。

模板字面量标签函数

模板字面量也支持定义标签函数(tag function),而通过标签函数可以自定义插值行为。标签函数会接收被插值记号分隔后的模版和对每个表达式的结果。

标签函数本身是一个常规函数,通过前缀到模板字面量来应用自定义行为。标签函数接受到的参数依次是原始字符串数组和对每个表达式求值的结果。这个函数返回值是对模板字面量求值得到的字符串。

let a=6;

let b=9;

function simpleTag(strings,...expressions) {

console.log(strings);

for (const expression of expressions) {

console.log(expression);

}

return 'foobar'

}

let taggedResult =simpleTag ${a} +${b} =${a+b}

console.log(taggedResult);

输出结果:

[ '', ' +', ' =', '' ]

6

9

15

foobar

原始字符串

使用模板字面量也可以直接获取原始的模板字面量内容(如换行符或unicode字符),而不是被转换后的字符表示。因此,可以使用默认的String.raw标签函数。

console.log(\u00A9) //©

console.log(String.raw\uA009); \\uA009

9、Symbol类型

Symbol(符号)是javascript中新增的数据类型。符号是原始值,且符号实例是唯一、不变的。符号的用途是确保对象属性使用唯一标识符,不会发生属性冲突的危险。符号就是用来创建唯一记号,进而用作非字符串形式的对象属性。

符号的基本用法

符号需要使用Symbol()函数初始化。因为符号本身是原始类型,所以typeof操作符符号返回symbol。

如:

let sym=Symbol();

console.log(typeof sym); //symbol

10.object类型

javascript中的对象其实就是一组数据和功能的集合。对象通过new操作符后跟对象类型的名称来创建。开发着可以通过object类型的实例来创建自己的对象,然后再给对象添加属性和方法。

如:

let person=net Object();

五、操作符

可用于操作数据值的操作符叫做操作符。

递增/递减操作符:前缀版(++i)和后缀版(i++);

这两者的区别是:++i是先将i的值加一然后再继续运算,i++是先将i的值用于运算,运算结束后再进行加一。

一元加和减:加号(+)和减号(-)

位操作符:非(~)、与(&)、或(|)、异或(^),左移(<<),右移(>>),无符号右移(>>>)

布尔操作符:逻辑非(!) 、逻辑与(&&)、逻辑或(||)

乘性操作符:乘法(*)、除法(/)和取模(%)。

指数操作符:指数(Math.pow) 或者 **

关系操作符:小于(<)、大于(>)、小于等于(<=)和大于等于(>=)

相等操作符:判断两个变量是是否相等是编程中最重要的操作之一。在javascript中提供了两组操作符。

第一组是等于和不等于,他们在比较之前执行转换。(==和!=)

第二组是全等和不全等,他们在比较之前不执行转换。(===和!==)

条件操作符:条件操作符是javascript中用途最为广泛的操作之一。语法如下:

variable = boolean_expression ? true_value : false_value

赋值操作符:简单赋值用等于号(=)表示,将右手边的值赋给左手边的变量。可以使用其他操作符构成复合型值操作符

逗号操作符:逗号操作符可以用来在一条语句中执行多个操作。

六、语句

JavaScript中大部分语法都体现在语句中,语句通常使用一个或多个关键字完成既定的任务。

1、if语句

语法1如下:

if (表达式) 执行语句1 else 执行语句2;

解释:

表达式运行结束后,会自动转换为布尔值,如果布尔值为"真"则运行"执行语句1",如果布尔值为"假"就运行执行语句2。(注意:执行语句可以是一个代码块,这个时候用花括号包含即可。)

具体实例如下:

let number=89

if (number>80) console.log("当前number的值大于80\n")

else{

console.log("当前number的值小于80\n")

}

语法2如下:

if(表达式){执行语句1}

else if (表达式) {执行语句2}

else{执行语句3}

具体实例如下:

let number=89

if (number>90) console.log("当前number的值大于90\n")

else if (number>85 && number<90){

console.log("当前number的值介于85到90之间\n")

}

else {

console.log("当前number的值不在80~90的范围内")

}

2、do-while语句

do-while语句是一种后测试循环语句,即循环体中的代码执行后才会对退出条件进行求值。换句话说,循环体内的代码至少执行一次。do-while的语法如下:

do{

执行语句;

}while (表达式)

例子:

let i=0;

do {

i+=2;

}while (i<10)

console.log(i) //10

3、while语句

while语句是一种先测试循环语句,即先检测推出条件,再执行循环体内的代码。

语法如下:

while(表达式) 执行语句;

let i=0;

while (i<10)

{

i+=2

}

console.log(i) //10

4、for语句

for语句也是测试语句,只不过增加了进入循环之前的初始化代码,以及循环执行后要执行表达式。

语法如下:

for (初始化变量;条件判断;表达式) 执行语句;

实际举例如下:

let count=10;

for (let i=0;i<10;i++){

console.log(i);

}

5、for-in 语句

for- in 语句是一种严格的迭代语句,用于枚举对象中的非符号建属性。

6、for-of语句

for-of语句是一种严格的迭代语句,用于遍历可迭代对象的元素。

7、标签语句

标签语句用于给语句加标签,语法如下:

label:statement

实际例子:

start:for (let i =0;i<count;i++)

{

console.log(i);

}

8、break和continue语句

break 和continue语句为执行循环代码提供了更严格的控制手段。break结束整个循环,continue结束本次循环。

9、with语句

with语句的用途是将代码作用域设备为特定的对象,语法如下:

with (表达式) 执行语句;

10、switch语句

switch语句与if语句紧密相关的一种流控制语句,类似于C语言中switch语句。

语法如下:

switch (expression){

case value1:

statement

break;

case value2:

statement

break;

default:

statement;

}

}

七、函数

函数对任何语言来说都是核心组件,因为它可以封装语句,然后在任何地方、任何时间执行。javascript中使用function关键字声明。

基本语法如下:

function functionName(参数1,参数2,....)

{

执行语句;

return 语句; //如果函数需要返回计算结果

}

注意事项:

不指定返回值的函数实际上会返回特殊值undefined.

相关推荐
AI人H哥会Java4 分钟前
【Spring】Spring的模块架构与生态圈—Spring MVC与Spring WebFlux
java·开发语言·后端·spring·架构
开心工作室_kaic8 分钟前
springboot461学生成绩分析和弱项辅助系统设计(论文+源码)_kaic
开发语言·数据库·vue.js·php·apache
孤留光乩10 分钟前
从零搭建纯前端飞机大战游戏(附源码)
前端·javascript·游戏·html·css3
伊泽瑞尔.11 分钟前
el-tabs标签过多
前端·javascript·vue.js
2401_8543910838 分钟前
智能挂号系统设计典范:SSM 结合 Vue 在医院的应用实现
前端·javascript·vue.js
觉醒的程序猿39 分钟前
vue2设置拖拽选中时间区域
开发语言·前端·javascript
明月看潮生1 小时前
青少年编程与数学 02-004 Go语言Web编程 12课题、本地数据存储
开发语言·青少年编程·本地存储·编程与数学·goweb
唐墨1231 小时前
golang自定义MarshalJSON、UnmarshalJSON 原理和技巧
开发语言·后端·golang
小老鼠不吃猫1 小时前
C++点云大文件读取
开发语言·c++
Theodore_10222 小时前
3 需求分析
java·开发语言·算法·java-ee·软件工程·需求分析·需求