2. 科技
    3. JavaScript部分基础知识总结

    JavaScript部分基础知识总结

    科技2022-08-28  114

    JavaScript部分基础知识总结

    JavaScript是什么

    Java 服务器端的编程语言

    JavaScript 运行在客户端(浏览器)的编程语言

    JavaScript是一种运行在***客户端*** 的***脚本语言*** JavaScript的解释器被称为JavaScript引擎，为浏览器的一部分，广泛用于客户端的脚本语言，最早是在HTML（标准通用标记语言下的一个应用）网页上使用，用来给HTML网页增加动态功能。

    JavaScript和HTML、CSS的区别

    HTML：提供网页的结构，提供网页中的内容CSS: 用来美化网页JavaScript: 可以用来控制网页内容，给网页增加动态的效果

    JavaScript的组成

    ECMAScript - JavaScript的核心

    JavaScript的核心，描述了语言的基本语法和数据类型，ECMAScript是一套标准，定义了一种语言的标准与具体实现无关

    BOM - 浏览器对象模型

    一套操作浏览器功能的API

    通过BOM可以操作浏览器窗口，比如：弹出框、控制浏览器跳转、获取分辨率等

    DOM - 文档对象模型

    一套操作页面元素的API

    DOM可以把HTML看做是文档树，通过DOM提供的API可以对树上的节点进行操作

    JavaScript的书写位置

    写在行内 <input type="button" value="按钮" onclick="alert('Hello World')" /> 写在script标签中 <head> <script> alert('Hello World!'); </script> </head> 写在外部js文件中，在页面引入 <script src="main.js"></script>

    注意点

    引用外部js文件的script标签中不可以写JavaScript代码

    变量

    什么是变量

    变量是计算机内存中存储数据的标识符，根据变量名称可以获取到内存中存储的数据

    为什么要使用变量

    使用变量可以方便的获取或者修改内存中的数据

    如何使用变量

    var声明变量 var age; 变量的赋值 var age; age = 18; 同时声明多个变量 var age, name, sex; age = 20; name = 'aa'; 同时声明多个变量并赋值 var age = 20, name = 'aa';

    变量在内存中的存储

    var age = 888;

    变量的命名规则和规范

    规则 - 必须遵守的，不遵守会报错

    由字母、数字、下划线、$符号组成，不能以数字开头不能是关键字和保留字，例如：for、while。区分大小写

    规范 - 建议遵守的，不遵守不会报错

    变量名必须有意义遵守驼峰命名法。首字母小写，后面单词的首字母需要大写。例如：userName、userPassword

    下面哪些变量名不合法

    a; 1; age18; 18age; name; $name; _sex; &sex; theworld theWorld;

    数据类型

    简单数据类型

    Number、String、Undefined、Null

    Number类型

    数值字面量：数值的固定值的表示法

    110 1024 60.5

    浮点数

    浮点数 var n = 5e-324; // 科学计数法 5乘以10的-324次方 浮点数值的最高精度是 17 位小数，但在进行算术计算时其精确度远远不如整数 var result = 0.1 + 0.2; // 结果不是 0.3，而是：0.30000000000000004 console.log(0.07 * 100); 不要判断两个浮点数是否相等 数值范围 最小值：Number.MIN_VALUE，这个值为： 5e-324 最大值：Number.MAX_VALUE，这个值为： 1.7976931348623157e+308 无穷大：Infinity 无穷小：-Infinity

    数值判断

    NaN：not a number

    NaN 与任何值都不相等，包括他本身

    isNaN: is not a number

    String类型

    ‘abc’ “abc”

    字符串拼接使用 + 连接

    console.log('hello' + ' world'); console.log('100' + '100'); console.log('11' + 11); console.log('male:' + true); 两边只要有一个是字符串，那么+就是字符串拼接功能两边如果都是数字，那么就是算术功能。

    Undefined和Null

    undefined表示一个声明了没有赋值的变量，变量只声明的时候值默认是undefinednull表示一个空，变量的值如果想为null，必须手动设置

    复杂数据类型

    Object

    获取变量的类型

    typeof

    var age = 18; console.log(typeof age); // 'number'

    数据类型转换

    转换成字符串类型

    toString()

    var num = 5; console.log(num.toString());

    String()

    String()函数存在的意义：有些值没有toString()，这个时候可以使用String()

    拼接字符串方式

    num + “”，当 + 两边一个操作符是字符串类型，一个操作符是其它类型的时候，会先把其它类型转换成字符串再进行字符串拼接，返回字符串

    转换成数值类型

    Number()

    Number()可以把任意值转换成数值，如果要转换的字符串中有一个不是数值的字符，返回NaN

    parseInt()

    var num1 = parseInt("12.3abc"); // 返回12，如果第一个字符是数字会解析知道遇到非数字结束 var num2 = parseInt("abc123"); // 返回NaN，如果第一个字符不是数字或者符号就返回NaN

    parseFloat()

    parseFloat()把字符串转换成浮点数 parseFloat()和parseInt非常相似，不同之处在与 parseFloat会解析第一个. 遇到第二个.或者非数字结束 如果解析的内容里只有整数，解析成整数

    +，-0等运算

    var str = '500'; console.log(+str); // 取正 console.log(-str); // 取负 console.log(str - 0);

    布尔操作符（逻辑运算符）

    &&运算是与运算

    只有所有都为true，&&运算结果才是true；

    逻辑与操作可以应用于任何类型的操作数，而不仅仅是布尔值，在有一个操作数不是布尔值的情况下，逻辑与操作不一定返回布尔值： 1.如果第一个操作数是对象，则返回第二个操作数 2.如果第二个操作数是对象，则只有在第一个操作数的求值结果为true的情况下才返回该对象 3.如果两个操作数都是对象，则返回第二个操作数 4.如果第一个操作数是null，则返回null 5.如果第一个操作数是NaN，则返回NaN 6.如果第一个操作数是undefined，则返回undefined 逻辑与是短路操作，即如果第一个操作数能够决定结果，那么就不会对第二个操作数求值。逻辑与操作中，当第一个操作数是false时，则无论第二个操作数是什么值，结果都是false

    ||运算是或运算

    只要其中有一个true，||运算结果都为true；

    与逻辑与相似，如果有一个操作数不是布尔值，则结果不一定是布尔值： 1.如果第一个操作数是对象，则返回第一个操作数 2.如果第一个操作数的求值结果为false，则返回第二个操作数 3.如果两个操作数都是对象，则返回第一个操作数 4.如果两个操作数都是null，则返回null 5.如果两个操作数都是NaN，则返回NaN 6.如果两个操作数都是undefined，则返回undefined

    !运算是非运算

    他是一个单目运算符，把true变成false，把false变为true； 将他的操作数转为一个布尔值，然后求其反 1.如果操作数是对象，则返回false 2.如果操作数是一个空字符串，则返回true 3.如果操作数是一个非空字符串，则返回false 4.如果操作数是0，则返回true 5.如果操作数是任意非0数值（包括Infinity），则返回false 6.如果操作数是null，则返回true 7.如果操作数是NaN，则返回true 8.如果操作数是undefined，则返回true

    !!模拟Boolean()转型函数，获得一个值对应的布尔值

    乘性操作符

    乘（*）

    用于计算两个操作数的乘积 处理特殊值的规则： 1.有一个操作数是NaN===>NaN 2.Infinity * 0==>NaN 3.Infinity * 非0数值===>Infinity/-Infinity（取决于符号） 4.Infinity * Infinity===>Infinity 5.乘积超过数值的表示范围 ，返回Infinity/-Infinity（取决于符号） 6.如果有一个操作数不是数值，在后台调用Number()，然后应用上面的规则

    除（/）

    处理特殊值的规则： 1.有一个操作数是NaN===>NaN 2.0 / 0，返回NaN 3.非0数值 * 0，返回Infinity/-Infinity（取决于符号） 4.Infinity / Infinity，返回NaN 5…Infinity /任意非0数值，返回Infinity/-Infinity（取决于符号） 6.乘积超过数值的表示范围 ，返回Infinity/-Infinity（取决于符号） 7.如果有一个操作数不是数值，在后台调用Number()，然后应用上面的规则

    求模（%）

    返回余数 处理特殊值的规则： 1.被除数无穷大而除数有限大（无穷大%有限大），返回NaN 2.有限大的值 % 0，返回NaN 3.被除数有限大除数无穷大，返回被除数 4.Infinity % Infinity，返回NaN 5.0%任意数，返回0 6.如果有一个操作数不是数值，在后台调用Number()，然后应用上面的规则

    加性操作符

    加法（+） 如果两个操作数都是数值，执行常规的加法计算，然后根据规则返回结果 .如果有一个操作数是NaN，则返回NaN .有一个操作数是字符串：①如果两个操作数都是字符串，则第二个操作数与第一个操作数拼接起来；②如果只有一个操作数是字符串，则将另一个操作数转换为字符串，饭后拼接起来 .如果有一个操作数是对象、数值、或布尔值，则调用他们的toString()方法取得对应的字符串值，在应用前面的规则 .对于null、undefined，调用String()获得字符串值减法（-） 规则： .如果有一个操作数是NaN，则返回NaN .有一个操作数是字符串、布尔值、null或undefined：先在后台调用Number()函数将其转换为数值，然后根据前面的规则执行 .如果有一个操作数是对象，则调用valueOf()取得该对象的数值，如果得到NaN，则减法结果为NaN；如果没有valueOf()，则调用toString()方法取得对应的字符串值，并将其转换为数值。

    关系操作符

    小于（<）、大于（>）、小于等于（<=）、大于等于（>=）

    相等运算符

    实际上，JavaScript允许对任意数据类型作比较，但特别要注意相等于算符。JavaScript在设计时，有两种比较运算符： 第一种是==，它会自动转换类型再比较。!=：不相等 第二种是===，他不会自动转换类型，如果两个表达式（包括他们的数据类型）相等，则结果为true。!==：不全等 注意： NaN与其他的值都不想等，包括他自己，唯一能判断NaN的方法是通过isNaN()

    语句

    if语句 语法结构 if (/* 条件表达式 */) { // 执行语句 } if (/* 条件表达式 */){ // 成立执行语句 } else { // 否则执行语句 } if (/* 条件1 */){ // 成立执行语句 } else if (/* 条件2 */){ // 成立执行语句 } else if (/* 条件3 */){ // 成立执行语句 } else { // 最后默认执行语句 } do-while语句 do…while循环和while循环非常像，二者经常可以相互替代，但是do…while的特点是不管条件成不成立，都会执行一次。 基础语法： do { // 循环体; } while (循环条件); while语句 基本语法： // 当循环条件为true时，执行循环体， // 当循环条件为false时，结束循环。 while (循环条件) { //循环体 } for语句

    while和do…while一般用来解决无法确认次数的循环。for循环一般在循环次数确定的时候比较方便 for循环语法：

    // for循环的表达式之间用的是;号分隔的，千万不要写成, for (初始化表达式1; 判断表达式2; 自增表达式3) { // 循环体4 } 执行顺序：1243 ---- 243 -----243(直到循环条件变成false) 1. 初始化表达式 2. 判断表达式 3. 自增表达式 4. 循环体 for-in语句： 迭代语句，用来枚举对象的属性 在使用for-in循环之前，先检测该对象的值是否是null、undefined，对象若为null、undefined，不执行for-in循环体 语法： for(property in expression) statement label语句 可以在代码中添加标签，以便将来使用 语法： label:statement

    这个示例中定义的start标签可以在将来由break、continue语句引用。加标签的语句一般都要与for循环语句配合使用

    break、continue break:立即跳出整个循环，即循环结束，开始执行循环后面的内容（直接跳到大括号） continue:立即跳出当前循环，继续下一次循环（跳到i++的地方）with语句 将代码的作用域设置到一个特定的对象中。 语法： with (expression) statement;

    严格模式下不允许使用with语句，将视为语法错误

    switch语句 语法格式: switch (expression) { case 常量1: 语句; break; case 常量2: 语句; break; case 常量3: 语句; break; case 常量...: 语句; break; }

    break可以省略，如果省略，代码会继续执行下一个case switch 语句在比较值时使用的是全等操作符, 因此不会发生类型转换

    数组

    通过数组字面量创建数组

    // 创建一个空数组 var arr1 = []; // 创建一个包含2个字符串的数组 var arr3 = ['a', 'c']; // 可以通过数组的length属性获取数组的长度 console.log(arr3.length); // 可以设置length属性改变数组中元素的个数 arr3.length = 0; console.log(arr3.length);

    通过构造函数的方式定义一个数组

    var arr1=new Array();//构造函数的方式---空数组 var arr2=new Array(5);//构造函数的方式定义了一个数组,数组中有5个元素,数组长度是5,每个数据是undefined var arr3=new Array(10,20,1000,40,50,60); console.log(arr3);

    数组的赋值（新增元素）

    // 格式：数组名[下标/索引] = 值; // 如果下标有对应的值，会把原来的值覆盖，如果下标不存在，会给数组新增一个元素。 var arr = ["red", "green", "blue"]; // 把red替换成了yellow arr[0] = "yellow"; // 给数组新增加了一个pink的值 arr[3] = "pink";

    函数

    函数的定义

    函数声明 function 函数名(){ // 函数体 } 函数表达式 var f1 = function() { // 函数体 console.log("hello word"); } console.log(f1);//f1函数的代码 console.log(f1());//hello word console.log(typeof f1);//function函数也是一种类型

    如果是函数表达式,那么此时前面的变量中存储的就是一个函数,而这个变量就相当于是一个函数,就可以直接加小括号调用了

    函数的调用

    调用函数的语法： 函数名();//直接调用

    特点：

    函数体只有在调用的时候才会执行，调用需要()进行调用。 可以调用多次(重复使用)函数的参数

    函数的返回值

    返回值语法：

    //声明一个带返回值的函数 function 函数名(形参1, 形参2, 形参...){ //函数体 return 返回值; } //可以通过变量来接收这个返回值 var 变量 = 函数名(实参1, 实参2, 实参3);

    函数的调用结果就是返回值，因此我们可以直接对函数调用结果进行操作。

    函数使用return语句后，这个函数会在执行完 return 语句之后停止并立即退出，也就是说return后面的所有其他代码都不会再执行。

    注：推荐的做法是要么让函数始终都返回一个值，要么永远都不要返回值

    函数里面可以调用其他的函数

    函数参数

    函数作为参数使用 如果一个函数作为参数,那么我们说这个参数(函数)可以叫回调函数

    function sayHi(fn) { console.log("hi"); fn();//fn此时应该是一个函数 } function Say() { console.log("hello"); } sayHi(Say);

    形参和实参

    形式参数：在声明一个函数的时候，为了函数的功能更加灵活，有些值是固定不了的，对于这些固定不了的值。我们可以给函数设置参数。这个参数没有具体的值，仅仅起到一个占位置的作用，我们通常称之为形式参数，也叫形参。实际参数：如果函数在声明时，设置了形参，那么在函数调用的时候就需要传入对应的参数，我们把传入的参数叫做实际参数，也叫实参。

    arguments的使用

    JavaScript中，arguments对象是比较特别的一个对象，实际上是当前函数的一个内置属性。也就是说所有函数都内置了一个arguments对象，arguments对象中存储了传递的所有的实参。arguments是一个伪数组，因此及可以进行遍历

    匿名函数

    匿名函数：没有名字的函数

    匿名函数如何使用：

    将匿名函数赋值给一个变量，这样就可以通过变量进行调用 匿名函数自调用

    关于自执行函数（匿名函数自调用）的作用：防止全局变量污染。

    函数作为参数

    因为函数也是一种类型，可以把函数作为两一个函数的参数，在两一个函数中调用

    函数做为返回值

    作用域

    作用域：变量可以起作用的范围

    全局变量和局部变量

    全局变量

    在任何地方都可以访问到的变量就是全局变量，对应全局作用域

    局部变量

    只在固定的代码片段内可访问到的变量，最常见的例如函数内部。对应局部作用域(函数作用域)

    不使用var声明的变量是全局变量，不推荐使用。 变量退出作用域之后会销毁，全局变量关闭网页或浏览器才会销毁 全局变量:声明的变量是使用var声明的,那么这个变量就是全局变量,全局变量可以在页面的任何位置使用 除了函数以外,其他的任何位置定义的变量都是全局变量 局部变量:在函数内部定义的变量,是局部变量,外面不能使用 全局变量,如果页面不关闭,那么就不会释放,就会占空间,消耗内存

    隐式全局变量:声明的变量没有var,就叫隐式全局变量 全局变量是不能被删除的,隐式全局变量是可以被删除的

    块级作用域

    任何一对花括号（｛和｝）中的语句集都属于一个块，在这之中定义的所有变量在代码块外都是不可见的，我们称之为块级作用域。 在es5之前没有块级作用域的的概念,只有函数作用域，现阶段可以认为JavaScript没有块级作用域

    作用域链

    将这样的所有的作用域列出来，可以有一个结构: 函数内指向函数外的链式结构。就称作作用域链。 就近原则，由里向外找，先找到的num的值就是num的值。

    预解析

    JavaScript代码的执行是由浏览器中的JavaScript解析器来执行的。JavaScript解析器执行JavaScript代码的时候，分为两个过程：预解析过程和代码执行过程

    预解析过程：

    把变量的声明提升到当前作用域的最前面，只会提升声明，不会提升赋值。把函数的声明提升到当前作用域的最前面，只会提升声明，不会提升调用。先提升var，在提升function

    JavaScript的执行过程

    // 如果变量和函数同名的话，函数优先 console.log(a);//a函数代码 function a() { console.log('aaaaa'); } var a = 1; console.log(a);//1

    变量提升

    变量提升

    定义变量的时候，变量的声明会被提升到作用域的最上面，变量的赋值不会提升。

    函数提升

    JavaScript解析器首先会把当前作用域的函数声明提前到整个作用域的最前面

    内置对象及常用方法

    string 字符串

    String对字符串的支持String.charAt( )返回字符串中的第n个字符String.charCodeAt( )返回字符串中的第n个字符的代码String.concat( )连接字符串String.fromCharCode( )从字符编码创建—个字符串String.indexOf( )检索字符串String.lastIndexOf( )从后向前检索一个字符串String.length字符串的长度String.localeCompare( )用本地特定的顺序来比较两个字符串

    数组方法（Array）

    constructor 所建立对象的函数参考

    prototype 能够为对象加入的属性和方法

    index 对于由正则表达式匹配创建的数组，字符串中匹配项的从零开始的索引

    input 对于由正则表达式匹配创建的数组，反映正则表达式与之匹配的原始字符串

    length 获取数组元素的个数,即最大下标加1

    concat(array1,arrayn)将两个或两个以上的数组值连接起来,合并后返回结果

    join(string) 将数组中元素合并为字符串,string为分隔符.如省略参数则直接合并,不再分隔

    pop() 移除数组中的最后一个元素并返回该元素

    push(value) 在数组的末尾加上一个或多个元素,并且返回新的数组长度值

    reverse() 颠倒数组中元素的顺序,反向排列

    shift() 移除数组中的第一个元素并返回该元素

    slice(start, deleteCount, [item1[, item2[,…[,itemN]]]]) 返从一个数组中移除一个或多个元素,如果必要,在所移除元素的位置上插入新元素,返回所移除的元素

    sort(compare Function) 在未指定排序号的情况下,按照元素的字母顺序排列,如果不是字符串类型则转换成字符串再排序,返回排序后的数组

    splice() 为数组删除并添加新的元素

    toSource() 显示对象的源代码

    toString() 将数组所有元素返回一个字符串,其间用逗号分隔

    unshift(value)为数组的开始部分加上一个或多个元素,并且返回该数组的新长度

    valueOf() 返回数组对象的原始值

    valueOf() 返回数组对象的原始值

    Array对数组的内部支持Array.concat( )连接数组Array.join( )将数组元素连接起来以构建一个字符串Array.length数组的大小Array.pop( )删除并返回数组的最后一个元素Array.push( )给数组添加元素Array.reverse( )颠倒数组中元素的顺序Array.shift( )将元素移出数组Array.slice( )返回数组的一部分Array.sort( )对数组元素进行排序Array.splice( )插入、删除或替换数组的元素Array.toLocaleString( )把数组转换成局部字符串Array.toString( )将数组转换成一个字符串Array.unshift( )在数组头部插入一个元素

    时间对象 Data

    时间对象是JavaScript的内置对象,使用前必须先声明 基本语法 var curr=new Data(); 注意这里的关键字new的用法，Data()的首字母必须大写

    Date对象提供了以下3类方法：

    Date操作日期和时间的对象Date.getDate( )返回一个月中的某一天Date.getDay( )返回一周中的某一天Date.getFullYear( )返回Date对象的年份字段Date.getHours( )返回Date对象的小时字段Date.getMilliseconds( )返回Date对象的毫秒字段Date.getMinutes( )返回Date对象的分钟字段Date.getMonth( )返回Date对象的月份字段Date.getSeconds( )返回Date对象的秒字段Date.getTime( )返回Date对象的毫秒表示Date.getTimezoneOffset( )判断与GMT的时间差Date.getUTCDate( )返回该天是一个月的哪一天(世界时)Date.getUTCDay( )返回该天是星期几(世界时)Date.getUTCFullYear( )返回年份(世界时)

    显示当前时间

    var now = new Date() var year = now.getFullYear() var month = now.getMonth() var date = now.getDate() ar hours = now.getHours() var min = now.getMinutes() var sec = now.getSeconds() var wee = now.getUTCDay() document.write(year+'-'+(month+1)+'-'+date+' '+hours+':'+min+':'+sec+' '+'星期'+wee)

    Math对象

    Math对象的作用是执行常见的算术任务。

    Math属性中最常用的属性就是PI了，我们一般用Math.PI来调用它。在控制台中输出它的值为3.1415926，也就是圆周率.Math对象的常用的属性主要就是PI了，其他的用的比较少.

    Math算术函数和常量Math.abs( )计算绝对值Math.acos( )计算反余弦值Math.asin( )计算反正弦值Math.atan( )计算反正切值Math.atan2( )计算从x轴到一个点之间的角度Math.ceil( )对一个数上舍入Math.cos( )计算余弦值Math.E算术常量eMath.exp( )计算exMath.floor( )对一个数下舍入Math.LN10算术常loge10Math.LN2算术常量loge2Math.log( )计算一个数的自然对数Math.max( )返回最大的参数Math.min( )返回最小的参数
    Processed: 0.008, SQL: 9