JavaScript知识点整理（一）

JavaScript知识点（一）包括 数据类型、表达式和运算符、语句、对象、数组。

一、数据类型

1） js中6种数据类型：弱类型特性
    5种原始类型：number(数字)、string(字符串)、boolean（布尔值）、null 、undefined
    1种对象类型：object对象(函数function 数组array 日期Date等)

2）数字转换字符串可以的+""，字符串转换数字可以-0

例：var num = 32;
   num = "this is a string"
   32 + 32     //结果为64
   "32" + 32   //结果为"3232" （会被认为字符串拼接）
   "32" - 32   //结果为0 （被认为数字相减）   

3）等于与严格等于:

严格等于===：
   如果两边类型不同，直接返回false
   类型相同：
           null===null
           undefined===undefined
           NaN≠NaN  (NaN不等于任何，包括本身)
           new object≠new object  (js中对象是通过引用来比较而不是通过值比较)
等于==:
   若类型相同，同===
   若类型不同，尝试类型转换和比较：
如：
   null==undefined相等
   number==string 会尝试把字符串转换为数字  1=="1.0"//true
   boolean==?  会将boolean转换为数字，true转成1，false转成0  1==true//true
   object==number|string会尝试把对象转为基本类型 new string("hi")=="hi"//true
   其他情况：false

  例： "1.23"==1.23
        0==false
        new Object()==new Object()
        [1,2]==[1,2]

4）javascript包装对象

javascrpt隐藏机制：当把一个基本类型以对象的形式去使用的时候，javascript会将其转换为包装类型对象，相当于new一个string .
但是当操作完毕后这个临时包装对象就会被销毁，无法调用。

例：

var a="string";
a.length;//6
a.t=3;
alert(a.t);//undefined
当尝试以对象的方式使用一个string/number/boolean基本类型的时候,
比如访问这个字符串的length属性或增加一个属性，JavaScript只能把这个基本类型转换成包装类型对象。
当设置完成后，这个临时对象会被销毁掉。所以再次访问该属性，就是undefined。
演示效果：

 

二、表达式和运算符

1）表达式：

1. 原始表达式 //常量、直接量、关键字、变量 3.14、"test"、null、i、k、j
2. 数组、对象的初始化表达式 //[1,2]、{x:1, y:2}

 [1, 2] 等价于 new Array(1, 2);
 [1, , , 4] 等价于 [1, undefined, undefined , 4]

 {x:1,y:2}等价于
 var o=new Object();
 o.x=1;o.y=2;

3. 函数表达式 //var fe = function(){}、(function(){})() 
4. 属性访问表达式 //var o = {x:1}、o.x、o['x'] 
5. 调用表达式 //func() 
6. 对象创建表达式：

var temp=new Func(1,2)//有参数,没有参数时也可以把括号直接去掉
var temp=new Object;//没有参数

2）运算符

特殊运算符的种类：
1、条件运算符 c?a:b c为true 则取a,否则取b
2、逗号运算符 a,b 例如 var s = (1,2,3),则s依次赋值，最后输出为3
3、delete运算符 delete obj.x 删除对象obj中的x属性 在IE9下，obj中必须configurable:true 才可以删除，否则无效
4、in运算符 判断obj是否有值或window里是否有变量，返回布尔值 例如 attr in json 或 'document' in window
5、instanceof 判断对象类型 {} instanceof Object // true（返回布尔值）
6、new运算符 创建一个新对象 new obj / new array ...
7、this对象 全局用指向window，函数内指向函数本身，浮动指针
8、typeof 判断对象，返回对象类型 例如 typeof 100 === 'number' // true（判断对应类型字符串）
9、void 一元的，判断所有值，返回均为undefined
一般delete 运算符可以删除对象的属性，而如果使用方法Object.defineProperty(对象,'属性',{configurable:false})处理了对象，该属性就不会被删除，反之ture就是可以被删除

