JS 引用类型

Posted 2020-10-14

object类型：

　　js中大多数引用类型都是Object类型的实例。创建object实例有两种方法：第一种是使用new操作符后跟Object构造函数。

var obj = new Object();
obj.name = ‘long‘;

　　第二种是对象字面量。

var obj = {
     name:‘long‘,
　　　‘la la‘:111
  
};

　　访问对象属性，一般优先使用 ‘.’ 操作符，在属性名是变量或者属性名不符合ECMAScript标识符规范时，可以用 ‘[ ]’访问，如果不是变量需要给属性名加上引号。

Array类型：

　　JS中数组每项可以保存任意类型的值。

　　创建数组有两种方式：第一种是使用Array构造函数。

var arr = new Array();　　　　//不推荐
var arr = Array();　　　　　　//不推荐

　　第二种是字面量。

var arr = ["red","blue","green"];

　　数组的length属性可以读写。

　　检测数组：

　　在没有框架的情况下，检测数组：

if(value instanceof Array){
    //do something      
}

　　ES5新增Array.isArray()方法。不管是在哪个全局执行环境中创建的数组，都能检测到底是不是数组。支持的浏览器：IE9+、Firefox 4+、Safari 5+、Opera 10.5+、Chrome。

if(Array.isArray(value)){
    //do something  
}

　　转化方法：

　　数组调用toString()方法会返回由数组中每个值的字符串形式拼接而成的一个以逗号分隔的字符串。value()返回的还是数组。join()方法可以以指定的分隔符将数组分割成字符串。

var arr = ["red","green","blue"];
arr.toString();   　　 //"red,green,blue"
arr.valueOf();        //["red","green","blue"]
arr.join(‘|‘);        //"red|green|blue"
console.log(arr);　　　//["red","green","blue"]

　　这些方法都不改变原数组。

　　栈方法：

　　push()在数组的末尾添加一项，返回数值修改后的长度。pop()删除数组的最后一项，并返回删除的项。两个方法都改变原数组。

var arr =["red","green","blue"];
var length = arr.push("yellow");      //4
console.log(arr);                     //["red","green","blue","yellow"]
var move = arr.pop();                 //"yellow"
console.log(arr);                     //["red","green","blue"]

　　队列方法：

　　shift()删除数组的第一项，并返回该项。unshift()在数组的开头添加一项，并返回新数组的长度。

　　重排序方法：

　　reverse()方法反转数组，sort()按照从小到大的方式将数组排序（将每项作为字符串排序）。两个方法都改变原数组并返回改变后的数组。

var arr = [1,2,3,4,11,20];
arr.reverse();                       //[20,11,4,3,2,1]
arr.sort();                          //[1,11,2,3,4,20]            

　　sort()还可以接受一个比较函数作为参数。该函数接受两个参数：数组每次比较的两个项，如果函数返回-1，则两参数不改变位置，如果返回1，则两参数颠倒位置。

var arr = [1,2,3,4,11,20,5];
arr.sort(function(prev,next){
   return prev > next ? 1 : -1; 
})                          //[1,2,3,4,5,11,20]

　　sort()方法还可以给数组对象根据不同的属性进行排序：

var arr = [
    {
     name : "long",
     age : 20,
     time : "2017 11 13"
     },
      {
     name : "tom",
     age : 18,
     time : "2015 11 1"
     },
      {
     name : "air",
     age : 22,
     time : "2018 11 11"
     },
]
function reSort(arr,type){
　　return arr.sort(function(prev,next){
　　　　return prev[type] > next[type] ? 1 : -1;
 　})
}
reSort(arr,‘name‘);　　　　//[{name:‘air‘...},{name:‘long‘...},{name:‘tom‘...}]

reSort(arr,‘age‘);　　　　 //[{name:‘tom‘...},{name:‘long‘...},{name:‘air‘...}]

reSort(arr,‘time‘);　　　　//[{name:‘tom‘...},{name:‘long‘...},{name:‘air‘...}]

　　操作方法：

　　concat()拼接数组。不改变原数组。返回拼接后的数组。

var colors = ["red"];
var colors2 = colors.concat("yellow",["green","black"]);
console.log(colors);　　　　 //["red"]
console.log(colors2);　　　　//["red","yellow","green","black"]

　　slice() 基于数组中的一项或多项创建一个新数组，接受一个或两个参数，一个参数时，新数组从参数位置到数组末尾，两个参数时，分别代表数组的开始和结束位置。不改变原数组，返回创建的新数组。

var colors = ["red","black","green","yellow"];
colors.slice(1);　　　　//["black","green","yellow"]
colors.slice(1,3);　　 //["black","green"]

　　splice() 最强大的数组方法。主要用途向数组中部插入项。

　　　　删除任意项，两个参数，第一个参数：要删除项的开始位置，第二个参数：删除项的长度。如果只有一个参数时，会从开始位置一直删除到结束。

