一、对象理解

现实世界 万物皆对象, 一切事物都是对象 对象还是一个具体的事物

对象: 特征和行为组成  特征是名词 用来描述对象的, 行为是动词

程序中的对象
是对现实世界中事物的抽象
1. js中的对象其实就是生活中的一个抽象
2. js中的对象是一个无序属性的集合
3. 其属性可以包含基本值,对象或函数,对象就是一组没有顺序的值
4. 对象的行为和特征
行为: 方法
特征: 属性 如何创建一个对象, 如何使用对象的成员
对象: 属性和方法 称为成员 this在对象中代表的是当前对象

1.字面量创建对象

var dog = {
name: 'puppy',
type: '中华田园犬',
age: 2,
color: 'yellow',
bark: function () {
console.log(this.name + 'wang wang wang')
},
eat: function () {
console.log(this.name + '啃骨头')
}
} 属性访问
console.log(dog.name);
console.log(dog.type); 另一种访问属性的方法
console.log(dog['name']); 方法访问
dog.bark();
dog.eat(); 函数和方法的区别
函数: 独立存在的就是函数 函数名() 调用
方法: 属于对象的函数 对象名.方法() 调用

2. new Object创建对象并动态添加属性

2. new Object()
Object 是一个构造函数
new的方式来调用的构造函数
new Object() 调用构造函数 会在内存中创建一个对象 // 动态添加属性和方法
var hero = new Object(); 创建一个空对象
hero.name = 'huangzhong';
hero.weapon = ''攻击;
hero.equipment = ['tk','gj','kj'];
hero.attack = function () {
console.log(this.name +':attack lalala')
}
hero.attack();

3. 工厂函数创建对象

function createHero (name,weapon,equipment,blood) {
var hero = new Object();
// 返回一个空的对象
hero.name = name;
hero.weapon = weapon;
hero.equipment = equipment;
hero.blood = blood;
hero.attack = function () {
console.log(this.name + ': 攻击')
}
return hero;
} var hero1 = createHero('huangzhong','gongjian',['toukui','xuezi'],100);

4.自定义构造函数创建对象

命名: 遵从帕斯卡规则, 第一个单词的第一个姊妹大写,后续的每个单词首字母大写
function Hero(name,weapon,equipment,blood) {
// this 动态给对象增加成员 this 指向当前对象
this.name = name;
this.weapon = weapon;
this.equipment = equipment;
this.blood = blood;
this.attack = function () {
console.log(this.name + 'attacking')
}
} var hero1 = new Hero('huangzhong','gongjian','toukui',100)

二、 new关键字和this

1. new关键字的执行过程

1. 在内存中创建了一个空的对象
2. 让构造函数中的this指向刚刚创建的对象
3. 执行构造函数, 在构造函数中设置函数和方法
4. 返回了当前对象

2. this出现的三个地方

1. 在方法中  this 指向的是这个方法所属的对象
2. 函数中 指向window
3. 构造方法中 this就是构造函数中创建的对象

三、对象的操作案例

案例1:  for in 遍历对象

var obj = {
name: 'zs',
age: 18,
sex: 'male',
sayHi: function () {
console.log(this.name + ': hello');
}
}
for (var key in obj) {
console.log(key + '---' + obj[key]);
}

添加属性

for (var i = 0; i < 10; i++) {
o['a' + i] = i * 2
}

删除成员delete

var o = {
name: 'abc',
say: function () {
}
}
console.log(o.name);
delete o.name;
console.log(o.name);