三、语句

1） 以{}组成块block，常用于for循环和if判断语句中，要注意没有块级作用域，比如for循环中var i=0；写在（）内和写在for循环外面是一样的；还是属于全局变量；
在函数内定义 var a=b=1；会隐式定义出全局变量b；在函数外获取不到a，为undefined，但可以获取到b，a=1,b=1解决
在ES6面试之后有了let，即开始有了块级作用域。

var声明变量：

var a=1;
var a=b=1;
function  fuc(){
  var a=b=1;
}
func();
console.log(typeof a)//undefined  局部变量 外部不可访问
console.log(typeof b)//number  (隐式创建了全局 变量)

2）

try - catch - finally 语句：
1.使用throw 抛出的异常，需要被catch 处理，无论是否有catch 处理，都会执行finally 
2.若嵌套try - catch - finally 语句，先看内层 throw 的error 是否被内层的catch处理，否则则被外层 catch 处理。
3.若内层 catch 处理时，也throw 了 error，则外层catch 仍会处理。否则，外层catch 不执行。
4.try语句如果抛出异常，则执行catch语句，否则不执行，无论有没有异常，都执行finally语句；try语句必须跟catch或finally语句中至少一个组合使用。
try catch语句的嵌套语句执行顺序：
1）如果内部嵌套的try语句抛出异常，但内部没有相配套的catch语句，先执行内部的finally语句，然后跳到最近一层的catch语句执行。
2）如果内部嵌套的try语句抛出异常，内部有相配套的catch语句，先执行此语句处理异常，再执行内部的finally语句。不会再在外部处理异常。
3）如果内部嵌套的try语句抛出异常，内部有相配套的catch语句，并且catch语句也抛出异常，如果内部的catch语句有对异常的处理，
   先执行异常处理语句，然后执行内部的finally语句，最后执行离内部catch语句抛出异常最近一层的catch语句处理异常。

3) 

function fun() 这个叫函数声明，会预先处理，所以调用能写到声明前面。
var fe = function(){}则不可以。

1、for in遍历的时候，顺序不确定，如果要按顺序显示，不要用for in
2、enumerable（枚举）为false时不会出现
3、for in对象属性时受原型链影响，如果原型链上有其他值，也会在for in 的时候出现。

4）严格模式

JS的严格模式：
定义和优点：严格模式是一种特殊的执行模式，它修复了部分语言上的不足（禁用with），
提供了更强的错误检查（重复属性，删除delete不可配置的属性等），并增强了安全性（在eval中使用独立作用域等）；
模式的使用：
（1）function func(){'use strict';}好处：向上兼容
（2）'use strict'; function func(){}指定整个js内的代码都是在严格模式下
与普通模式的区别：
在严格模式下：①不允许使用with；
            ②不允许未声明的变量被赋值
            ③arguments变为参数的静态副本，不管参数传与不传，对arguments无影响，但是对象的属性除外；
            ④delete参数，函数名报错
            ⑤delete不可配置的属性报错
            ⑥对象字面量重复属性名报错
            ⑦禁止八进制字面量
            ⑧eval，arguments变为关键字，不能作为变量、函数名
            ⑨eval变为独立作用域，其它地方不可以拿到eval的值；

四、对象

1.对象:对象中包含一系列的属性，这些属性是无序的，每个属性都有一个字符串key和对应的value；
var obj ={ x:1,y:2};
obj.x;//1
obj.y;//2

2.对象构造：
除了本身被赋予的值之外，对象还有几个隐藏标签：
proto：对象的对象属性prototype上的赋值，每一个对象都有一个原型[prototype]                            
class：对象的种类，表示属于哪一个类
extensible：表示是否允许该对象继续增加新的属性
另外对象的值(如 x=1)，也有对应的属性或方法，提供一些访问权限的控制
writable：是否可写
enumerable：是否能被删除
configurable:是否能够枚举
value：值
get/set：

