JavaScript之对象基础
现实世界是由无数的事物或对象组成,事物都有各独特的属性和一些动作行为,一般我们可以通过事物的某些特征或行为动作描述它。JavaScript中也是如此,JavaScript对象是多个键值对的集合,键我们称之为对象的属性,值称之为属性值。如果某个属性的值是函数,那么我们称这个属性是该对象的一个方法。
一 JavaScript对象分类
JS中对象大致可以分为3大类
1、 本地对象
这类对象是独立于宿主环境的对象,不因宿主环境的改变而有任何不同,它们由ECMAScript(JavaScript核心)提供并维护。
Object
我们称他为原始对象,JS中其他的本地对象都继承自他,他是所有对象的祖先,他的所有方法和属性都会出现在其他对象中。
Function
函数其实是功能完整的对象,他也有自己的属性和方法,我们使用function关键字定义的所有函数都属于该类。
Array
数组对象比较特别,因为它的键是从0开始的数字。并且是用中括号“[]”包裹的。
String
文本(字符串)对象。
Boolean
布尔对象。
Number
数字对象。
Date
时间对象。
RegExp
正则表达式对象。
Error:EvalError( 全局eval()功能错误 ),RangeError( 值范围错误 ),ReferenceError( 引用错误 ),SyntaxError( 语法错误 ),TypeError( 值类型错误 )
各种错误对象。这里不必深究这些对象,只需要知道有这些东西,调试的时候查询文档即可。
注意,我们自定义的对象绝大部分最终都继承自 Object,所以它们也属于此范畴。
2、 内置对象
内置对象也是独立于宿主环境的,但它只有在程序被执行之前才出现。
Global
全局对象是预定义的对象,作为JavaScript的全局函数和全局变量的占位符,全局对象只是一个对象,而不是一个类,既没有构造函数也无法被实例化。
学习基础知识阶段,大家不必详细了解构造函数相关知识,这里的重点是知道有Global这么一个对象即可。
了解详情请移步W3school。
Math
Math对象和Global一样,没有构造函数,也不能使用new实例化。它是专门用于执行数学计算的数学函数和数学常量的集合。
3、 宿主对象
所有由宿主实现的对象都属于该类,JavaScript中的宿主对象是Web对象,所有DOM和BOM对象都是宿主对象。关于它们,以后会专门讲解。
4,另一种分类
内置对象(上面的本地对象),宿主对象(同上),自定义对象(所有实例对象)。
二 JavaScript对象的创建
JavaScript中创建对象有4种常用方式:
1、 字面量方式
var obj = {
name:"ren",
age:12,
say:function(){
alert("hello,my name is " + this.name);
}
};
2、 Object()方式
var obj = new Object();
obj.name = "ren";
obj.age = 12;
obj.say = function(){
alert("hello,my name is " + this.name);
}
3、 构造函数方式
function CreateObj(){
this.name = name;
this.age = age;
this.say = function(){
alert("hello,my name is " + this.age);
};
}
var obj = new CreateObj();
4、Object.create()
var proto = {name:'ren'};
var obj = Object.create(proto);
//proto将成为obj对象的原型,原型相关的知识将在以后详细介绍
三 对象使用
1, 使用对象的属性
var obj = {
name:"ren",
age:12,
say:function(){
alert("hello,my name is " + this.name);
}
};
console.log(obj.name);//"ren"
console.log(obj["name"]);//"ren"
2,使用对象的方法
接上面的obj使用
obj.say();//"hello,my name is ren"
obj.say;//ƒ (){alert("hello,my name is " + this.name);}
//不带(),将返回函数的定义
3,获取对象的属性
使用 keys() 方法获取对象的属性:
Object.keys(obj); //['name','age','say']
var arr = [1,2,3];
Object.keys(arr); //['0','1','2']
4,删除对象的属性或方法
删除对象的属性或方法使用关键字:delete,返回true表示删除成功,false表示删除失败
var obj = {
name:"ren",
age:12,
say:function(){
alert(this.name);
}
};
delete obj.name;//true
console.log(obj);//{age:12,say:function(){alert(this.name);}}
5,冻结对象
很多时候,我们创建一个对象之后不希望它再被任何人以任何方式修改,这时候你可以使用Object.freeze()方法冻结它。
var obj = {name:'ren'};
Object.freeze(obj);
obj.name = 'ner';//'ner'
obj.age = 12;//'12'
console.log(obj);//{name:'ren'}
6,遍历对象
遍历对象通过:for...in;
for(var item in obj){
console.log(obj[item]);
}
// 'ren','12',fn
JavaScript之对象基础的更多相关文章
- JavaScript学习笔记——对象基础
javascript对象基础 一.名词解释: 1.基于对象 一切皆对象,以对象的概念来编程. 2.面向对象编程(oop Object oriented programming) A.对象 就是人们要研 ...
- JavaScript对象基础知识总结
1.什么叫JavaScript对象? 定义:名值对的集合.简单的讲就是容纳属性值和属性值的容器,这些属性可以是无序的,基本上JavaScript中所有的事物都可以看成对象. 拓展:我们经常说,数组也是 ...
- 前端基础:JavaScript DOM对象
JavaScript DOM对象 通过HTML DOM,可以访问JavaScript HTML文档的所有元素. 一.HTML DOM(文档对象模型) 当网页被加载时,浏览器会创建页面的文档对象模型(D ...
- 前端基础:JavaScript BOM对象
JavaScript BOM对象 JavaScript Window - 浏览器对象模型 浏览器对象模型(BOM)使JavaScript有能力与浏览器"对话". 浏览器对象模型(B ...
- JavaScript学习02 基础语法
JavaScript学习02 基础语法 JavaScript中很多基础内容和Java中大体上基本一样,所以不需要再单独重复讲了,包括: 各种算术运算符.比较运算符.逻辑运算符: if else语句.s ...
- javascript中对象字面量的理解
javascript中对象字面量与数组字面量 第一部分 我们知道JavaScript中的数据类型有基本数据类型和引用类型,其中Object类型就是非常常用的类型.那么如果创建一个Object类型的实例 ...
- 关于JavaScript中对象的继承实现的学习总结
一.原型链 JavaScript 中原型链是实现继承的主要方法.其主要的思想是利用原型让一个引用类型继承另一个引用类型的属性和方法.实现原型链有一种基本模式,其代码如下. function Super ...
- javascript中对象的深度克隆
记录一个常见的面试题,javascript中对象的深度克隆,转载自:http://www.2cto.com/kf/201409/332955.html 今天就聊一下一个常见的笔试.面试题,js中对象的 ...
- [前端JS学习笔记]JavaScript prototype 对象
一.概念介绍 prototype 对象 : 原型对象.在JavaScript中, 每一个对象都继承了另一个对象,后者称为"原型对象". 只有 null 除外,它没有自己的原型对象. ...
随机推荐
- SpringBoot 配置 AOP 打印日志
在项目开发中,日志系统是必不可少的,用AOP在Web的请求做入参和出参的参数打印,同时对异常进行日志打印,避免重复的手写日志,完整案例见文末源码. 一.Spring AOP AOP(Aspect-Or ...
- Java网络编程 -- NIO非阻塞网络编程
从Java1.4开始,为了替代Java IO和网络相关的API,提高程序的运行速度,Java提供了新的IO操作非阻塞的API即Java NIO.NIO中有三大核心组件:Buffer(缓冲区),Chan ...
- 【数据结构】9.java源码关于HashTable
1.hashtable的内部结构 基础存储数据的hash桶由Entry结构的数组存放而entry数据结构,有hash,key和value,还有一个指向下一个节点的引用next对象 这里就和hashma ...
- Codeforces 940D
题意略. 这道题目在比赛的时候怎么想也没想明白,后来看了别人的题解才顿悟,可以说很辣鸡了. 只有b[i - 1],b[i - 2],b[i - 3],b[i - 4]相等的时候才能对答案产生限制,否则 ...
- React生命周期函数理解
一.组件挂载阶段 1. componentWillMount() 该方法在首次渲染之前调用,在一个组件挂载到卸载的过程中,仅仅执行这一次.该函数内可以state初始化的工作,与constructor的 ...
- Oracle性能图表工具:awrcrt.sql 介绍,更新到了2.14 (2018年3月31日更新)
2018-03-31 awrcrt更新到了2.14版本, 下载地址为 https://pan.baidu.com/s/1IlYVrBJuZWwOljomVfta5g https://pan.baidu ...
- javascript语言精粹数组篇之Array的方法注意事项
本文并没有详细列出Array方法详解,本文侧重点在于使用Array编程时候要注意的问题.1.Array.concat var o = {name:"Gavin"}; var a1 ...
- 【百度之星】【思维】hdu 6724Totori's Switching Game
思维题,最后只要判断每个点的度数>=k即可. #pragma comment(linker, "/STACK:1024000000,1024000000") #pragma ...
- HDU 1018 Big Number 斯特林公式
Big Number 题意:算n!的位数. 题解:对于一个数来算位数我们一般都是用while去进行计算,但是n!这个数太大了,我们做不到先算出来在去用while算位数. while(a){ cnt++ ...
- bzoj 1146 网络管理Network (CDQ 整体二分 + 树刨)
题目传送门 题意:求树上路径可修改的第k大值是多少. 题解:CDQ整体二分+树刨. 每一个位置上的数都会有一段持续区间 根据CDQ拆的思维,可以将这个数拆成出现的时间点和消失的时间点. 然后通过整体二 ...