JavaScript-----12.对象
1. 对象
万物皆对象,但是对象必须是一个具体的事物。例如:“明星”不是对象,“周星驰”是对象;“苹果”不是对象“这个苹果”是对象。Js中,对象是一组无序的相关属性和方法的集合。
对象是由属性和方法组成的
- 属性:事物的特性,在对象中用属性来表示(常用名词)
- 方法:事物的行为,在对象中用方法来表示(常用动词)
2.创建对象的三种方法
- 利用字面量来创建对象
- 利用new Object创建对象
- 利用构造函数来创建对象
2.1 利用字面量来创建对象
对象字面量:就是{},里面包含了表达这个具体事物的属性和方法。
回忆:()是运算符,优先级最高;[]是数组字面量,用于创建数组;{}是对象字面量,用于创建对象。
//1.利用字面量创建对象
//var obj={};//创建了一个空的对象
var obj = {
uname: 'Lili',
age: 18,
sex: 'male',
sayHi: function() { //匿名函数充当方法
console.log('hi~');
}
}
//注意点
//(1)对象里的属性或者方法采用的是键值对的形式 键(属性名):值(属性值)
//(2)多个属性或者方法之间用逗号隔开
//(3)方法冒号后面跟的是一个匿名函数
//2.使用对象
//(1)调用对象的属性采取的是 对象名.属性名
console.log(obj.uname);
//(2)调用对象属性还有一种方法 对象名['属性名']
console.log(obj['age']);
//(3)调用对象的方法采取的是 对象名.方法名() 千万别忘记添加小括号
obj.sayHi(); //hi~
变量、属性、函数、方法总结:
//1.变量和属性的相同点:都是用来存储数据的
var num = 10;
var obj = {
age: 10
}
//不同点:
//变量 单独声明并赋值 使用的时候直接写变量名 单独存在
console.log(num);
//属性 在对象里面不需要声明使用的时候必须是对象.属性
console.log(obj.age);
//2.函数和方法的相同点:都是实现某种功能 做某件事
function fn() {
}
var obj = {
fn: function() {
}
}
//不同点
//函数的单独声明并且调用的 函数名() 单独存在
fn();
//在对象里面 调用的时候是 对象.方法()
obj.fn();
2.2 利用new Object创建对象
//1. 利用new Object创建对象
var obj = new Object(); //创建了一个空的对象
//在空对象里追加属性和方法
obj.uname = 'Lili';
obj.age = 18;
obj.sex = 'male';
obj.satHi = function() {
console.log('hi');
}
//(1)利用等号赋值的方法来添加对象的属性和方法
//(2)每个属性和方法直接用分号结束
//2. 调用属性的两种方式
console.log(obj.uanme);
console.log(obj['sex']);
//调用方法
obj.sayHi();
2.3 利用构造函数来创建对象
为什么需要用到构造函数来创建对象?因为前面提到的两种创建对象的方法,一次仅仅可用创建一个对象。有时候创建很多个对象的时候,里面很多的属性和方法大量是相同的,因此考虑运用函数的方法来重复这些相同的代码。我们就把这个函数称为构造函数。换句话说:构造函数就是对象里面一些相同的属性和方法抽象出来封装到函数里。
//语法格式
//1.利用构造函数创建对象
function 构造函数名() {
this.属性 = 值;
this.方法 = function() {
}
}
//2.调用
new 构造函数名();
举例
function Star(uname, age, sex) {
this.name = uname;
this.age = age;
this.sex = sex;
this.sing = function(sang) {
console.log(sang);
}
}
var ldh = new Star('刘德华', 18, '男');
console.log(typeof ldh); //object
console.log(ldh.name); //刘德华
console.log(ldh['sex']); //男
ldh.sing('冰雨');//冰雨
//(1)构造函数名首字母要大写
//(2)构造函数不需要return就可用返回结果
//(3)构造函数返回的是一个对象,利用typeof可用检测出来
//(4)构造函数与普通函数的不同之处在于:调用的时候前面多加了一个new;函数体里面属性和方法前面必须加上this;构造函数名首字母必须要大写
构造函数和对象的区别:
- 构造函数泛指一大类,相当于java语言里面的类;对象是一个特指
- 利用构造函数创建对象的过程又称未类的实例化
3. new关键字
function Star(uname, age, sex) {
this.name = uname;
this.age = age;
this.sing = function(sang) {
console.log(sang);
}
}
var ldh = new Star('刘德华', 18, '男');
//new 关键字执行过程
//1. new构造函数new Star可用在内存中创建了一个空对象
//2. this就会指向刚才创建的空对象
//3. 执行构造函数里面的代码 给这个空对象添加属性和方法
//4. 返回这个对象(所以构造函数里不需要return)
4. 遍历对象属性
for...in用于对数组或者对象的属性进行循环操作
var obj = {
name: 'pink老师',
age: 18,
sex: '男',
fn: function() {}
}
for (var k in obj) {
console.log(k); //k变量输出 得到的是属性名
console.log(obj[k]); //obj[k]得到的是属性值
}
JavaScript-----12.对象的更多相关文章
- 12 JavaScript String对象 & Date对象
<script> var a = "string"; var b = new String("string"); var c = new Strin ...
- javascript 全局对象--w3school
JavaScript全局对象 1. decodeURI()解析某个编码的URI. 2.decodeURInComponent()解析一个编码的URI组件. 3.encodeURI()把字符串编码为U ...
- JavaScript Json对象和Json对象字符串的关系 jsonObj<->JsonString
JavaScript Json对象和Json对象字符串的关系 jsonObj<->JsonString 如下示例: 直接写的a1就是一个Json对象,a2 就是一个Json对象字符串; 通 ...
- 据说每个大牛、小牛都应该有自己的库——JavaScript原生对象拓展
在据说每个大牛.小牛都应该有自己的库——框架篇中我扬言要做个小牛,没想到一天没更新,小伙儿伴们就戏谑的问我,油哥是不是要太监了?其实事情是这个样子的,这不是太监的节奏,一是,关于写个自己的库的想法由来 ...
- javascript数组对象排序
javascript数组对象排序 JavaScript数组内置排序函数 javascript内置的sort函数是多种排序算法的集合 JavaScript实现多维数组.对象数组排序,其实用的就是原生的s ...
- JavaScript Date对象 日期获取函数
JavaScript Date对象使用小例子: 运行结果: 总结: 1.尽管我们认为12月是第12个月份,但是JavaScript从0开始计算月份,所以月份11表示12月: 2.nowDate.set ...
- JavaScript日期对象使用总结
javascript Date日期对象的创建 创建一个日期对象: var objDate=new Date([arguments list]); 我总结了参数形式主要有以下3种: new Date(& ...
- JavaScript Date对象介绍
原文:JavaScript Date对象介绍 Date 日期和时间对象 1. 介绍 Date对象,是操作日期和时间的对象.Date对象对日期和时间的操作只能通过方法. 2. 构造函数 2.1 new ...
- JavaScript原生对象拓展
JavaScript原生对象拓展 在据说每个大牛.小牛都应该有自己的库——框架篇中我扬言要做个小牛,没想到一天没更新,小伙儿伴们就戏谑的问我,油哥是不是要太监了?其实事情是这个样子的,这不是太监的节奏 ...
- JavaScript判断对象的类型
JavaScript判断对象的类型 最近阅读了一些关于JavaScript判断对象类型的文章.总结下来,主要有constructor属性.typeof操作符.instanceof操作符和Object. ...
随机推荐
- 笔记||Python3之字符串
字符串是Python中最常用的数据类型.我们可以使用引号('或''或''')来创建字符串. 三引号特点:可以多行,也可以多行注释. a = 'hello world' a = "hello ...
- Java构造器浅析
Java构造器 问题引出 1.先看一段简单创建对象的例子: public class constructTest { public static void main(String[] args) { ...
- vue 组件传递值以及获取DOM元素的位置信息
1.父组件 select_li.vue 1.1 父组件模板 <template> <div id='selectLi' ref="selectLi"> &l ...
- Centos7调整root分区大小
由于centos安装完毕后一般给root只有50G左右,而home牛大, 所以多数时候需要把home弄小,root给扩展大一点 折腾一下 首先切好用户到root用户登陆,我用的systemctl se ...
- SoC的软件开发流程,主要包含一些Linux下的操作命令
该笔记主要记录SoC的软件开发流程,主要包含一些Linux下的操作命令 1. 编写design file .c .h 2. 编写makefile 可执行文件名,交叉编译环境,compile fl ...
- 解决苹果mac远程桌面无VDI客户端
解决苹果mac远程桌面云aDesk无VDI客户端 因集团办公工作需要使用桌面云aDesk 在深信服官网并未有mac 的VDI Client客户端 mac电脑可通过Google浏览器访问VDI的服务器地 ...
- 3种骚操作,教你查看 Java 字节码!
在我们工作.学习.以及研究 JVM 过程当中,不可避免的要查看 Java 字节码,通过查看字节码可以了解一个类的编译结果,也能通过编译器层面来分析一个类的性能. 字节码文件是不能直接打开的,下面栈长教 ...
- Blog 须知
转载 转载需通过博主同意方可 代码格式 博主遵循 \(Google\) 代码格式,代码满足以下规范: 字符数 每行代码必需不超过 80 字符 缩进 缩进不使用制表符,而是 2 个空格缩进 函数 函数左 ...
- c++-重载等号,数组,指针,字符串类
重载 重载=操作符 1先释放旧对象资源 2用一个对象=给另外一个对象 3函数返回值当左值 返回一个引用 4 数组类 Array& operator=(Array& a1); 5 字符串 ...
- 「SAP技术」SAP VL02N 执行批次拆分报错,说不允许批次拆分?
1,如下新建的DN 80017843,storage location 字段值为空.VL02N 试图去做批次拆分失败,系统报错说,Batch split is not permitted for ma ...