3.Javascript基础

map和Object的区别

//Object 结构提供了“字符串—值”的对应，Map 结构提供了“值—值”的对应，是一种更完善的 Hash 结构实现

正则表达式

\d	匹配一个数字,等价于[0-9]
\w	匹配字母、数字或者下划线,等价于 [A-Za-z0-9_]
+	匹配前面一个表达式 1 次或者多次
*	匹配前一个表达式 0 次或多次
/g	全局匹配

JSON

JSON 是一种基于文本的轻量级的数据交换格式。前端通过将数据结构转化为为 JSON 字符串，然后将它传递到后端，后端通过 JSON 格式的字符串解析后生成对应的数据结构，以此来实现前后端数据的一个传递

JSON.stringify：将数据对象转化为 JSON 格式的字符串
JSON.parse() ： 将JSON字符串解析为一个 js 数据结构

数组的方法

let c=nums.map(Math.sqrt)  map=>映射
//map对数组的每个元素依次进行处理，返回处理后的数组，不影响原数组，这里返回的是所有元素开方后的数组

nums.forEach(x=>console.log(x*2))
//forEach 用数组的每个元素调用函数，没有返回结果

nums.filter(function fn(value，index，arr){return value>3})    
//fileter用于使用函数返回筛选后的数组     
//value是必须的   index是当前元素的索引值  arr表示当前元素属于的数组对象

nums.every(x=>x>1)  //some是有一个满足就返回true
//检测是否数组每个元素都符合条件，返回true or false

nums.some(function(){return a>3})
//检测数组是否有元素符合条件，返回true 或false

let c=nums.reduce((pre,cur,index,arr)=>{},initialValue)
1、previousValue （上一次调用回调返回的值，或者是提供的初始值（initialValue））
2、currentValue （数组中当前被处理的元素）
3、index （当前元素在数组中的索引）
4、array （调用 reduce 的数组）
//reduce对数组从左到右调用函数，返回结果
var  arr = [1, 2, 3, 4];
var sum = arr.reduce(function(prev, cur, index, arr) {
    console.log(prev, cur, index);
    return prev + cur;
}，0) //注意这里设置了初始的返回值,不设置初始值没有第一行，默认从index=1开始
console.log(arr, sum);
//0 1 0
//1 2 1
//3 3 2
//6 4 3
//[1, 2, 3, 4] 10

reduceRight()
//reduceright是从右到左调用函数

nums.push()
//往数组后面添加元素，返回新的长度，改变数组

nums.pop()
//删除数组的最后一个元素，返回删除的元素

nums.shift('lemon')
//删除并返回数组的第一个元素

nums.unshift("Lemon","Pineapple")
//向数组开头添加一个或多个元素，返回新的长度

let a=concat(nums1,nums2)
//comcat 返回拼接后的数组，不影响原数组

nums.slice(start,end) //用于读取下标start(包含)到end(不包含)的数组，不改变原数组
[5,8,9,3].slice(1,3)   //[8，9]

splice //用于删除或添加,会影响原数组
//表示的意思是，从某个下标开始，删除多少个，然后添加后面的参数到该位置
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.splice(2,0,"Lemon","Kiwi");
console.log(fruits)
//Banana,Orange,Lemon,Kiwi,Apple,Mango

nums1.sort(function(a,b){return a-b});
//return a-b  从小到大排序，return b-a从大到小排序 ，会影响原数组

nums1.reverse();
//反转原数组，会影响原数组

nums.isArray()
//判断是不是一个数组，返回true or false

let c=nums.toString()
//toString将数组转化为字符串，用逗号连接

var c = nums.join("");
//join不传参数默认是逗号  即join()=join(',')
//join将数组转换为字符串并以指定的分隔符号分割，
[2,3,4].join('')  //'234'

nums.find(function fn(value，index，arr){return value>3})   
//find返回符合条件的第一个元素

nums.findIndex()
//返回符合条件的一个个元素的下标

forEach和map方法有什么区别

forEach()方法会针对每一个元素执行提供的函数，对数据的操作会改变原数组，该方法没有返回值；
map()方法不会改变原数组的值，返回一个新数组，新数组中的值为原数组调用函数处理之后的值；

字符串拼接

//1.使用模板字符串   tip：字符串不能使用push
str='a' strs='haha'
b='`${strs}${str}`'  //hahaa

字符串方法

let result=s.split('t')  //将字符串根据t分割成字符串数组并返回
s.substring(from, to)//返回从from(包括)到to(不包括)的字符串

字符串、数组、数字间的转换

//字符串 >数字
let str='12345' 
res1=parseInt(str)//12345
//字符串 >数组
res2=str.split('')//['1','2','3','4','5']
[...'hello']    // [ "h", "e", "l", "l", "o" ]

//数组   >字符串
let arr=[1,2,3,4,5]
res3=arr.toString() // '1,2,3,4,5'
//数组   >数字
res4=arr.join('') //join不传参数默认是逗号  即join()=join(',')
res4_1=parseInt(res4) //12345

//数字   >字符串
let num=12345
res5=num.toString() //'12345'
//数字   >数组
res6=num.toString().split('').map(el=>parseInt(el)) //[1,2,3,4,5]

