JS 基础知识

标识符

标识符就是一个名字，在JS中，标识符用来对变量和函数命名，或者用作JS代码中某些循环语句中的跳转位置的标记，JS的标识符必须以字母、_ 或者$ 符号开始，后续字符可以是字母、数字、_ 或者$ 字符。

变量声明

使用var 关键字声明变量
eg：
var book； var egg； //声明单个变量
var a，j，k ；//声明多个变量
声明+赋值：
var a=1,b=2,c=3;//声明多个变量并赋值

变量类型

JS的原始数据类型五种：Number、String、Boolea、Null、Undefined
undefined数据类型的值只有一个：undefined；
Null数据类型的值只有一个：null
变量类型：值类型和引用类型

引用类型：Object、Array、Function；应用类型是指针

值类型：String、Number、Boolean、Null、Undefined、Symbol

创建对象、数组

使用{ } 或者new 创建对象；JS中一切皆对象
var A = {}； //空对象
var B = new Object(); //创建空对象
var object = {name:“小李”,age:“20”};
object.sex = ‘女’； // 添加对象的属性成员

var C = [ ]; // 空数组
var D = new Array（）；
var C = [“a”,12,“b”]; //创建数组指定元素
var D = new Array(“a”,12,“b”) ;

JS常用知识

#1：监测一个对象是否是数组
对于简单的数据类型可以直接使用 typeof（）
对于复杂的数据类型（数组）可以使用 ** testArr instanceof Array**
#2：Array.isArray(param)； // 监测参数是否数组
#3：toString()： //把数组变成字符串，内容逗号连接数组元素
#4：arr.join(’,’)：// 数组中参数按照特定的字符连接成一个字符串

JS常用字符串操作函数

• 字符串转换： （1）num.toString()；（2）String()；（3）’’ + num;
• 字符串=》数组：将一个字符串切割为数组 str.split(’,’)
• 字符串查询：indexOf()：从字符串开头开始查找，找到返回对应索引，未找到返回-1；
• 字符串替换：replace()： str.replace(‘查找替换值’，替换后的值)；默认只替换一次，全局替换要用到正则；str.replace(‘查找替换值/g’,替换后的值)
• 字符串连接：（1）+；（2）concat()：str1.concat(str2,str3)
• 字符串切割，提取：

//第一种，使用slice():

var myStr = "I,love,you,Do,you,love,me";
var subStr = myStr.slice(1,5);//",lov"
//第二种，使用substring():

var myStr = "I,love,you,Do,you,love,me";
var subStr = myStr.substring(1,5); //",lov"
//第三种，使用substr():

var myStr = "I,love,you,Do,you,love,me";
var subStr = myStr.substr(1,5); //",love"

• 字符串匹配：（1）match()；（2）search()：返回查到的匹配的下标，如果匹配失败则返回-1.

var myStr = "I,love,you,Do,you,love,me";
var pattern = /love/;
var result = myStr.search(pattern);//2


var myStr = "I,love,you,Do,you,love,me";
var pattern = /love/;
var result = myStr.match(pattern);//["love"]
console.log(result);//未找到 返回null，找到 返回数组，包含index，input，group 元素

JS常用数组操作函数

• 数组中添加、删除元素
  #1：arr.push(param) 、数组末尾添加一个元素
  arr.pop()、数组末尾删除一个元素
  #2：arr.shift(param)、数组的最前边除去第一个元素
  arr.unshift()、数组的最前边添加一个元素
• 数组排序
  #1：reverse()：翻转数组
  #2：sort()：数组元素排序，默认按照首个字符的unicode编码排序；如果要是按数值排序，需要借助回调函数
• 数组元素的操作
  #1：concat：连接两个数组；arr1.concat(arr2)
  #2：slice()：数组截取 ；arr.slice(开始索引，结束索引)；原数组不变

var arr = [1, 2, 3, "a", "b", "c"];
console.log(arr.slice(3));      //从索引值为3截取到最后;["a", "b", "c"]
console.log(arr.slice(0,3));      //包左不包右;[1, 2, 3]
console.log(arr.slice(-2));      //负数是后几个;["b", "c"]
console.log(arr.slice(3,0));      //如果前面的比后面的大，那么就是[];[]
console.log(arr);             //原数组不被修改;[1, 2, 3, "a", "b", "c"]

