JS对象简介
Posted luoxuw
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了JS对象简介相关的知识,希望对你有一定的参考价值。
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript"> /* * JS中数据类型 * - String 字符串 * - Number 数值 * - Boolean 布尔值 * - Null 空值 * - Undefined 未定义 * - 以上这五种类型属于基本数据类型,以后我们看到的值 * 只要不是上边的5种,全都是对象 * - Object 对象 * * * 基本数据类型都是单一的值"hello" 123 true, * 值和值之间没有任何的联系。 ** / 1、对象简介 / * 对象属于一种复合的数据类型,在对象中可以保存多个不同数据类型的属性。 * * 对象的分类: * 1.内建对象 * - 由ES标准中定义的对象,在任何的ES的实现中都可以使用 * - 比如:Math String Number Boolean Function Object.... * * 2.宿主对象 * - 由JS的运行环境提供的对象,目前来讲主要指由浏览器提供的对象 * - 比如 BOM(Browser) console * DOM Document * * 3.自定义对象 * - 由开发人员自己创建的对象 * */ 2、创建对象 方式1: /* * 使用new关键字调用的函数,是构造函数constructor * 构造函数是专门用来创建对象的函数 * 不需要用class定义类,直接创建对象,属性可以动态添加和删除 * 使用typeof检查一个对象时,会返回object */ var obj = new Object(); /* * 在对象中保存的值称为属性 * 向对象添加属性 * 语法:对象.属性名 = 属性值; */ 方式2: /* * 使用对象字面量来创建一个对象 */ var obj = ; //console.log(typeof obj); //object obj.name = "孙悟空"; //console.log(obj.name); /* * 使用对象字面量,可以在创建对象时,直接指定对象中的属性 * 语法:属性名:属性值,属性名:属性值.... * 对象字面量的属性名可以加引号也可以不加,建议不加, * 如果要使用一些特殊的名字,则必须加引号 * * 属性名和属性值是一组一组的名值对结构, * 名和值之间使用:连接,多个名值对之间使用,隔开 * 如果一个属性之后没有其他的属性了,就不要写逗号 */ var obj2 = name:"猪八戒", age:13, gender:"男", test:name:"沙僧" ; console.log(obj2.test); 3、添加属性 方式1: //向obj中添加一个name属性 obj.name = "孙悟空"; //向obj中添加一个gender属性 obj.gender = "男"; //向obj中添加一个age属性 obj.age = 18; /* * 读取对象中的属性 * 语法:对象.属性 * 如果读取对象中没有的属性,不会报错而是会返回undefined */ //console.log(obj.gender); //console.log(obj.hello); 方式2: /* * 如果要使用特殊的属性名,不能采用.的方式来操作 * 需要使用另一种方式: * 语法:对象["属性名"] = 属性值 * 读取时也需要采用这种方式 * * 使用[]这种形式去操作属性,更加的灵活, * 在[]中可以直接传递一个变量,这样变量值是多少就会读取那个属性 * */ obj["123"] = 789; obj["nihao"] = "你好"; var n = "nihao"; //console.log(obj["123"]); 4、修改和删除属性 /* * 修改对象的属性值 * 语法:对象.属性名 = 新值 */ obj.name = "tom"; /* * 删除对象的属性 * 语法:delete 对象.属性名 */ delete obj.name; 5、属性值是另一个对象 /* * 属性值 * JS对象的属性值,可以是任意的数据类型 * 甚至也可以是一个对象 */ obj.test = true; obj.test = null; obj.test = undefined; //创建一个对象 var obj2 = new Object(); obj2.name = "猪八戒"; //将obj2设置为obj的属性 obj.test = obj2; console.log(obj.test.name); //猪八戒 6、in 运算符 /* * in 运算符 * - 通过该运算符可以检查一个对象中是否含有指定的属性 * 如果有则返回true,没有则返回false * - 语法: * "属性名" in 对象 */ //console.log(obj.test2); //检查obj中是否含有test2属性 //console.log("test5" in obj); //false //console.log("test" in obj); //true console.log("name" in obj); //true 7、基本数据类型和引用数据类型的区别 /* * 基本数据类型 * String Number Boolean Null Undefined * * 引用数据类型 * Object * * JS中的变量都是保存到栈内存中的, * 基本数据类型的值直接在栈内存中存储, * 值与值之间是独立存在,修改一个变量不会影响其他的变量 * * 对象是保存到堆内存中的,每创建一个新的对象,就会在堆内存中开辟出一个新的空间, * 而变量保存的是对象的内存地址(对象的引用),如果两个变量保存的是同一个对象引用, * 当一个通过一个变量修改属性时,另一个也会受到影响 */ var obj = new Object(); obj.name = "孙悟空"; var obj2 = obj; //修改obj的name属性 obj.name = "猪八戒"; /*console.log(obj.name); 猪八戒 console.log(obj2.name);*/ 猪八戒 //设置obj2为null,不影响obj obj2 = null; /*console.log(obj); console.log(obj2);*/ null var c = 10; var d = 10; //console.log(c == d); var obj3 = new Object(); var obj4 = new Object(); obj3.name = "沙和尚"; obj4.name = "沙和尚"; /*console.log(obj3); //objname="沙和尚 console.log(obj4);//objname="沙和尚 /* * 当比较两个基本数据类型的值时,就是比较值。 * 而比较两个引用数据类型时,它是比较的对象的内存地址, * 如果两个对象是一摸一样的,但是地址不同,它也会返回false */ console.log(obj3 == obj4); //false </script> </head> <body> </body> </html>
以上是关于JS对象简介的主要内容,如果未能解决你的问题,请参考以下文章