Math方法

Math.obs(-1)  //1    取绝对值
Math.floor(1.8)//1   向下取整
Math.ceil(1.2) //2   向上取整

类数组对象

//定义：类数组对象和数组类似，但是不能调用数组的方法。常见的类数组对象有 arguments 和 DOM 方法的返回结果
//常见的转化方法是通过call调用数组的方法来进行转化
Array.prototype.slice.call(arrayLike);
Array.prototype.splice.call(arrayLike, 0);
Array.prototype.concat.apply([], arrayLike);

Array.from(arrayLike);
[...arrayLike]      //扩展运算符

怎么遍历函数的arguments

//1.使用数组的方法遍历
 Array.prototype.forEach.call(arguments, a => console.log(a))
//2.arguments转化为数组

位运算符

//1.取反运算符 (~)  : 将一个数据按二进制进行“取反”运算
 当发现按位取反为负数时，就直接取其补码，补码不懂看4

//2.左移运算符（<<） ：将一个运算对象的各二进制位全部左移若干位，左边的二进制位丢弃，右边补0
 a=1010 1110
 a = a<< 2 
 将a的二进制位左移2位、右补0，即得a=1011 1000。 
 若左移时舍弃的高位不包含1，则每左移一位，相当于该数乘以2，2位就是乘以4
  
//3.右移运算符（>>） ：将一个数的各二进制位全部右移若干位，正数左补0，负数左补1，右边丢弃。
 a=a>>2     操作数每右移一位，相当于该数除以2。

//4.原码、补码、反码
 计算机有符号数有三种表示方法，即原码、反码和补码，最高位用0和1表示符号
 对于正数,它的3种码相同

负数的：

负数的反码为除符号位，按位取反   负数的补码=反码+1
例如：-10

原码：1000 1010
反码：1111 0101
补码：1111 0110

JavaScript为什么要进行变量提升

js代码分为解析和执行阶段，变量提升发生在解析的时候。

变量提升好处：
1.在JS代码执行之前，会进行语法检查和预编译，预编译的时候变量提升帮助统计声明了哪些变量和函数，这样在执行到函数时预先变量分配空间，不用重新解析函数体代码，提高了效率。

2.声明提升还可以提高JS代码的容错性，使一些不规范的代码也可以正常执行，
如a=3 var a

常见的DOM操作

//1.Dom节点的获取
getElementById // 按照 id 查询
getElementsByTagName // 按照标签名查询    返回集合
getElementsByClassName // 按照类名查询	返回集合

querySelectorAll // 按照 css 选择器查询	返回集合
document.querySelectorAll('#id')[0]
document.querySelectorAll('#id').length  //返回长度
//括号里填的是css选择器  #id .class  p.class

//2.Dom节点的创建
// 首先获取父节点
var container = document.getElementById('container')
var targetSpan = document.createElement('span')// 创建新节点
targetSpan.innerHTML = 'hello world' // 设置 span 节点的内容
container.appendChild(targetSpan) // 把新创建的元素塞进父节点里去

//3.Dom节点的删除
// 获取目标元素的父元素
var container = document.getElementById('container')
// 获取目标元素
var targetNode = document.getElementById('title')
// 删除目标元素
container.removeChild(targetNode)

强类型与弱类型语言

强类型语言要求所有变量都必须先定义后使用，且不转换永远是这个数据类型  如Java和C++
弱类型语言简单理解就是一种变量类型可以被忽略的语言，如Js可以将字符串'12'和整数3进行连接得到字符串'123'
总结：强类型语言在速度上可能略逊色于弱类型语言，但是强类型语言带来的严谨性可以有效地帮助避免许多错误。

解释性语言与编译型语言

编译型语言写的程序执行之前，需要一个专门的编译过程，把源代码编译成机器语言的文件，如exe格式的文件，以后要再运行时，直接使用编译结果即可，如直接运行exe文件。因为只需编译一次，以后运行时不需要编译

一次性的编译成平台相关的机器语言文件，运行时脱离开发环境，运行效率高；
与特定平台相关，一般无法移植到其他平台；
C、C++等属于编译型语言。

前者源程序编译后即可在该平台运行，后者是在运行期间才编译。所以前者运行速度快，后者跨平台性好。

for in与for of 使用方法及区别

// for in得到的是对象的key或数组,字符串的下标；for of和forEach一样,是直接得到值
for…of 是ES6新增的遍历方式

for…in 获取的是对象的键名；  for…of 遍历获取的是对象的键值，
for… in 会遍历对象的整个原型链，性能非常差不推荐使用，而 for … of 只遍历当前对象不会遍历原型链；
对于数组的遍历，for…in 会返回数组中所有可枚举的属性(包括原型链上可枚举的属性)，for…of 只返回数组的下标对应的属性值；

总结： for…in 循环主要是为了遍历对象而生，不适用于遍历数组；for…of 循环可以用来遍历数组、类数组对象，字符串、Set、Map 以及 Generator 对象（Object对象没有Iterator，手动加遍历器才能遍历）