美文网首页
引用类型

引用类型

作者: duJing | 来源:发表于2017-03-22 09:32 被阅读8次

    一、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()...

    相关文章

      网友评论

          本文标题:引用类型

          本文链接:https://www.haomeiwen.com/subject/puzovttx.html