js入门之对象的更多相关文章

  1. JS入门之ActiveXObject对象(转载)

    JS入门之ActiveXObject对象   此对象提供自动化对象的接口.   function ActiveXObject(ProgID : String [, location : String] ...

  2. js入门之内置对象Math

    一. 复习数据类型 简单数据类型, 基本数据类型/值类型 Number String Boolean Null Undefined 复杂数据类型 引用类型 Object 数组 数据在内存中是如何存储的 ...

  3. React.js入门笔记

    # React.js入门笔记 核心提示 这是本人学习react.js的第一篇入门笔记,估计也会是该系列涵盖内容最多的笔记,主要内容来自英文官方文档的快速上手部分和阮一峰博客教程.当然,还有我自己尝试的 ...

  4. Ember.js入门教程、博文汇总

    第一章 对象模型 Ember.js 入门指南——类的定义.初始化.继承 Ember.js 入门指南——类的扩展(reopen) Ember.js 入门指南——计算属性(compute properti ...

  5. React Native 系列(一) -- JS入门知识

    前言 本系列是基于React Native版本号0.44.3写的,最初学习React Native的时候,完全没有接触过React和JS,本文的目的是为了给那些JS和React小白提供一个快速入门,让 ...

  6. 以太坊智能合约开发,Web3.js API 中文文档 ethereum web3.js入门说明

    以太坊智能合约开发,Web3.js API 中文文档 ethereum web3.js入门说明 为了让你的Ðapp运行上以太坊,一种选择是使用web3.js library提供的web3.对象.底层实 ...

  7. Angular.js 入门(一)

    最近在学习angular.js,为此方便加深对angular.js前端框架的理解,因此写下这篇angular.js入门 首先介绍下什么是angular.js? AngularJS 是一个 JavaSc ...

  8. d3.js 入门指南

    说到数据可视化,我们会行到很多优秀的框架,像echarts.highcharts,这些框架很优雅,健壮,能满足我们对可视化的大部分需求,但是缺点也很明显,就是这些框架几乎是不可定制化的,当遇到特殊的需 ...

  9. 极简 Node.js 入门 - Node.js 是什么、性能有优势?

    极简 Node.js 入门系列教程:https://www.yuque.com/sunluyong/node 本文更佳阅读体验:https://www.yuque.com/sunluyong/node ...

随机推荐

  1. 【转载】 tensorflow中 tf.train.slice_input_producer 和 tf.train.batch 函数

    原文地址: https://blog.csdn.net/dcrmg/article/details/79776876 ----------------------------------------- ...

  2. QDateTime获取当前时间的时间戳

    QdateTime获取当前时间的时间戳作为图片名 QDateTime qdt1 = QDateTime::currentDateTime();QString timeStr = qdt1.toStri ...

  3. 迅速解决!!!!!启动Tomcat报错PermGen space

    启动Tomcat报错   PermGen space    内存溢出 解决方法:扩大tomcat内存 修改参数:set JAVA_OPTS=-Xms1024m -Xmx1024m -XX:PermSi ...

  4. Django models中的meta选项

    通过一个内嵌类 "class Meta" 给你的 model 定义元数据, 类似下面这样: class Foo(models.Model): bar = models.CharFi ...

  5. 单机prometheus vs 集群kube-prometheus+prometheus-operator

    prometheus 组件: node-exporter:9100端口 https://segmentfault.com/a/1190000017959127

  6. MySQL中事务的隔离级别

    MySQl InnoDB存储引擎实现SQL标准的4种隔离级别(RU,RC,RR,serializable),用来限定事务内外的哪些改变时可见的,哪些时不可见的.低级别的隔离级一般支持更高的并发处理,并 ...

  7. [转]Ubuntu 上创建常用磁盘阵列

    链接地址:https://www.jianshu.com/p/9a458510593a

  8. jqweui 正在加载样式的用法

    见下图: 代码说明: $.showLoading("加载中..."); $.ajax({ success : function(data) { $.hideLoading(); } ...

  9. Swoole练习 UDP

    UDP 服务代码 <?php //创建Server对象,监听 127.0.0.1:9502端口,类型为SWOOLE_SOCK_UDP $serv = new swoole_server(&quo ...

  10. pycharm设置开发模板/字体大小/背景颜色(3)

    一.pycharm设置字体大小/风格 选择 File –> setting –> Editor –> Font ,可以看到如上界面,可以根据自己的喜好随意调整字体大小,字体风格,文字 ...