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>
JS对象简介的更多相关文章
- 五 js对象简介
对象简介 js中没有"类"的概念,只有对象. A:对象声明方式有三种 ------------1.调用Object函数创建对象: var person = new Object; ...
- 55、js对象
在python中我们学习了面向对象,javascript也是一门面向对象语言,在JavaScript中除了null和undefined以外其他的数据类型都被定义成了对象. JavaScript的对象简 ...
- 7、js对象
在python中我们学习了面向对象,javascript也是一门面向对象语言,在JavaScript中除了null和undefined以外其他的数据类型都被定义成了对象. 本篇导航: String对象 ...
- JS组件系列——表格组件神器：bootstrap table 包含了js对象的定义和对象成员函数的定义
前言:之前一直在忙着各种什么效果,殊不知最基础的Bootstrap Table用法都没有涉及,罪过,罪过.今天补起来吧.上午博主由零开始自己从头到尾使用了一遍Bootstrap Table ,遇到不少 ...
- js json简介（json的本质也是字符串）（用于服务器和客户端通信）
js json简介(json的本质也是字符串)(用于服务器和客户端通信) 一.总结 1.json的语法和js的语法非常像,只是json的键和值都是双引号,因为json的本质也是字符串 2.json是一 ...
- JavaScript课程——Day07（对象简介、Math对象、时间对象、字符串对象）
1.对象简介 在javaScipt中,一切皆为对象或者皆可以被用作对象 宿主对象:window,document 内置对象:Number String Boolean Array数组 Obje ...
- JS对象继承篇
JS对象继承篇 ECMAScript只支持实现继承,而且其实现继承主要是依靠原型链来实现的 原型链 其基本思路是利用原型让一个引用类型继承另一个引用类型的属性和方法 function Person() ...
- JS 对象封装的常用方式
JS是一门面向对象语言,其对象是用prototype属性来模拟的,下面,来看看如何封装JS对象. 常规封装 function Person (name,age,sex){ this.name = na ...
- JSON字符串和JS对象之间的转换
JSON字符串和JS对象之间的转换 1 json字符串转换为js对象 1.1 标准json格式字符串转换为Js对象 JSON字符串 str JSON.parse(str) eval(str) eva ...
随机推荐
- clr via c# 定制特性
1,特性的应用范围:特性可应用于程序集,模块,类型,字段,方法,方法参数,方法返回值,属性,参数,泛型参数 2,利用前缀告诉编译器表明意图---下面的倾斜是必须的表明了我们的目标元素: [assemb ...
- MySQL基础（3） | 函数
MySQL基础(3) | 函数 前言 MySQL只有标量值函数的概念,没有SqlServer那种表值函数. 语法 创建 create function f_add( a int, b int ) re ...
- Mac 下如何快速重启 Dock 栏？
两种方法. 如果Dock栏出现了问题或是没有反应,请打开Launchpad并按下Command+D键. 这样就可以关闭Dock栏并重启它,效果和经常用到的killall Dock命令相同.
- 简单的leetcode题
简单的leetcode题 环绕字符串中唯一的子字符串 把字符串 s 看作是\("abcdefghijklmnopqrstuvwxyz"\)的无限环绕字符串,所以 s 看起来是这样的 ...
- 安装MYSQL到CentOS（YUM）
运行环境 系统版本:CentOS Linux release 7.3.1611 (Core) 软件版本:MYSQL-5.7 硬件要求:无 安装过程 1.基础配置 [root@localhost ~]# ...
- Vue图片验证码-自定义组件高级版
最近项目中要用到图片验证码,网上一查有很多,基本都是千篇一律的4位纯数字验证码.首先得感谢那位一代目兄台提供的模板,由于不能满足需求,所以对其进行了改造升级. 经改造的图片验证码能满足一下情形使用:① ...
- MySQL int(1) 与 int(3) 的区别
1.占用的字节都一样,只是容纳字符个数有区别. int(1): 一个字符. int(3): 三个字符. 2.另外要注意的是,无符号整数,自动左侧0填充宽度. int(3),插入值5,会变成005存储. ...
- react+dva+antd+umi项目建立操作流程及知识点总结
0.1 引用 0.1.1 react官网 0.1.2 dva官网 0.1.3 antd-mobile官网 0.1.4 umijs官网 0.1.5 转载文章-umi操作手册 一.what are the ...
- SpringBoot整合持久层技术--（一）JdbcTemplate
简介: JdbcTemplate是Spring提供的一套JDBC模板框架,利用AOP技术解决直接使用JDBC带来的重复代码问题.它没有MyBatis使用那么灵活,但是却比直接使用JDBC方便得多.Sp ...
- Console对象与错误处理机制
console的常见用途有两个. 调试程序,显示网页代码运行时的错误信息. 提供了一个命令行接口,用来与网页代码互动. console对象的浏览器实现,包含在浏览器自带的开发工具之中.按 F12 打开 ...