　　　　插入任意项：三个参数，第一个：起始位置，第二个：要删除项的长度，第三个：要插入的项，如果要插入多项，可以接受第四、第五、、、..任意多项。

　　　　替换：同上。

　　splice() 会改变原数组，返回删除的项组成的数组，如果没有删除则返回空数组。

　　位置方法：

　　ES5：indexOf()、lastIndexOf() 没有找到返回-1。查找时使用全等操作符。

　　迭代方法：

　　ES5：

　　　　every()：每一项都返回true，则返回true；

　　　　filter()：将返回true的项组成数组返回；

　　　　forEach()：没有返回结果；

　　　　map()：返回每次调用的结果组成的函数；

　　　　some()：任意一项为true，则返回true；

　　归并方法：

　　ES5：reduce()、reduceRight()

　　两个方法会迭代数组的每一项。然后构建一个最终返回的值。接受两个参数：一个在每一项上调用的函数和作为归并基础的初始值。传入改方法的函数接受四个参数：前一个值、当前值、项的索引和数组对象。函数的任何值都会作为第一个参数自动传给下一项，第一次迭代发生在第二项。

var values = [1,2,3,4,5];
var sum = values.reduce(function(prev,cur,index,array){
　　return prev + cur;
})
console.log(sum);　　　　//15
var sum2 = values.reduce(function(prev,cur,index,array){
　　return prev + cur ;
},10)
console.log(sum2);　　　//25

Date类型：

var time = new Date();

　　构造函数可以接受一个参数，日期格式（“yyyy-MM-dd hh:mm:ss”），返回该时间的日期对象。Date()接受参数时，其实是后台默认调用Date.parse()方法或Date.UTC()方法。

　　ECMAScript没有定义应该支持哪种日期格式，所以一般的写法都可以。

var now = new Date("2017 11 13");    //Mon Nov 13 2017 00:00:00 GMT+0800 (中国标准时间)　　　　调用的是Date.parse()
var now2 = new Date(2017,11,13);　　　//Wed Dec 13 2017 00:00:00 GMT+0800 (中国标准时间)　　　　调用的是Date.UTC()

　　Date.UTC() 方法是基于0的月份。

　　ES5新增了Date.now()方法，返回当前时间的毫秒数。其实也可以通过+操作符将Data对象转成成毫秒数。

var start = +new Date();
console.log(start);            //1510567596510  number类型

　　继承方法：

　　Date类型也重写了toLocaleString()、toString()、valueOf()方法。valueOf()会返回日期对象的毫秒数。可以直接用日期对象比较大小。

　　日期格式化方法：

　　....

　　日期、时间组件的方法：

　　F12——打开控制台（Console）——输入：Date.prototype——回车，即可看到该浏览器支持的所以Date方法。

RegExp类型：

　　通过下面方法就可以创建一个正则表达式：

var reg = /pattern/flags;

　　pattern（模式）部分可以是任何简单或者复杂的正则表达式。

　　flags：g(全局)、i(不区分大小写)、m(表示多行)。

　　模式中的元字符必须转义：(){}[]\^$|?*+.

　　另一种创建正则表达式的方法是用RegExp构造函数。接受两个参数，一个是要匹配的字符串模式，一个是标志字符。可以使用字面量创建的正则，都可以用构造函数创建。模式中包含变量时，用构造函数创建。构造函数模式中的某些字符串需要双重转义。

var  str = ‘at‘;
var reg = RegExp(str,g);

　　RegExp实力属性：

　　没用

　　RegExp实例方法：

　　exec():专门为捕获组设计的。接受一个参数，即要匹配的字符串，返回包含第一个匹配项信息的数组，没用匹配项时返回null。返回的数组实例包含两个额外的属性：index和input，index:匹配项在字符串中的位置，input表示应用正则表达式的字符串。数组中第一项是与整个模式匹配的字符串，其他项是与模式中的捕获组匹配的字符串。如果没有捕获组，则该数组只有一项。

var text = "mom and dad and baby";
var pattern = /mom( and dad( and baby)?)?/gi;
var matches = pattern.exec(text);
console.log(matches.index);　　　　　　//0

console.log(matches.input);　　　　　　//"mom and dad and baby"

console.log(matches[0]);　　　　　　　　//"mom and dad and baby"

console.log(matches[1]);　　　　　　　　//" and dad and baby"

console.log(matches[2]);　　　　　　　　//" and baby"

　　exec()即使在模式中设置了g，它每次也只会返回一个匹配项，如果多次调用的话，则每次调用都会在字符串中继续查找。

　　test() 接受一个字符串参数。返回true或者false

　　RegExp构造函数属性：

　　$1、$2、..$_、$+、$*、....

Function类型：

　　

---

　　今天先到这里- -.