3.创建对象的方法：
1) 对象字面量
     var obj1 = { x:1 , y:2);
2) new/原型链
     function foo(){}
     foo.prototype.z=3;
     var obj = new foo();

注意：给对象赋值时，并不会去查找原型链，仅在该对象内查找，有则覆盖，无则创建。
如：

1、obj.z=5;-->若给obj赋值，并不会去原型链上查找，会看obj上是否有这个值，有就能修改，没有就仅在当前对象添加值
2、delete obj.z后，通过obj.z访问到的是原型上的z；delete obj.z只能delete当前对象的属性而不会去影响到原型链

obj.z = undefined; 并不一定代表 obj 上没有z属性，可能是有，其值为undefined。 如果想继续使用原型链上的z ，
需要delete obj.z 用直接赋值法创建对象时，对象的属性可以通过hasOwnProperty和in（in会向上找到原型链）来判断是否是对象本身中的属性，还是对象自己添加的属性。
注意：对象自己添加的属性可以通过delete来删除，但不能用delete删除原型上的属性。
同时，发现一个属性值为undefined不一定是这个值未定义，也有可能是有这个属性，其属性值就是undefined

3）var obj = Object.create({x:1})

Object.create：
var obj = Object.create({x:1}); Object.create()是一个系统内置的函数，其参数通常为一个对象，
该方法返回一个新创建的obj对象，并且该obj对象的原型指向这个参数对象，而参数对象原型指向Object.prototype。
并不是所有的对象都有.toString()方法，因为不是所有的对象的原型链上都有Object.prototype属性
例：
var obj = Object.create(null);
obj.toString // undefined

 

4.属性操作

1） 用for-in遍历时，原型链上的属性也会被遍历到，而且是无序遍历。
2） 属性删除用delete, prototype属性不可被删除；
   var定义的变量也不可用delete删除，函数也不可以被delete掉
  （经验证，不同的内核实现方式不同，在chrome下不可被delete掉，返回false，但在firefox和IE10下可以被delete掉，返回true，对于函数也是相同的结果）
   eval()里面用var定义的变量可以用delete删除。

3）configurable：是否可配置。getOwnPrototypeDescriptor（属性所在的对象，属性名）
4）in操作符会向原型链向上查找的，hasOwnProperty 是检测对象在排除原型链的情况下是否具有某个属性（用在for in判断过滤原型上的属性）。
5）Enumerable：是否可枚举。 
6）Object.defineProperty自定义对象属性(参数：属性所在的对象，属性名，描述符对象)
   Object.defineProperty(obj,"price",{enumerable:false,configurable:false,value:1999})//
   obj.hasOwnProperty("price")//判断是否是自身属性
   obj.propertyIsEnumerable("price")//判断是否可枚举
7）！=undefined就是不等于null和undefined
8）delete 可以删除对象的属性，删除不了全局变量和局部变量，隐士声明全局变量和在eval 中声明的变量可以删除

注意：

判断某个属性是否存在与某个对象中,可以通过in运算符,hasOwnProperty()和propertyIsEnumerable()方法来完成.
in运算符,如果对象的自有属性或继承属性中包含这个属性,则返回true.
对象的hasOwnProperty()方法用来检测给定的名字是否是对象的自有属性.
propertyIsEnumerable()是hasOwnProperty()的增强版,只有检测到时自有属性且这个属性的可枚举性为true时才能返回true.

5.get/set方法

var obj = new foo();
obj.z; //1 
obj.z = 10;
obj.z;// still 1
如果对象的原型链上有 z 属性，且z 属性有 get/set 方法，则不会直接在obj 上添加 z 属性，而是使用 obj的原型链上的get/set 方法。
此种情况下希望在 obj 上添加 z 属性，需要使用defineProperty()方法，此方法默认所有标签为false
若以后需要delete obj 上的z 属性，需把configurable:true

例：