#3：splice()：数组替换\删除；arr.splice(开始索引值，删除几个，替换内容1，替换内容2)；；原数组会发生变化；返回值却是被删除、替换的内容

var arr = [1,2,3,4,5,6,'a','b','c',]
var arr = [1,2,3,4,5,6,"a", "b", "c"]
arr.splice(5);    //从索引值为3截取到最后;(删除)
console.log(arr);   // [1, 2, 3, 4, 5]
arr.splice(1,2);  //(删除指定个数)从索引为1的开始删除2个
console.log(arr);  //[1, 4, 5]

#4：indexOf：arr.indexOf(param)；查找参数是否在数组中，找到返回1、未找到返回 -1

• 数组迭代的方法
  #1：every()：对数组中每一项运行回调函数，如果都返回true ，every返回true，如果有一项返回false，则停止遍历，every会立刻返回false。arr.every(function(item,index,arr){ return true})
  #2：filter()：对数组中每一项都运行回调函数，该函数返回结果true的项会组成一个新数组，常用语数组条件过滤，可以直接return 条件表达式

var arr = [1,3,5,7,9]
var arr1 = arr.filter(function(item){
	return item>5;
});
console.log(arr1);

#3：forEach(value，index，array)：和for循环一样，没有返回值
value：当前遍历的值
index：当前遍历（数组）对象的索引
array：当前遍历的数组
#4：map()：对数组中每一项运行回调函数，该返回函数的结果组成新的数组，

var arr = [111,222,333,444,555];
  var newArr = arr.map(function (element, index, array) {
    if(index == 2){
      return element; // 这里return了 所以下面返回的值是333
    }
    return element*100; // 返回的元素值都乘上100后的值
  })
  console.log(newArr); // [11100, 22200, 333, 44400, 55500]

#5：some()：对数组每一项进行回调函数，如果该函数返回一次true，则立刻返回true；常用场景也是监测数组中元素是否存在。

#6：find()：返回第一个通过测试的元素，如果没有满足条件的就返回undefined
#7：findIndex()：返回满足条件的元素索引值。

• 清空数组
  #1：arr.length=0、
  #2：arr=[ ]；可以操作伪数组
  #3：arr.splice(0)

JS事件

Event对象

Event对象代表事件的状态，比如事件在其中发生的元素、键盘按键的状态，鼠标的位置、鼠标的按钮的状态。
时间通常和函数结合使用，函数不会再事件发生前执行！

事件句柄：

• onchange()：HTML元素发生变化时触发
• onclick()：用户点击了HTML元素触发
• onmouseover()： 用户把鼠标移到HTML元素上触发
• onmouseout()：用户把鼠标移开HTML元素
• onload()：浏览器已经完成页面加载
• onblur()：元素失去焦点
• onfocus()：元素获得焦点
• onkeydown()：某个键盘按键被按下
• onkeypress()：某个键盘按键被按下

标准Event方法：

• initEvent()：初始化新创建的Event对象的属性
• preventDefault()：通知浏览器不要执行与事件关联的默认操作
• stoppropagation()：不在派发事件

我的易混知识点

1. JS中NAN，null，undefine的区别？
   NAN：not a number（非数），检测非数字的变量就返回NAN；
   null：表示空对象指针，若定义对象将来用于保存对象，可以初始化定义null，typeof返回的是object ；
   undefined：声明了变量，初始化未赋值；函数没有返回值，调用时也返回；typeof返回undefined。eg：var temp ；alert（null==undefined）；//true
2. JS中三个数组（字符串）检查是否存在？
   indexOf()、search()： str.indexOf(‘a’)；str.search(‘a’)；未找到都是返回-1（注意未找到是 -1）；
   match()： str.match(RegExp(/a/)); 存在 true，不存在false
   test()： RegExp(/a/).test(str);存在true，不存在false
   exec()： RegExp(/a/).exec(str);返回的是数组，未找到返回null
   php中检测字符串 ：strpos（str，find，start）
