JavaScript 引用类型

一、Object类型
1.创建对象
①new运算符 var o = new Object();
②对象字面量  var o = {};     推荐
2.方法属性
①object.constructor 保存着创建当前对象的函数
②hasOwnProperty(propertyName)   表示指定参数的属性是否存在于实例中，而不是原型中
③Object.prototype.isPrototypeOf(object)     表示传入的对象(Object)是否为传入对象(object)的原型
④object.propertyIsEnumerable(propertyName)  表示传入的对象属性是否可以用for-in来枚举
⑤toLocaleString()
⑥valueOf()
⑦toString()
3.例子
function Student (grade) {
this.grade = grade;
}
Student.prototype = {
constructor : Student,
getGrade : function () {
return this.grade;
}
}
var o = {
name : "zhang",
age : 12,
getName : function () {
return this.name;
}
};
alert(o.constructor);       // 保存着创建当前对象的函数
o.sex = "male";
alert(o.hasOwnProperty("sex"));     // true, sex属性存在于实例o中，而不是原型
var obj = new Student(100);
alert(Student.prototype.isPrototypeOf(obj));    // true, Student是obj实例的原型
alert(obj.propertyIsEnumerable("grade"));       // true，实例obj中的属性grade可以通过for-in枚举
二、Array类型
1.创建数组
①构造函数   var a = new Array([长度],[value1, value2, ...]);
②数组字面量  var a = [];
2.CRUD
①获取长度   a.length
②末尾添加   a[a.length] = value
③修改     a[index] = value
④删除     a[index] = null;
⑤读取     a[index];
3.检测数组  Array.isArray(arrayName)    判断arrayName是否为数组
4.转换方法
①toString() 返回的是有逗号和索引元素组成的字符串
②valueOf()  返回的是对象
③例子
var arr = [1, 2, 3];
alert(Array.isArray(arr));      // true, arr是一个数组
alert(typeof arr.toString());       // string,字符串
alert(typeof arr.valueOf());        // object,对象
alert(typeof arr);                  // object，可见arr实例自动调用valueOf方法
5.栈方法
①push() 推入，添加
②pop()  弹出，删除
③例子
var arr = [1, 2, 3];
var item = arr.push(4);     // 入栈
alert(item);                // 4
alert(arr);                 // 1,2,3,4
item = arr.pop();           // 出栈
alert(item);                // 4
alert(arr);                 // 1,2,3
6.队列方法
①shift()    出队，删除
②pop()  弹出，删除
③例子
var arr = [1, 2, 3, 4, 5];
var item = arr.shift();     // 队首出列
//alert(item);              // 1
//alert(arr);                   // 2,3
item = arr.unshift(0);      // 队首入列
//alert(item);              // 5个item
//alert(arr);                   // 0, 2, 3, 4, 5
7.重排序方法
①reverse()  反向排序
②sort(fun)  自定义排序
③例子
var paixu = function (a, b) {
return a - b;
}
var arr = [1, 22, 3, 4, 5];
//alert(arr.reverse()); // 5,4,3,22,1
//alert(arr.sort());        // 按字符串形式排序 1,22,3,4,5
//alert(arr.sort(paixu));   // 按照paixu函数的形式排序   1,3,4,5,22  // 0, 2, 3, 4, 5
8.操作方法
①concat()   创建一个副本数组，将原数组的数据和自带参数的数据添加到副本中。
②slice(startIndex, endIndex)    基于父数组创建一个子数组
③splice()   可以对数组进行添加、删除和替换
④例子
var arr = [1, 2];
// concat的用法
var newArr = arr.concat(7);
//alert(newArr);        // 1,2,7
//alert(arr);           // 1,2
// slice的用法
var subArr = arr.slice(0, 1);