val = +val; 一元操作符的使用，让传入的值转换成相应的数字，如果原来就是数字或者转换成功，则后续操作就用数字进行，如果转换失败，将返回NaN...

 

6.属性标签

Object.getOwnPropertyDiscriptor(obj,"x")//获取对象的属性标签
修改多个属性标签
Object.defineProperties(obj,{
title:{value:"xxx"},
name:{configurable:true}
sex:{
get:function(){
                return "nan"
              }
     }
}
);

标签属性：
configurable :是否可以配置属性，可以用来设定是否能够删除
writable:设置是否可以写入，可以用来设定是否能够进行重新赋值
enumerable:设置是否可以进行枚举
value:指定默认值

 

7.对象标签、标签序列化

1）对象标签：
[[proto]]:原型链
[[class]]：toString
[[extensible]]：表示对象的属性是否可以添加。
object.preventExtensible(obj);//使obj对象不可新增属性，原属性可改、可删
Object.seal(obj);//使obj不可新增属性，原属性可改但不可删
Object.freeze(obj);//使obj不可新增属性，原属性不可更改、删除
注意，当Object.freeze(obj)后，Object.isSeal(obj)返回的也是true，也就是说，Object.isSeal(obj)返回true，其原属性也可能不可改。

2）序列化
通过全局的JSON.stringify(obj);做序列化处理
注意：
1、当你对象中有属性的值是undefined的时候，这该属性是不会出现在序列化字符串的结果里
2、当你属性的值是NaN或者Infinity时，序列化的结果是null；当你的属性值是new Date（），序列化的结果是UTC的时间格式
后端返回JSON数据，则用JSON.parse来转化；合法的JSON的属性必须用双引号引起来

五、数组

1) 创建数组、数组操作
1、JS中的数组是弱类型的  数组中可以含有不同类型的元素 数组元素甚至可以是对象 或者其他数组；
2.创建
   2.1 字面量
           var arr = ['ds','aa'];
   2.2 new  Array构造器
           var arr = new Array();
           var arr = new Array(10); 则表示该数组有10个空元素(只有一个值的时候表示有多少元素)
           var arr = new Array('a','b'); 等价于 ['a','b'];
         new  是可以省略的
3.数组的读写
 数组元素增减
 用delate可以删除元素，但是数组长度不变，其实delate之后，是设置元素的值为undefined。  
 arr.push(1)； 在数组尾部添加元素
 arr.unshift()；在数组头部添加元素
 delete arr[2]; 是将数组中的下标为2的元素 变成undefined  并非真正的删除
 arr.pop()  删除数组的最后一个元素
 arr.shift() 删除数组的第一个元素

数组的最大长度是2^23-1
delete 直接删除和直接赋值为undefined是不一样的，
delete后 arr[i] in arr; --->false
赋值undefin后 arr[i] in arr; --->true

4.数组迭代 for循环 for in 遍历（定义在原型上的属性也会遍历出来） 使用hasOwnProperty可以避免将原型上的属性遍历出来

for(i in arr){
if(arr.hasOwnProperty(i))
//不会遍历出原型上的元素
}

2）二维数组、稀疏数组

1.二维数组，就是一维数组的元素是数组，所以通过一维数组下标只是找到了子数组，要想访问子数组的元素，还需要子数组的下标。
所以要想访问二维数组元素，外层数组名[外层数组下标值][字数组下标值]

2.稀疏数组，下标不是从0开始，长度length大于实际数组元素个数。

var arr = [undefined]; 这个是给位置0设置了undefined，
而 var arr = new Array(99) ，虽然给数组安排了99个位置，但是这99个位置占了但是里面没有内容。

简单的说就是如果那个位置有值的话用in判断就返回true，反之则返回false。

var arr = new Array(100);
arr[98] = 123;
98 in arr;  //true : 98上key值存在
97 in arr;  //false ：: 97上key值不存在

