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里面的值就可以了,扩展性比较好

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

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

友情链接更多精彩内容