js基础：05、对象(创建对象、属性名及属性值、基本数据及引用数据类型、对象字面量)
javascript 的对象：
- Ⅰ、创建对象：
- 其一、代码为：
- 其二、结果为：
- Ⅱ、对象属性名及属性值：
- 其一、代码为：
- 其二、结果为：
- Ⅲ、基本数据及引用数据类型：
- 其一、代码为：
- 其二、结果为：
- Ⅳ、对象字面量：
- 其一、代码为：
- 其二、结果为：
- Ⅴ、小结：
Ⅰ、创建对象：
其一、代码为：
<!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,* 值和值之间没有任何的联系。* * 在 JS 中来表示一个人的信息（name gender age）：* var name = "孙悟空";* var gender = "男";* var age = 18;* * 如果使用基本数据类型的数据，我们所创建的变量都是独立，不能成为一个整体。* * 对象属于一种复合的数据类型，在对象中可以保存多个不同数据类型的属性。* * * 对象的分类：* * 1.内建对象* - 由 ES 标准中定义的对象，在任何的 ES 的实现中都可以使用* - 比如：Math String Number Boolean Function Object....* * 2.宿主对象* - 由 JS 的运行环境提供的对象，目前来讲主要指由浏览器提供的对象* - 比如 BOM DOM* * 3.自定义对象* - 由开发人员自己创建的对象* *///创建对象/** 使用 new 关键字调用的函数，是构造函数 constructor* 构造函数是专门用来创建对象的函数* 使用 typeof 检查一个对象时，会返回 object*/var obj = new Object();/** 在对象中保存的值称为属性* 向对象添加属性* 语法：对象.属性名 = 属性值;*///向 obj 中添加一个 name 属性obj.name = "孙悟空";//向 obj 中添加一个 gender 属性obj.gender = "男";//向 obj 中添加一个 age 属性obj.age = 18;/** 读取对象中的属性* 语法：对象.属性名* * 如果读取对象中没有的属性，不会报错而是会返回 undefined*/// console.log(obj.gender);// 男// console.log(obj.hello);// undefined/** 修改对象的属性值* 语法：对象.属性名 = 新值*/obj.name = "tom";/** 删除对象的属性* 语法：delete 对象.属性名*/delete obj.name;console.log(obj.age);// 18</script></head><body></body>
</html>其二、结果为：
// 一进入页面后的控制台：
Ⅱ、对象属性名及属性值：
其一、代码为：
<!DOCTYPE html>
<html><head><meta charset="UTF-8"><title></title><script type="text/javascript">var obj = new Object();/** 向对象中添加属性* 属性名：* - 对象的属性名不强制要求遵守标识符的规范* 什么乱七八糟的名字都可以使用* - 但是我们使用时还是尽量按照标识符的规范去做* */obj.name = "孙悟空";//obj.var = "hello";/** 如果要使用特殊的属性名，不能采用.的方式来操作* 需要使用另一种方式：* 语法：对象["属性名"] = 属性值* 读取时也需要采用这种方式* * 使用 [] 这种形式去操作属性，更加的灵活，* 在 [] 中可以直接传递一个变量，这样变量值是多少就会读取那个属性* */obj["123"] = 789;obj["nihao"] = "你好";var n = "nihao";// console.log(obj["123"]);// 789// console.log(obj[n]);// 你好/** 属性值* 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);// 猪八戒/** in 运算符* - 通过该运算符可以检查一个对象中是否含有指定的属性* 如果有则返回 true，没有则返回 false* * - 语法：* "属性名" in 对象*///console.log(obj.test2);//检查 obj 中是否含有 test2 属性console.log("test2" in obj);// falseconsole.log("test" in obj);// trueconsole.log("name" in obj);// true</script></head><body></body>
</html>其二、结果为：
// 一进入页面后的控制台：
Ⅲ、基本数据及引用数据类型：
其一、代码为：
<!DOCTYPE html>
<html><head><meta charset="UTF-8"><title></title><script type="text/javascript">/** 基本数据类型* String Number Boolean Null Undefined* * 引用数据类型* Object* * JS 中的变量都是保存到栈内存中的，* 基本数据类型的值直接在栈内存中存储，* 值与值之间是独立存在，修改一个变量不会影响其他的变量* * 对象是保存到堆内存中的，每创建一个新的对象，就会在堆内存中开辟出一个新的空间，* 而变量保存的是对象的内存地址（对象的引用），如果两个变量保存的是同一个对象引用，* 当一个通过一个变量修改属性时，另一个也会受到影响*/var a = 123;var b = a;a++;// console.log("a = "+a);// a = 124// console.log("b = "+b);// b = 123var obj = new Object();obj.name = "孙悟空";var obj2 = obj;//修改 obj 的 name 属性obj.name = "猪八戒";// console.log(obj.name);// 猪八戒// console.log(obj2.name);// 猪八戒//设置 obj2 为 nullobj2 = null;//注意：此时只是讲 obj2 中保存的地址设置成了 null 而并不改变其原地址指向的对象值，因此此时的 obj 还是代表的是对象而并不是 null，一定注意！;// console.log(obj);// {name: '猪八戒'}// console.log(obj2);// nullvar c = 10;var d = 10;// console.log(c == d);// truevar obj3 = new Object();var obj4 = new Object();obj3.name = "沙和尚";obj4.name = "沙和尚";// console.log(obj3);// {name: '沙和尚'}// console.log(obj4);// {name: '沙和尚'}/** 当比较两个基本数据类型的值时，就是比较值。* 而比较两个引用数据类型时，它是比较的对象的内存地址，* 如果两个对象是一模一样的，但是地址不同，它也会返回 false*/console.log(obj3 == obj4);// false</script></head><body></body>
</html>其二、结果为：
// 一进入页面后的控制台：
Ⅳ、对象字面量：
其一、代码为：
<!DOCTYPE html>
<html><head><meta charset="UTF-8"><title></title><script type="text/javascript">//创建一个对象//var obj = new Object();/** 使用对象字面量来创建一个对象*/var obj = {};// console.log(typeof obj);// objectobj.name = "孙悟空";// console.log(obj.name);// 孙悟空/** 使用对象字面量，可以在创建对象时，直接指定对象中的属性* 语法：{属性名:属性值,属性名:属性值....}* 对象字面量的属性名可以加引号也可以不加，建议不加,* 如果要使用一些特殊的名字，则必须加引号* * 属性名和属性值是一组一组的名值对结构，* 名和值之间使用:连接(即：使用冒号连接)，多个名值对之间使用,隔开(即：使用逗号隔开)* 如果一个属性之后没有其他的属性了，就不要写,(即：就不要写逗号)*/var obj2 = {name:"猪八戒",age:13,gender:"男",test:{name:"沙僧"}};console.log(obj2.test);// {name: '沙僧'}</script></head><body></body>
</html>其二、结果为：
// 一进入页面后的控制台：
Ⅴ、小结：
其一、哪里有不对或不合适的地方，还请大佬们多多指点和交流！
其二、若有转发或引用本文章内容，请注明本博客地址(直接点击下面 url 跳转) https://blog.csdn.net/weixin_43405300,创作不易，且行且珍惜！
其三、有兴趣的话，可以多多关注这个专栏(Vue(Vue2+Vue3)面试必备专栏)(直接点击下面 url 跳转)：https://blog.csdn.net/weixin_43405300/category_11525646.html?spm=1001.2014.3001.5482
其四、再有兴趣的话，也可以多多关注这个专栏(Java)(直接点击下面 url 跳转)：https://blog.csdn.net/weixin_43405300/category_12654744.html?spm=1001.2014.3001.5482