JavaScript入门-对象
js对象
本篇主要介绍js里如何创建对象,以及for循环访问对象的成员...
什么是对象?
- 对象,并不是中文里有男女朋友意思,它是从英文里翻译来的,英文叫[Object],目标,物体,物品的意思。
- 在编程里,我们经常听到有人说,面向对象。那这个对象,你简单来理解,就是一个容器,一个能装变量、函数体的容器。也可以在里面继续装下对象。
对象的创建
//方法一(推荐)
var obj = {
name : 'rainbow',
run : function(){
console.log('跑步中...')
}
}
//方法二(不推荐)
var obj = new Object()
obj.name = 'rainbow'
obj.run = function(){
console.log('running...')
}
//方法三(推荐)
var obj = {}
obj.name = 'rainbow'
obj.say = function(){
console.log('saying ...')
}
ps:
- 以上就是创建对象的三种方法,尽量避免第二种方法,因为new Object效率低,建议使用第三种或者第一种。
- 属性名可以单引,可以双引,也可以不引,但他的类型永远都是string类型
- 变量里的成员变量,也可以被赋值方法。但是不推荐这么做。
for循环访问对象成员
for...in
//先定义一个对象
var obj = {
name : 'rainbow',
age : 20,
sex : 'man',
run : function(){
console.log('I'm running...')
}
}
for ( var key in obj ){
if('function' == typeof obj[key]){
obj[key]()
break
}
console.log(obj[key])
}
//输出结果如下
rainbow
20
man
I am running...
/*估计有些人会问,为什么不是用obj.key访问呢??
那我们不妨打印看看,boj.key是什么?
那请往下看:*/
for (var key in obj) {
console.log(key , typeof key)
console.log(obj.key)//undefined
}
- 打印如下

ps:我们可以知道,在js里,for...in不能用点运算访问,而是用obj[key]访问,并且方法名也可以访问。
for...of
//1.使用js内置的对象,创建一个数组对象
var array = new Array(11,56,89,78,-12)
console.log( typeof array )//object
for ( var val of array){
console.log(val)//11,56,89,78,-12
}
//2.用的自定义的对象
var obj = {
name : 'rainbow',
age : 20,
sex : 'man',
run : function(){
console.log('I'm running...')
}
}
for ( var val of obj ){
console.log(obj)//obj is not iterable
}
这里报错的意思是,obj这个对象是不可迭代的
总结
- 用for...of不能迭代
自定义对象 - 用for...in,不能用点运算访问成员,而是用
对象[属性名],可以访问一个不存在的属性,但是返回值为undefined - 不要使用普通for循环访问对象成员
JavaScript入门-对象的更多相关文章
- JavaScript 入门之常见对象
常见对象 1. Object 对象 2. String 对象 3. Array 对象 4. Date 对象 5. Number 对象 6. 自定义对象 with 语句 为了简化对象调用内容的书写 格式 ...
- JavaScript入门篇 编程练习
编程挑战 一.定义"改变颜色"的函数 提示: obj.style.color obj.style.backgroundColor 二.定义"改变宽高"的函数 提 ...
- JavaScript入门
本篇内容是学习慕课网相关课程后,总结出可能未来会忘记的内容 (一)JavaScript入门操作 1.js代码插入位置,以及执行顺序 <head> <script type=" ...
- 慕课网JavaScript入门篇课程笔记
1.js注释很重要 单行注释,在注释内容前加符号 “//”. <script type="text/javascript"> document.write(" ...
- JavaScript入门培训材料(Copy至此以作备份)
JavaScript简明学习教程 2014年5月31日 目录 一.说明... 2 二.准备知识... 2 (一)HTML. 2 (二)DOM.. 3 三.JavaScript简介... 3 四.Jav ...
- JavaScript入门基础
JavaScript基本语法 1.运算符 运算符就是完成操作的一系列符号,它有七类: 赋值运算符(=,+=,-=,*=,/=,%=,<<=,>>=,|=,&=).算术运 ...
- JavaScript入门介绍(二)
JavaScript入门介绍 [函数] 函数function 是Javascript的基础模块单元,用于代码的复用.信息影藏和组合调用. function a(){} 函数对象Function Lit ...
- JavaScript入门介绍(一)
JavaScript入门介绍 [经常使用的调试工具][w3school.com.cn在线编辑] [Chrome浏览器 开发调试工具]按F121.代码后台输出调试:console.log("t ...
- 开心菜鸟系列----函数作用域(javascript入门篇)
1 <!DOCTYPE html> 2 <html> 3 <script src="./jquery-1.7.2.js"></ ...
随机推荐
- Mongdb优化
1.索引1)基础索引--为集合colt1的x列创建升序基础索引# cd /usr/local/mongodb4.2.2/bin# ./mongo -uroot -p> use db_test&g ...
- 架构师基础技能-搭建gitLab
前言 想要成为一名架构师,一定要有从无到有搭建环境的能力,这是作为架构师的基础技能,而gitLab服务器的搭建一定又是重中之重. 相信很多小伙伴的公司也在使用gitLab,但都是你们公司的架构师搭建好 ...
- 升级jenkins之后无法启动 报错Unable to read /var/lib/jenkins/config.xml
故障记录 点击jenkins升级后再点击回滚到之前版本,jenkins就起不来了. 欲哭无泪,报错如下 hudson.util.HudsonFailedToLoad: org.jvnet.hudson ...
- Spring Boot 最简单的解决跨域问题
跨域问题(CORS) CORS全称Cross-Origin Resource Sharing,意为跨域资源共享.当一个资源去访问另一个不同域名或者同域名不同端口的资源时,就会发出跨域请求.如果此时另一 ...
- Android各版本迭代改动与适配集合
前言 今天分享的面试题是: Android在版本迭代中,总会进行很多改动,那么你熟知各版本都改动了什么内容?又要怎么适配呢? Android4.4 发布ART虚拟机,提供选项可以开启. HttpURL ...
- css 17-CSS3的常见边框汇总
17-CSS3的常见边框汇总 #CSS3 常见边框汇总 <!DOCTYPE html> <html lang="en"> <head> < ...
- js上 十五、数组-1
十五.数组-1 #1.什么是数组 组:由多个成员构成的一个集体. 数组:数组是值的有序集合 值就是前面所讲过的这些数据(各种数据类型的都可以) 是数组中,每一个值(如100,'js',true)都称之 ...
- [水题日常]UVA1625 Color Length
来整理一下思路- 一句话题意:给两个大写字母的序列,每次取出其中一个数列的第一个元素放到新序列里面,对每个字母\(c\)记它的跨度\(L(c)\)为这个字母最后出现的位置-第一次出现的位置,求新序列所 ...
- RHCSA 复习
1.用户 # -->当前用户为root用户 $ -->当前用户为普通用户 [root@fafa ~]# su - 用户 ----切换用户 2.查看.修改主机名: ***保存在/etc/ ...
- (三)、vim的移动(旋转,跳跃)
一.以word为单位的移动 1.w 向后移动到后一个单词词头,取自"word" This is a line with example text ----->--->- ...