JaveScript基础7 数组 []的作用 对象的自定义属性

创建数组

  var  arr = [ 'a','b','c',18,32 ];
  数组序号:     0   1   2   3  4   从0开始算

读取 arr[ 2 ];
     alert( arr[ 3 ] ); → 弹出18;
可作运算:alert ( arr[ 3 ] + 2) ;→ 弹出20;

修改

  arr[ 4 ] = false ;
      位置     值

注意:前面我们添加都是用 += , += 只对非对象数据类型起作用,只有可以用运算的数据类型才能用 +=

  arr[ 6 ] = 7;
  数组第5是未定义;

→arlert( arr );


1

→ alert ( arr[ 5 ] )
2

记法:第5位数我们不知道它是什么数据类型 那就是undefined类型
          第7位以后的也是undefined类型

获取数组的长度:length

语法 : arr.lenght → 返回数组的长度
例:

  var  x = 50;
  var arr =  [ 1,2,3,x ];
  alert( arr );
3

多维数组

<script type="text/javascript">
    var  x = 50;
    var arr =  [
     1,
     2,
     [
        4,
        5,
        6,
        [
            7,
            8,
            9
        ]

     ]
     ];
</script>

取9数值
alert( arr[ 2 ][ 3 ][ 2 ] );
长度:3一维数组的长度


对象的自定义

例1

  <div id = 'box' ali='阿里' ></div>
  <script>
      var oBox = document.getElementById( 'box' );
          oBox.ali = '345';
          alert( oBox.ali );
  </script>
8

从而看出div里的ali与js里oBox.ali不一样
因为:ali是自定义标签属性,oBox .获取不了,oBox.ali修改不了,所以oBox.ali跟标签里的没有关系,只是js里对象的自定义属性,只存在于js节点里;

例2

  <div id = 'box' ali='阿里' ></div>
  <script>
      var obj ={ };
          obj.name = 'abc';
          alert( obj.name );
  </script>
9

如果不写obj.name = 'ali';直接弹 alert( obj.name )


10

不是报错;

注意:
一个对象下面,不存在的属性,在运用的时候只会是undefined不会报错;

一个直接的变量,当不存在的时候(没有var)会报错;

  var obj = {};
  var box = 1;
      obj.box = 1;

上面2个box是不一样;

1、box=1 是公共的box的变量;
2、obj.box是对象里的box的变量; 在作用域不一样的

总结:
1、全局的变量,和对象 . 的属性,即使同名也没有任何关系;
2、一个对象可以通过 . 操作添加一个没有的属性来存值;
3、一个对象下面不存在的属性,在运用的时候,只会是undefined不会报错;


[]的其他作用

所有对象后面的 . 操作可以用 [] 的形式来代替
例:

  <div id= 'box' ;></div>
  <script>
        var obj = document.getElementById ( 'box' );
            obj[ 'innetHTML' ] = '123' ;
  </script>

obj[ 'innerHTML' ]这里如果不加 ' ' innerHTML就是一个变量;所有要加 '' ;


6

另一种写法:

  <div id= 'box' ;></div>
  <script>
        var obj = document.getElementById ( 'box' );
        var x = 'innerHTML';
            obj[x] = '123' ;
  </script>
7

注意: 不能直接用 obj.x = '456';
→ 等同于 obj.'innerHTML' = '456'; 这里的‘innerHTML’ 是字符串

在不确定要加属性用[ ]

var a = 'width';
obj[a] = '200px';

这样到时候要改直接改a里面的值就可以了,扩展性比较好

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 194,088评论 5 459
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 81,715评论 2 371
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 141,361评论 0 319
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 52,099评论 1 263
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 60,987评论 4 355
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 46,063评论 1 272
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 36,486评论 3 381
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 35,175评论 0 253
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 39,440评论 1 290
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 34,518评论 2 309
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 36,305评论 1 326
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 32,190评论 3 312
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 37,550评论 3 298
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 28,880评论 0 17
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 30,152评论 1 250
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 41,451评论 2 341
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 40,637评论 2 335

推荐阅读更多精彩内容

  • 第2章 基本语法 2.1 概述 基本句法和变量 语句 JavaScript程序的执行单位为行(line),也就是一...
    悟名先生阅读 4,093评论 0 13
  • 基础复习笔记 JS效果三要素: 时间 事件 运动轨迹(分步骤来实现先死后活法逐步来) (1)获取元素 : getE...
    2e9a10d418ab阅读 371评论 0 3
  • 一、DOM 什么是DOM?Document Object Model(文档对象模型)。DOM是针对HTML和XML...
    空谷悠阅读 958评论 0 2
  • CDVPluginResult*pluginResult = [CDVPluginResultresultWith...
    XLsn0w阅读 604评论 0 1
  • 和大家一样,我也一起快乐奔波的毕业了。 可是,和大家不一样的,是接触了太多抑或承受了太多。与失去的相比,得到的不一...
    Lithy阅读 190评论 0 1