JS学习篇（三）——引用类型篇

Array

创建数组的基本方式有两种：

第一种是利用Array构造函数

var color = new Array();
可以接受一个数字参数，表示数组的长度
var color = new Array(20);  //创建了一个长度为20的数组
也可以传递数组中应该包含的项
var color = new Array("green","red");

第二种是采用数组字面量的方式：

var color = ["red","green","blue"];
var color = [1,2,] 

返回结果：

length属性

数组的项数保存在其length属性中，这个属性始终会返回0或者是更大的值；length属性不是只读的，通过改变这个属性可以实现在数组的末尾移除或者是添加新的项

检测数组

除了constructor，instanceof(所判断的数组必须和数组初始化在相同执行上下文中)，Object.prototype.toSrtring.call之外还可以使用Array.isArray()方法来判断这个值到底是不是数组；

var arr = [1,2,3];
Array.isArray(arr);//true

数组的方法

join()：可以将数组转化为字符串，接收一个参数，就是转换成字符串之后以哪种形式分隔开来

var color = ["a","b","c"];
color.join(',') //a,b,c
color.join('') //abc

栈方法：（后进先出） —— 会改变原来的数组
push(): 接收任意数量的参数，把他们逐个添加至数组末尾，并返回修改后数组的长度
pop():从数组末尾移除最后一项，减少数组的长度，并返回移除的值

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

队列方法：（先进先出）—— 会改变原数组
shift():移除数组中的第一个元素，并返回移除的项
unshift(): 在数组的前面添加任意项，并返回数组的长度

var a = ['reg','blue','green','yellow'];
console.log(a.shift()); //red
console.log(a);   //["blue", "green", "yellow"]
console.log(a.unshift("black"));   4
console.log(a);  //["black", "blue", "green", "yellow"]

重排序方法：——会改变原来的数组
reverse():反转数组的项
sort():不接收参数的情况下，按照升序排列数组的项；可以接收一个比较函数用来控制是降序还是升序

 var a = [2,3,1,4,6,5];
 console.log(a.reverse());
 console.log(a)

var a = [2,3,1,4,6,5];
console.log(a.sort());   
console.log(a.sort((a,b)=>{
    return b-a;
}));
console.log(a)

操作方法：
concat：可以拼接数组，返回拼接后的数组（不会改变原数组）
slice：接受一个或者两个参数，返回这两个参数之间的所有项（取小不取大，也就是不会取结束位置的项）不会改变原数组
splice：会修改原数组，可以实现以下几种作用：
删除：指定两个参数，要删除第一项的位置，和要删除的项数
插入：至少提供三个参数，要插入的位置，0（因为是插入，所以删除的项数为0），以及要插入的项
替换：可以向指定位置插入任意数量的项
splice始终会返回一个数组，这个数组的项是从原始数组中删除的项数

var a = [2,3,1,4,6,5];
console.log(a.slice(0,2));
console.log(a)
console.log(a.slice(-2,-1));  //[6]  -2代表数组6，-1代表数组5，删除取小不取大，所以取了-2位置的数字

var a = [2,3,1,4,6,5];
console.log(a.splice(0,2));  //从0开始删除，删除两项
console.log(a)
var b = [2,3,1,4,6,5];
console.log(b.splice(1,0,7,8,9)); //从索引为1处开始添加
console.log(b)
var c = [2,3,1,4,6,5];
console.log(c.splice(1,2,7,8,9));//从索引为1处开始替换
console.log(c)

位置方法：
indexof():
lastIndexOf()：
这两个方法都接受两个参数，要查找的项（可选）和查找的起点位置的索引，不同的是，indexof是从数组开始处查找，而lastIndexOf是反着来，返回所在的索引，没有就返回-1

 var a = [2,3,1,4,6,5];
 console.log(a.indexOf(2,0));//返回索引0  查找2，从索引为0处开始查找

迭代方法：
filter():过滤方法，“过滤”功能，数组中的每一项运行给定函数，返回满足过滤条件组成的数组。
forEach:可以遍历数组，对数组进行遍历循环，对数组中的每一项运行给定函数。这个方法没有返回值。参数都是function类型，默认有传参，参数分别为：遍历的数组内容；第对应的数组索引，数组本身。
map:遍历数组，指“映射”，对数组中的每一项运行给定函数，返回每次函数调用的结果组成的数组。

var arr = [1,4,6,8,10];
var result1 = arr.filter(function(currentValue){
        return currentValue>5;
});
 console.log(result1);  // [6, 8, 10]

var arr = [1, 2, 3, 4, 5];
arr.forEach(function(x, index, a){
console.log(x + '|' + index + '|' + (a === arr));
});
// 输出为：
// 1|0|true
// 2|1|true
// 3|2|true
// 4|3|true
// 5|4|true