//alert(subArr);        // 1
//alert(arr);           // 1,2
// splice的用法
var arr2 = arr.splice(1, 1);
//alert(arr2);          // 2, 删除arr中的从arr[1]到arr[1]中的数据
//alert(arr);               // 1
var arr3 = arr.splice(1, 2, 4, 5);
//alert(arr3);          // 添加4,5
//alert(arr);               // 1, 4, 5
var arr4 = arr.splice(2, 1, "red");
alert(arr4);            // 更替数据，返回被替换的值
alert(arr);             // 1, 4, "red"
9.位置方法
①indexOf(item, startIndex)  返回要查找的项在数组中的位置，如果没有返回-1
②lastIndexOf()      从后往前开始查找，和indexOf恰恰相反
④例子
var arr = [2, 23, 23, 11, 3, 2, 345];
var index = arr.indexOf(2);
alert(index);       // 0
alert(arr.indexOf(2, 3));   // 从第3个元素，即arr[3](11)开始查找
alert(arr.lastIndexOf(2));  // 5
10.迭代方法
①every()    对数组的每一项都运行给定的函数，如果都返回true，则返回true
②filter()   对数组的每一项都运行给定的函数，返回为true的值的集合的数组
③forEach()  对数组的每一项都运行给定的函数，没有返回值
④map()      对数组的每一项都运行给定的函数，返回经过函数处理后的新数组
⑤some()     对数组的每一项都运行给定的函数，如果任意一项返回true，则返回true
⑥例子
// 1. every的用法
var everyResult = arr.every(function (item, index, array){
return item > 2;
});
//alert(everyResult);           // false
// 2. filter的用法
var filterResult = arr.filter(function (item, index, array){
return item > 300;
});
//alert(filterResult);          // [345], 返回经过过滤器筛选之后的数组
// 3. forEach的用法
var foreachResult = arr.forEach(function (item, index, array){
return item * 10;
});
//alert(foreachResult);         // undefined，没有返回值
// 4. map的用法
var mapResult = arr.map(function (item, index, array){
return item * 10;
});                         // 返回经过函数处理之后的数组值的新数组
//alert(mapResult);         // 20, 230, 230, 110, 30, 20, 3450
// 5. some的用法
var someResult = arr.some(function (item, index, array){
return item > 2;
});
alert(someResult);          // true
11.归并方法
①reduce()   迭代数组的每一项，返回经过处理后的值
②reduceRight()  和reduce()一致，只是从后开始迭代
⑥例子
var arr = [1,2,3];
var res = arr.reduce(function (pre, cur, index, array) {
return pre * cur;
});
alert(res);         // 1 * 2 * 3 = 6
三、Date类型
1.创建日期对象
①构造函数 new Date()
②Date.parse()方法，传入日期格式字符串，如果不是，返回NaN
③Date.UTC()方法
④例子
var date = new Date();
//alert(date);      // 返回当前日期信息，Mon Mar 28 2016 20:36:25 GMT+0800
//alert(new Date(Date.parse("3/28/2016")));//字符串中的格式“月/日/年”, Mon Mar 28 2016 20:36:25 GMT+0800
//alert(new Date("3/28/2016"));//字符串中的格式“月/日/年”, Mon Mar 28 2016 20:36:25 GMT+0800
alert(new Date(Date.UTC(2016, 2, 28, 8, 8, 8)));//字符串中的格式“年月日时分秒”, Mon Mar 28 2016 20:36:25 GMT+0800
alert(new Date(2016, 2, 28, 8, 8, 8));// Mon Mar 28 2016 20:36:25 GMT+0800
2.获取时间戳 Date.now()方法
eg:
var pre = Date.now();
for (var i = 0; i < 10000; i++) {}
var cur = Date.now();
alert("计算花费了" + (cur - pre) / 1000 + "秒");      // 计算花费了0.001秒
3.继承的方法
由于浏览器兼容的问题，对于toString()和toLocaleString()方法返回的值不一致，因此没有什么用
而valueOf()返回的则是时间戳，可以用来比较时间。
eg:
var date1 = new Date(2016, 1, 1);
var date2 = new Date(2015, 12, 31);
alert(date1 - date2);       // 86400000
4.日期时间组件
①getTime()      获取时间戳
②getFullYear()  获取4位的年份
③getMonth()     获取0~11的月份
④getDate()      获取1~31的天数
⑤getDay()       获取0~6的星期几
⑥getHours       获取0~23的小时
⑦getMinites     获取0~59的分钟数
⑧getSeconds     获取0~59的秒数
⑨getMilliseconds获取毫秒数
eg:
var date = new Date(2016, 2, 28, 8, 8, 8);
//alert(date);                      //Mon Mar 28 2016 08:08:08 GMT+0800
//alert(date.getTime());            // 1459123688000
//alert(date.getFullYear());        // 2016
//alert(date.getMonth());           // 2
//alert(date.getDate());            // 28
//alert(date.getDay());             // 1
//alert(date.getHours());           // 8
//alert(date.getMinutes());         // 8
//alert(date.getSeconds());         // 8
alert(date.getMilliseconds());      // 0
四、RegExp类型
1.创建正则实例
①正则表达式  var reg = /pattern/flag; 其中flag有i,g,m,分别代表忽略大小写、全局匹配和多行匹配
②构造函数   var reg = new RegExp(pattern, flag);
2.需要在模式中转义的字符   ( [ { \ ^ $ | ) ? * + .]}
3.实例属性
①global
②ignoreCase
③multiline
④lastIndex
⑤source         // 返回模式的字符串形式
eg:
var pattern = /\[bc]\at/ig;
alert(pattern.global);          // true
alert(pattern.ignoreCase);      // true
alert(pattern.multiline);       // false
alert(pattern.lastIndex);       // 0
alert(pattern.source);          // \[bc]\at
4.实例方法
①exec()     用于捕获
eg:
var text = "a & b & c";
var pattern = /a( & b( & c)?)?/ig;
var matches = pattern.exec(text);
//alert(matches);           // a & b & c, & b & c, & c
//alert(matches.index);     // 0
//alert(matches.input);     // a & b & c
//alert(matches[0]);        // a & b & c
//alert(matches[1]);        // & b & c, & c
//alert(matches[2]);        // & c
②test()     用于测试
eg:
var text = "a & b & c";
var pattern = /a( & b( & c)?)?/ig;
var matches = pattern.test(text);
alert(matches);     // true, 表示有匹配到
五、Function类型
1.创建
①函数声明       function functionName (par...) {}
②函数表达式      var functionName = function (par...) {}
③构造函数       var functionName = new Function(par, statement);
2.函数是对象，函数名是指针
eg:
var add = function (a, b) {
return a + b;
}
alert(add(10, 10));     // 20
var sum = add;
alert(sum(10, 10));     // 20
add = null;
alert(sum(10, 10));     // 20
3.没有重载
eg：
function add(a, b) {
return a + b;
}
function add (a, b) {
return a * b;
}
alert(add(10, 10));     // 100， 前者被后者覆盖
4.函数声明和函数表达式        用函数声明的函数调用没有顺序限制，而函数表达式要先定义后调用
5.作为值的函数
eg:
var arr = [1, 222, 100];
var paixu = function (a, b) {
return a - b;
}
alert(arr.sort(paixu)); // 将函数作为值调用 1, 100, 22
6.函数的内部属性
①arguments对象属性
eg:
var add = function (a, b) {
var res = [];
for(var i = 0, len = arguments.length; i < len; i++) {
res.push(arguments[i]);
}
res.push(arguments.callee);
return res;
}
alert(add(10, 10));     // 10, 10, var add = function (a, b) {...};
②this会随着函数作用域的变化而变化
eg:
var color = "red";
var o = {
color : "green"
}
var sayColor = function() {
alert(this.color);
}
sayColor();         //[object Window], red
o.getColor = sayColor;
o.getColor();       // [object Object], green
③caller属性，保存着调用本函数的函数引用
eg:
function outer() {
inner();
}
function inner() {
alert(arguments.callee.caller);
}
outer();        // function outer() {...}
7.函数的属性和方法
①length     表示函数希望接受到的参数的个数
②prototype  表示函数原型
③call()和apply() 给函数指定一个作用域，从而改变函数的环境，得到不同的值
eg:
var color = "red";
var o = {
color : "green",

}
var sayColor = function () {
alert(this.color);
}
sayColor();                 // red
sayColor.call(window);      // red
sayColor.call(o);           // green
六、基本包装类型
1.生命周期      在一行代码执行完毕后消失
2.内容            Number()、Boolean()和String()，不建议使用，容易产生误解，尤其是前两个
3.String()类型
①字符方法       charAt()和charCodeAt()
var text = "Hello";
alert(text.charAt(1));          // e
alert(text.charCodeAt(1));      // 101
②字符串操作方法
a.字符串拼接 concat()
b.截取字符串 slice(startIndex, endIndex)、strstr(startIndex, length)、substring(startIndex, endIndex)
③位置方法       indexOf()和lastIndexOf()
④去空格            trim()
⑤大小写转换      toLowerCase()、toUpperCase()
⑥匹配方法
a.match()和正则中的exec()一致
b.search()和正则中的test()差不多，返回搜索值的索引
c.replace()替换字符串
d.split()分隔方法
eg:
var text = "cat pat hat";
var pattern = /(.at)/ig;
alert(text.match(pattern));         // cat pat hat
alert(text.match(pattern)[0]);      // cat
alert(text.match(pattern)[1]);      // pat
alert(text.match(pattern)[2]);      // hat
alert(text.search(pattern));        // 0,索引0
alert(text.replace(/at/g, "ats"));  // cats pats hats
alert(text.split(" ", 2));          // cat,pat
⑦localeCompare()    比较两个字符串
var a = "a";
var b = "b";
alert(a.localeCompare(b));      // -1
⑧fromCharCode()
alert(String.fromCharCode(104, 101, 108, 108, 111)); //"hello"
七、单体内置对象
1.Global对象
①URI编码  decodeURIComponent()和encodeURIComponent()
②执行环境方法 eval()
③window对象，定义的全局变量都是window的属性方法
2.Math对象
①Math对象的属性  Math.E...
②最大/最小值 max()、min()
③四舍五入       ceil()、floor()和round()
④随机数    random()    值= Math.floor(Math.random() * 可能值的总数+ 第一个可能的值)
⑤其他方法       abs()、sqrt()、pow()...