1.JavaScript简介
1.1 javascript的组成部分
(1)ECMAScript,形容了该语言的语法和根本对象(2)文档对象模型(DOM),形容解决网页内容的办法和接口(3)浏览器对象模型(BOM),形容与浏览器进行交互的办法和接口。
1.2 javascript的特点
(1)解释型语言,nodejs为其解释器(2)弱类型语言,变量的数据类型取决于值的数据类型 a.变量的数据类型在初始化的时候确定 b.变量得数据类型能够随时发生变化 c.类型细分不显著(3)按程序解释执行,即从上到下执行(4)既能够作为前端脚本语言,也能够作为后端语言,取决于利用平台和应用的框架
1.3 在body和head中应用JavaScript的区别
(1)在body局部中的JavaScript会在页面加载的时候被执行,在head局部中的JavaScript会在被调用的时候才执行。(2)浏览器解析Html是从上到下解析的。把JavaScript放在head里时,则先会被解析,但因为这时body还没有解析,所以会返回空值。个别都会绑定一个监听,当全副的html文档解析完之后再执行代码。
1.4 JavaScript数据类型
(1)5个根本数据类型(值类型):字符串(String)、数字(Number)、布尔(Boolean)、对空(Null)、未定义(Undefined)、Symbol(es6中新增,示意举世无双的值)(2)援用数据类型:对象(Object)、数组(Array)、函数(Dunction)
1.5 Undefined与Null关系
(1)undefined继承null,所以undefined==null后果为true,然而null示意空对象,undefined示意未定义(2)null与undefined用处不同,null能够用来示意一个空对象,然而没有必要把一个变量的值显式设置为undefined。(3)undefined===null为false,因为类型不同。
1.6 实现深拷贝的办法
(1)通过json对象实现深拷贝(JSON.stringify,JSON.parse)(2)Object.assign()拷贝(3)lodash函数库实现深拷贝(4)递归的形式实现深拷贝
2 操作符及类型转换
2.1 操作符
2.1.1 算数运算符(5种)
(1) + 加法(2) - 减法(3) * 乘法(4) / 除法(5) % 取余
2.1.2 一元运算符(8种罕用)
(1) + 将操作数转换成数字,字符串的拼接(2) - 将操作数转换成数字,同时变为正数(3) !逻辑取反运算(4) ++ 递增(5) -- 递加(6) delete 删除数组或对象中特定索引的值(7) typeof 返回以后操作数的类型(8) void void运算符对任何值返回undefined
2.1.3 赋值运算符(6种)
(1) =(2) +=(3) -=(4) *=(5) /=(6) %=
2.1.4 比拟运算符(8种)
(1) == 等于(2) === 值相等并且类型相等(3) != 不相等(4) !== 值不相等或类型不相等(5) > 大于(6) < 小于(7) >= 大于或等于(8) <= 小于或等于
2.1.5 逻辑运算符
(1) && and(同真才真,有假则假)(2) || or(有真才真,有假则假)(3) ! not
2.2 JavaScript隐式转换
2.2.1 原始类型转换
(1)加减乘除:1.字符串加数字,数字就会转成字符串。数字加数字或字符串加字符串不须要转换。 在加法的过程中,首先把等号左右两边进行了求原值ToPrimitive()操作,而后如果有两个或多个原始值只有有一个是String类型,就把两个或多个原始值都进行转化字符串toString()操作,进行字符串拼接;否则把两个或多个原始值都进行转化数字toNumber()操作,进行数字相加。(2)数字减字符串,字符串转成数字。如果字符串不是纯数字就会转成NaN。字符串减数字也一样。两个字符串相减也先转成数字。(3)乘,除,大于,小于跟减的转换也是一样。(4)无关==的隐式转换 a.undefined等于null b.字符串和数字比拟时,字符串转数字 c.数字和布尔比拟时,布尔转数字 d.字符串和布尔比拟时,两者转数字
2.2.2 援用类型的转换
(1)如果PreferredType被标记为Number,则会进行上面的操作流程来转换输出的值。 a.如果输出的值曾经是一个原始值,则间接返回它 b.否则,如果输出的值是一个对象,则调用该对象的valueOf()办法,如果valueOf()办法的返回值是一个原始值,则返回这个原始值。 c.否则,调用这个对象的toString()办法,如果toString()办法返回的是一个原始值,则返回这个原始值。 d.否则,抛出TypeError异样。(2)如果PreferredType被标记为String,则会进行上面的操作流程来转换输出的值 a.如果输出的值曾经是一个原始值,则间接返回它 b.否则,调用这个对象的toString()办法,如果toString()办法返回的是一个原始值,则返回这个原始值。 c.否则,如果输出的值是一个对象,则调用该对象的valueOf()办法,如果valueOf()办法的返回值是一个原始值,则返回这个原始值。 d.否则,抛出TypeError异样。留神:PreferredType的值会依照这样的规定来主动设置: a.该对象为Date类型,则PreferredType被设置为String b.否则,PreferredType被设置为Number
2.2.3 冒泡排序
// 冒泡排序//1、比拟相邻的两个元素,如果前一个比后一个大,则替换地位。//2、比拟完第一轮的时候,最初一个元素是最大的元素。//3、这时候最初一个元素是最大的,所以最初一个元素就不须要参加比拟大小。function bubbleSort(arr) { var len = arr.length; //外层管制循环多少趟 for (var i = 0; i < len-1; i++) { //内层管制每一趟的循环次数 for (var j = 0; j < len - 1 - i; j++) { // 相邻元素两两比照,元素替换,大的元素替换到前面 if (arr[j] > arr[j + 1]) { var temp = arr[j]; arr[j] = arr[j+1]; arr[j+1] = temp; } } } return arr;}//举个数组var arr = [20,18,27,19,35];//应用函数bubbleSort(arr)
2.2.4 break和continue的区别
(1) 当执行brea后,会立刻跳出循环体(2) 当执行continue时,不会跳出循环,而是立刻完结以后循环,进入下一次循环。
3.函数
3.1 函数的作用
(1)性能的封装(2)间接调用(3)代码复用率进步
3.2 函数申明
(1)函数申明 function 函数名(形参列表){ //函数体 }(2)函数表达式 var 函数名 = function(形参列表){ //函数体 } 这种模式看起来像惯例的变量赋值,先创立一个匿名函数,而后赋值给变量函数名。咱们晓得在JS中如果要想应用一个变量,必须先给这个变量赋值,所以函数表达式也不例外,在调用之前,必须先给它赋值。否则会报错。
3.3 函数外部属性
(1)arguments a.函数的参数在函数外部是应用一个类数组对象来示意的。这个类数组对象就是arguments。 b.arguments是一个类数组对象,蕴含着传入函数中的所有参数。arguments主要用途是保留函数参数,然而这个对象还有一个名为callee的属性,该属性是一个指针,指向领有这个arguments对象的函数 c.arguments保留真正的实参(2)this 面向对象语言中 this 示意以后对象的一个援用。 a.在办法中,this 示意该办法所属的对象。 b.如果独自应用,this 示意全局对象。 c.在函数中,this 示意全局对象。 d.在事件中,this 示意接管事件的元素。 e.在显式函数绑定时,咱们能够本人决定this的指向
3.4 IIFE 自执行函数
(1)IIFE :意为立刻调用的函数表达式,也就是说,申明函数的同时立刻调用这个函数(2)作用 a.页面加载实现后只执行一次的设置函数。 b.将设置函数中的变量包裹在部分作用域中,不会泄露成全局变量。(3)函数的申明和IIFE的区别 在函数的申明中,咱们首先看到的是function关键字,而IIFE咱们首先看到的是右边的(。也就是说,应用一对()将函数的申明括起来,使得JS编译器不再认为这是一个函数申明,而是一个IIFE,即须要立即执行申明的函数。两者达到的目标是雷同的,都是申明了一个函数并且随后调用函数foo。(4)IIFE的写法 a.对返回后果不进行解决 (function(形参){ 函数体内容 })(实参); b.对返回后果不进行解决 (function(形参){ 函数体内容 }(实参)); c.返回的是一个布尔值,而后进行取反 !function(形参){ 函数体内容 }(实参) d.对于数字返回的是原来的后果,非数字返回NaN +function(形参){ 函数体内容 }(实参) e.对于数字返回的是正负符号相同,非数字返回NaN -function(形参){ 函数体内容 }(实参) f.对于数字返回的是正负符号相同再减1,非数字返回-1 ~function(形参){ 函数体内容 }(实参) g.返回的后果是undefined void function(形参){ 函数体内容 }(实参)(5)案列-经典面试题-IIFE for (var i = 0; i < 6; i++) { function output() { console.log(i); // 为什么输入的是6,而不是0,1,2,3,4,5 // 因为输入的 i 是全局作用域的,当循环完结后 i 的值是 6,所以输入的 i 就是6。 } } output() for (var i = 0; i < 6; i++) { (function (j) { console.log(j); //0,1,2,3,4,5 })(i) // 因为 JS 中调用函数传递参数都是值传递 ,所以当立刻执行函数执行时,首先会把参数 i 的值复制一份,而后再创立函数作用域来执行函数,循环5次就会创立5个作用域,所以每个输入拜访的都是不同作用域的 i 的值 。 }(6)为什么须要IIFE? IIFE的呈现是为了补救JS(ES5)在作用域方面的缺点:JS只有全局作用域(global scope)、函数作用域(function scope),从ES6开始才有块级作用域(block scope)(7)回调函数的作用 回调函数个别都用在耗时操作下面:因为主函数不必期待回调函数执行完,能够接着执行本人的代码。比方ajax申请,比方解决文件等。(8)什么是闭包? 闭包就是指有权拜访另一个函数作用域中的变量的函数(9)闭包的生成有三个必要条件 a.函数嵌套函数 b.外部函数援用了内部函数中的数据(属性、函数) c.参数和变量不会被回收(10)闭包的用处 a.能够读取函数外部的变量 b.让这些变量的值始终保持在内存中。(11)应用闭包的毛病 a.因为闭包会使得函数中的变量都被保留在内存中,内存耗费很大,所以不能滥用闭包,否则会造成网页的性能问题 b.闭包会在父函数内部,扭转父函数外部变量的值,当父级的变量对象被批改时,所有子函数都受到影响
4. 数组
4.1 数组的个性
(1)每一项都能够保留任何类型的数据。(2)数组的大小是能够动静调整。(3)数组的length属性:可读可写,能够通过设置length的值从数组的开端移除项或向数组中增加新项
4.2 数组的创立
(1)字面量创立数组 由一对包含元素的方括号"[]"示意,元素之间以逗号","隔开 var arr = [12,name,true,"larry",{},function(){},[],null];(2)通过Array构造函数来创立数组 var names = new Array(); var names = new Array('terry','robin')
4.3 数组拜访
拜访数组元素 数组变量名[索引]通过索引拜访数组,数组的索引从0开始,数组的索引超过数组长度会拜访到undefined值而不会报错。数组的长度通过length属性获取 a) [index] 间接拜访,索引能够超过索引范畴,只不过拜访的值为undefined b) length-1=Max(index) c) length+N 或 length-N 开拓新的内存空间 或 数组元素的删除
4.4 数组API
4.4.1 数组序列化
(1) toString() 在默认状况下都会以逗号分隔字符串的模式返回数组项 var arr = [1,5,2,8,10,{a:1}]; console.log(arr.toString());//”1,5,2,8,10,[object Object]”(2)join() 应用指定的字符串用来分隔数组字符串 var arr = [1,5,2,8,10,{a:1}]; console.log(arr.join("-"));//”1-5-2-8-10-[object Object]”
4.4.2 构造函数的办法
(1) Array.isArray() 用来判断某个变量是否是一个数组对象(2) Array.from() 从类数组对象或者可迭代对象中创立一个新的数组实例。(3) Array.of() 依据一组参数来创立新的数组实例,反对任意的参数数量和类型。
4.4.3 栈与队列办法
(1) Array.prototype.push() push() 办法可向数组的开端增加一个或多个元素,并返回新的长度。(2) Array.prototype.pop() pop() 办法用于删除数组的最初一个元素并返回删除的元素。(3) Array.prototype.shift() shift() 办法用于把数组的第一个元素从其中删除,并返回第一个元素的值。(4) Array.prototype.unshift() unshift() 办法可向数组的结尾增加一个或更多元素,并返回新的长度。
4.4.4 排序办法
(1) Array.prototype.reverse() reverse() 办法用于颠倒数组中元素的程序。(2) Array.prototype.sort() sort() 办法用于对数组的元素进行排序 如果调用该办法时没有应用参数,将按字母程序(Ascall编码)
4.4.5 操作方法
(1) Array.prototype.concat() concat() 办法用于连贯两个或多个数组(2) Array.prototype.slice() slice()办法可提取字符串的某个局部,并以新的字符串返回被提取的局部(3) Array.prototype.splice() splice() 办法用于增加或删除数组中的元素。
4.4.6 地位办法
(1) Array.prototype.indexOf() indexOf() 办法可返回数组中某个指定的元素地位。(2) Array.prototype.lastIndexOf() lastIndexOf() 办法可返回一个指定的元素在数组中最初呈现的地位,从该字符串的前面向前查找。
4.4.7 迭代办法
(1) Array.prototype.every() every() 办法用于检测数组所有元素是否都合乎指定条件(通过函数提供)。 every() 办法应用指定函数检测数组中的所有元素: - 如果数组中检测到有一个元素不满足,则整个表达式返回 false,且残余的元素不会再进行检测。 - 如果所有元素都满足条件,则返回 true。 (2) Array.prototype.some() some() 办法用于检测数组中的元素是否满足指定条件(函数提供)。 some() 办法会顺次执行数组的每个元素: - 如果有一个元素满足条件,则表达式返回*true* , 残余的元素不会再执行检测。 - 如果没有满足条件的元素,则返回false。 (3) Array.prototype.filter() filter() 办法创立一个新的数组,新数组中的元素是通过查看指定数组中符合条件的所有元素。 (4)Array.prototype.map() map() 办法返回一个新数组,数组中的元素为原始数组元素调用函数解决后的值。 (5) Array.prototype.forEach() forEach() 办法用于调用数组的每个元素,并将元素传递给回调函数。