3. js中存储数据的三种方式：
   sessionStorage ；localStorage；cookier
   区别：
   cookier：保存数据量（4K）较小，本地的数据会发送给服务器，浪费带宽。
   sessionStorage 、localStorage；都可以永久存储
   localStorage：本地永久性存储，不删除，就会一直存在。
   sessionStorage ：用于本地存储一个会话（session）中的数据，一旦会话关闭，那么数据会消失，
4. JS中定时函数：
   window.setTimeout(“function”,time)；//设置一个超时对象，只执行一次,无周期
   window.setInterval(“function”,time)；//设置一个超时对象，周期＝’交互时间’;
   注意：函数都是不加括号的。
   清出未执行的定时函数：
   clearInterval(timmer)； timmer为定时器的名字。
   clearTimeout(timmer)；
5. JS中对象特殊性：
   js中，获取对象的长度，Object.keys(“key”).length，直接obj.length()是并不能生效的
   js中，对象的key如果是变量赋值，可以用类似数组的形式，obj [key]=value;场景是用于遍历追加对象的时候要用。
6. Content-type常用文档类型：
   #1：text/html：浏览器子接收到此类型文件时，会调用html解析器对文件进行相应的处理。eg < h1 >123< /h1 >, 浏览器输出： 123。
   #2：text/plain ：将文件设置成纯文本形式，浏览器接收到时不作任何处理。
   #3：application/x-www-form-urlencoded ：浏览器原生表单提交的类型，提交的数据按照key1=val1&key2=val2，key和val都进行url转码
   #4：multipart/form-data：常见的POST数据提交方式，使用表单上传文件时，必须使form的enctype=“multipart/forn-data”
   #5：applica/json：消息主题是序列化后的jJSON字符串。
   #6：text/xml ：是一种http传输协议，xml作为编码
7. js获取对象所有的key ，value值
   Object.keys() ,Object.values(), 返回值都是所有元素组成的字符串数组。 Object.values()不兼容ie11 或者低版本的浏览器，Object.keys()可以使用。我们可以重新定义Object.values()来兼容浏览器。
   
8. JS清空数组三种方法：
   #1：直接数组赋值[] eg：arr=[ ]
   #2：数组长度length赋值为0，eg: arr.length = 0; （最优法）
   #3：splice函数，从数组中删除元素，从头删到尾 eg：arr.splice(0,arr.length)
9. 基本类型和引用类型
   值类型（基本类型）：String，Number，Boolean，Null，Undefined
   引用类型：Array，Object，等有多个值构成的可变长度的复杂类型
   基本类型和引用类型的区别？
   （1）基本类型的变量保存的是变量值，引用类型保存的是内存地址
   （2）基本类型长度固定，在内存中占据固定的空间，数据存放在栈内存中；引用类型可以给对象添加属性和方法，长度不固定，数据存放在堆内存中。引用类型的存储需要栈区和堆区（堆区指内存中的堆内存）共同完成，栈区内存保存变量标识符和指向内存中该对象的指针，也可以说是该对象的堆内存的地址。
   （3）基本类型在赋值的时候是拷贝值，引用类型赋值的时候只拷贝地址，不拷贝值。
   （4）函数参数传递按值类型还是引用类型？
   基本类型参数的传递与基本类型的复制一样，传递的是变量值。引用类型参数的传递与引用类型的复制一样，传递的是内存地址。
10. 常用js数组转字符串
    （1）toString()：ArrayObject.toString() 返回值与没有参数的 join() 方法返回的字符串相同。
    （2）join()：arrayobject.join(’,’) 可以指定连接符
    （3）toLocalString(): 用法和toString（）大致类似。会按照本地习惯对数据加工，eg：var aa=1234 ; aa.toSting() //“1234”
    aa.toLocalSting()// “1,234” 国人习惯三位数加‘，’；
11. js截取字符串 方法
    （1）slice（start，end） 如果是字符串调用该函数，str.slice(3),会获得第四个字符以后的值；（注意：数组也可以调用该函数）
    （2）substr（startIndex，length） :第二个参数是截取字符串的长度（从起始点截取某个长度的字符串）
    （3）substring（start，end）：第二个参数是截取字符串最终的下标 （截取2个位置之间的字符串,‘含头不含尾’）
    substr（）和substing（）的区别？
    var a=“abcdefghiklmnopqrstuvwxyz”;
    var b=a.substr(3,5);//defgh
    var c=a.substring(3,5); //de