🔥码云GVP开源项目 12k star Uniapp+ElementUI 功能强大 支持多语言、二开方便! 广告
* 如何创建并使用对象 * 什么是构造器函数 * 内置对象与运用 ***** # 对象 定义对象用`{}`,叫做 **对象文本标识法** 用逗号分隔属性 键值对之间用冒号`:`分隔 属性名(key)可不加引号`''`,尽量不加引号 ⭐ 对象的属性为函数,称做**方法** > 例外(必须添加引号): > 属性名是保留字; > 属性名包含空格或特殊字符 > 属性名以数字开头 ``` var o = { something: 1, 'yes or no': 'yes', '!@#$%^': true } ``` ### 哈希表,关联型数组 哈希表,关联型数组,通常以字符串为键值; 一般性数组,索引型、枚举型数组,通常以数字为键值。 ### 访问对象属性 * 中括号表示法 `person['name']`,访问不合法属性名及动态(不定)属性名 * 点号表示法 `person.name`,访问合法属性名,常用 ⭐ ### 修改属性与方法 添加、更新:`obj.prop = value;` 删除:`delete obj.prop` ### this 推荐阅读《你不知道的JavaScript》(上卷) this的四种绑定规则 ### 构造器函数 使用new操作符调用函数,函数执行特殊操作,创建对象 ### 全局对象 浏览器 window ### 构造器属性 创建对象的时候添加的特殊属性 ``` var obj = new Object(); obj.constructor; // Object() var o = {}; o.constructor; // Object() ``` ### 返回对象的函数 ### 传递对象(的引用) ### 对象比较 传递对象,===比较为true 定义两次,===比较为false # 内建对象 数据封装类对象: * Object * Array * Boolean * Number * String 工具类对象: * Math * Date * RegExp 错误类对象: ***** ## Object 所有对象的父级对象 ``` var o = {}; var o = new Object(); ``` ## Array ``` var a = new Array(); var a = []; ``` 数组方法: * push() * pop() * shift() * unshift() * sort() * join() * slice() * splice() ``` var a = [1,2,3,4,5]; a.slice(2,4); // [3, 4] a.splice(1,2,'true','hi',false); // [2, 3] a; // [1, "true", "hi", false, 4, 5] ``` ## Function ⚠ 避免使用,缺点同eval() ### 函数对象方法 * call() * apply() 让对象借用其他对象的方法; 将函数的this绑定到首参身上,不传或传null则绑定到全局对象; 二者区别在于参数的传递方式,apply通过数组传参; ### arguments ``` function f(){ console.log(typeof arguments); return arguments; } f(12,23,45,67); // object // Arguments(4) [12, 23, 45, 67, callee: ƒ, Symbol(Symbol.iterator): ƒ] ``` arguments是对象; 该属性引用的是 **当前被调用的函数对象** 匿名函数的递归调用: ``` (function(count){ if(count < 5){ alert(count); arguments.callee(++count); // 调用当前匿名函数 } })(1) ``` ## Boolean ``` Boolean('test') // true Boolean('') // false Boolean({}) // true var b1 = new Boolean(true); // truthy b1.valueOf(); // true var b2 = new Boolean(false); // falsy b2.valueOf(); // false Boolean(b1); // 所有布尔对象都等于true // true Boolean(b2); // true ``` ## Number ``` Number.MAX_VALUE // 1.7976931348623157e+308 Number.MIN_VALUE // 5e-324 Number.POSITIVE_INFINITY // Infinity Number.NEGATIVE_INFINITY // -Infinity Number.NaN // NaN ``` Number对象 * toFixed() * toExponential() * toString([radix]) ## String ``` var primitive = 'Hello'; typeof primitive; // 普通字符串类型 // "string" var obj = new String('world'); typeof obj; // String对象 // "object" obj; // String {"world"} obj.valueOf(); // "world" obj.toString(); // "world" ``` 方法: * toUpperCase() * toLowerCase() * charAt() * indexOf() * lastIndexOf() * slice(start, s.length+(end)) * substring(start, (end || 0)) * split() * concat() * valueOf() * search() * match() * replace() ## Math * Math.random() * Math.round() * Math.floor() * Math.ceil() * Math.PI * Math.SQRT2 * Math.E * Math.LN2 * Math.LN10 * Math.min() * Math.max() * Math.pow(2,3); // 8 * Math.sqrt(9); // 3 ## Date ## RegExp ``` var re = new RegExp("j.*t", 'gmi'); var re = /j.*t/img; re.global; ``` 方法: test() 是否匹配 exec() 返回数组 ### 字符串方法 search() & match() ``` var s = new String('helloJavaScriptWorld'); s.match(/a/); // ["a", index: 6, input: "helloJavaScriptWorld", groups: undefined] s.match(/a/g); // (2) ["a", "a"] s.match(/j.*a/i) // ["Java", index: 5, input: "helloJavaScriptWorld", groups: undefined] s.search(/j.*a/i); // 5 ``` replace() ``` s.replace(/[A-Z]/g, ''); // "helloavacriptorld" s.replace(/[A-Z]/, ''); // "helloavaScriptWorld" s.replace(/[A-Z]/, '_$&'); // "hello_JavaScriptWorld" s.replace(/[A-Z]/g, '_$&'); // "hello_Java_Script_World" s.replace(/([A-Z])/g, '_$1'); // "hello_Java_Script_World" ``` ``` var email = 'gnkevin@126.com'; email.replace(/(.*)@.*/, "$1"); // "gnkevin" ``` split() ``` var csv = 'one, two , three ,four'; csv.split(/\s*,\s*/); // ["one", "two", "three", "four"] ``` 用字符串代替过于简单的regexp对象 ``` "test".replace('t','r'); // "rest" "test".replace(new RegExp('t'), 'r'); // "rest" ``` ## Error * ReferenceError * SyntaxError * TypeError # 小结 Number()、String()、Boolean()的调用分两种: 使用new调用——新建对象; 不适用new调用——将任意值转换为基本数据类型。