稀疏数组：
1. var arr1=[undefined];//有第0个元素，为undefined
2. var arr2=new Array(1)；//稀疏数组，数组长度为1，但并没有定义arr[0]
3. var arr3=[,,];//稀疏数组，定义了两个个undefined数组元素，没有规定arr[0]就是undefined

所以，0 in arr1//return true（表示key 0 是否在arr1中）; 0 in arr2//return false;
arr1.length = 100; arr1[99]=123; 99 in arr1//return true; 98 in arr1//return false(因为arr[98]并没有被定义)
凡是没有显示定义数组索引的，都是稀疏数组

3）数组方法

join()--将数组转换为字符串，可打印数组。
join("")给数组添加组合符号。如arr=[a,b,c];arr.join("_");//"a_b_c"，原数组未被修改
reverse()倒序排列数组。注意原数组会被修改
sort（）按照字母的顺序排序，但是无法满足复杂的字符串，即无法按数字大小排序
sort（function（a,b）{return a-b}）---在sort方法中定义一个函数，如果是升序排列的话，前面的值要小于后面的值，就要返回一个负数；
如果是降序排列的话；前面的数会大于后面的数，返回一个正数。注意原数组会被修改。
concat（）合并数组，不会修改原数组
slice（a，b）表示截取数组第a个索引元素到第b个索引元素结束，左闭右开；当a,b值为负数时，表示倒着截取数组，且不对原数组修改。
splice（a）只有一个参数时，表示在a索引的位置截断数组，形成两个数组；
splice（a，b）有两个参数时，表示在a索引的位置截取b个元素形成新数组。
splice（a，b，新元素）
splice方法原数组会被修改。

数组的方法(ES5的方法)
1.forEach  遍历
2.map 映射
var arr = [1,2,3];
arr.map(function(x){
return x +10;
});//【11，12，13】
arr;//[1,2,3]
原数组未被修改

3.filter 数组过滤
arr = [1,2,3,4,5,6,7,8,9,10];
arr.filter(function(x,index){
return index%3 ===0 || x>=8;
});   [1,4,7,8,9,10];
arr; 原数组未被修改

4. 数组判断
 every  所有的元素都符合条件 返回true  否则返回false
 some   某个元素符合条件则返回true  若所有的元素都不符合条件则返回false
var arr =[1,2,3];
arr.every(function(x){
return  X<10;
});//true

arr.every(function(x){
return x < 3
});//false

6.reduce  数组中的元素两两之间的某些操作 从左到右
reduceRight 从右往左
var arr = [1,2,3];
var sum = arr.reduce(function(x,y){
return x+ y
},0);//6
 传入了一个0  则x相当于0 y 相当于1  然后值1 ；
 然后此时 x 相当于1  y 相当于2 和为3
 x相当于3 y 相当于3 和为6   所以结果为6 
 如果不传入0这个值 则X从数组的第一个元素开始  循环两两元素相加
 reduceRight 同理 只不过是从右往左开始两两操作
7.indexOf 数组的检索 
indexOf（a,b）;a 是查找的元素  b是开始查找的位置  正数从左数的位置  负数从右数的位置
indexOf(元素)； 返回的是元素的下标 不存在返回-1
lastIndexOf 从右往左查。

8.判断是否是数组，有 4 种方法：
1)Array.isArray(arr)
2)arr instanceof Array   
3)Object.prototype.toString.apply(arr) 
4)arr.constructor === Array

数组和对象的区别

相同点：1.都可以继承。
       2.数组是对象，对象不一定是数组。
       3.都可以当作对象添加删除属性。
不同点：1.数组会自动更新length。
       2.索引访问数组比访问一般对象属性迅速。

字符串类似数组，可以通过索引访问字符串中的元素，但是没有数组中的一些操作方法，字符串可以通过如下的方式使用join（）方法：
使用"_"来连接字符串：Array.prototype.join.call(str,"_");