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); //obj{name="沙和尚} console.log(obj4);//obj{name="沙和尚} /* * 当比较两个基本数据类型的值时，就是比较值。 * 而比较两个引用数据类型时，它是比较的对象的内存地址， * 如果两个对象是一摸一样的，但是地址不同，它也会返回false */ console.log(obj3 == obj4); //false </script> </head> <body> </body> </html>