归并方法：
**reduce()**和 reduceRight()
都接收四个参数值：前一个值，当前值，索引，数组对象。这个函数返回的任何值都会作为第一个参数自动传给下一项。第一次迭代发生在数组的第二项上，因此第一个参数是数组的第一项，第二个参数是数组的第二项。

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

ES6新增的方法
find() ：找到数组中第一次满足条件的元素，并返回，若找不到则返回undefined。不改变原数组。

和filter()方法的区别在于：filter返回值是所有满足条件的元素组成的数组，
一般在需要使用找到的元素时，用find()方法

findIndex():

indIndex()的作用同indexOf()，返回第一个满足条件的下标，并停止寻找。
区别是findIndex() 的参数为一个回调函数,且一般用于对象数组

includes() :返回一个布尔值。 参数是一个value,一般用于简单数组

var a = [1,2,3,4]

var b = a.find(function(ele,index,array){
    return ele == 1
})
 
console.log(a) // [1,2,3,4]
console.log(b) // 1

var a = [1,2,3,4]
var b = a.findIndex(function(ele,index,array){
    return ele === 2
})
console.log(a)  // [1,2,3,4]
console.log(b)  // 1

var a = [1,2,3]
console.log(a.includes(1))  // true

Date

创建

var now = new Date();//Tue Jan 19 2021 20:49:56 GMT+0800 (中国标准时间)

在调用Date()构造函数不传参数的情况下，新创建的对象会自动获得当前日期和时间，如果想为特定的日期和时间创建日期对象的话要传入该日期的毫秒数（就是从UTC时间1970年1月1日午夜起到这个特定日期经历的毫秒数）
可以通过Date.parse()和Date.UTC()来获取毫秒数
Date.parse()：接收一个表示日期的字符串参数，返回相应的毫秒数，如果传入的不是日期，就会返回NaN

var now = Date.parse("May 25,2004");
console.log(now)  //1085414400000

日期格式化的方法：

var now = new Date()
console.log(now.toDateString())
console.log(now.toTimeString())
console.log(now.toLocaleDateString())
console.log(now.toLocaleTimeString())
console.log(now.toUTCString())

日期/时间组件的方法：
详见参考大佬的博客

Function类型

函数的内部属性：（两个特殊的对象） arguments，this和caller

arguments:类数组对象，包含着传入函数中的所有参数

主要用途：保存函数的参数
这个对象有个特殊的属性名叫callee,是一个指针，指向拥有这个arguments对象的函数

经典阶乘函数
function factorial (num) {
   if(num<=1){return 1;}
   else{return num*factorial(num-1)};
}
由于这个函数的执行和函数名factorial紧紧的耦合在一起，为了消除这种耦合的行为，可以使用arguments.callee
function factorial (num) {
   if(num<=1){return 1;}
   else{return num*arguments.callee(num-1)};
}

this:在上篇中已经写了，这里就不写了

caller:保存调用当前对象函数的引用，如果是全局作用域调用当前函数的话，他的值为null
严格模式下 不能为caller赋值，会报错

 function outer () {
     console.log(outer.caller)
     inner();
}
function inner() {
     console.log(inner.caller)
}
outer()

函数的属性和方法
length属性和prototype属性
length：函数希望接收的参数的个数
prototype：原型，在下一篇面向对象编程中会讲到

String类型

String是字符串的对象包装类型

字符方法
charAt():接收一个参数，返回给定位置的字符
charCodeAt():接收一个参数，返回给定位置的字符编码

var str ="hello world";
str .charAt(1)  //e
str .charCodeAt(1)  //101

字符串操作方法：
concat():拼接字符串，返回拼接的新字符串，不改变原来的字符串
slice():
substr():
substring():
这三个函数都接受一到两个参数，第一个是指定字符串的开始位置，第二个数结束位置,且都不会修改字符串本身

 var str = "hello world";
console.log(str.slice(3));
console.log(str.substring(3));
console.log(str.substr(3));
console.log(str.slice(3,7));
console.log(str.substring(3,7));
console.log(str.substr(3,7));

如果参数为负数

   var str = "hello world";
   console.log(str.slice(-3));
   console.log(str.substring(-3));
   console.log(str.substr(-3));
   console.log(str.slice(3,-4));
   console.log(str.substring(3,-4));
   console.log(str.substr(3,-4));

位置方法：
indexOf() ,lastIndexOf():根据给定字符，返回这个字符在字符串中出现的位置，不过lastIndexOf是从后面开始查找

var str="hello world"
str.indexOf('o')  //4   第一次出现的位置
str.lastIndexOf('o')  //7    最后一次出现的位置，

trim():创建一个字符串的副本，删除前置和后缀的所有空格，然后返回结构

var str="         hello world       "
str.trim()  //"hello world"

大小写转换
toLowerCase()：转化为小写
toUpperCase():转换为大写