• js中用于对象的语句——with和for...in语句学习专题


     with语句和for...in语句是js中用于对象的语句。以下分别对这两个语句进行详细介绍和举例。
      1. with语句
          1)简要说明
            with 语句可以方便地用来引用某个特定对象中已有的属性,但是不能用来给对象添加属性。要给对象创建新的属性,必须明确地引用该对象。
          2)语法格式
          with(object instance) {
         //代码块
       }
       有时候,我在一个程序代码中,多次需要使用某对象的属性或方法,照以前的写法,都是通过:对象.属性或者对象.方法这样的方式来分别获得该对象的属性和方法,着实有点麻烦,学习了with语句后,可以通过类似如下的方式来实现:
      with(objInstance) {
         var str = 属性1;
         ......
      }
      去除了多次写对象名的麻烦。
      3)举例
       eg1.在with中取对象属性举例: <script language="javascript">
    <!--
    function Employee() {
        this.name = "阿蜜果";
        this.age = "24";
        this.gender = "女";
    }
    
    var amigo = new Employee();
    with(amigo) {
        var str = "姓名: " + name + "<br>";
        str += "年龄:" + age + "<br>";
        str += "性别:" + gender;
        document.write(str);
    }
    //-->
    </script>     代码执行效果如下:
          姓名: 阿蜜果
          年龄:24
          性别:女
        eg2.在with代码块中调用对象的方法:
        <script language="javascript">
    <!--
    var now = new Date();
    with(now) {
        var str = "当前日期:";
        str += getYear() + "年";
        str += (getMonth() + 1) + "月";
        str += getDate() + "日";
    
        document.write(str);
    }
    //-->
    </script>
        程序执行结果如下:
        当前日期:2007年4月7日
    2. for...in语句
       1)简要说明
         该语句用于对数组或者对象的属性进行循环操作。它可对某个对象的所有属性进行循环操作。
       2)语法格式
         for (变量 in 对象) {
            在此执行代码
         }
       3)举例
        eg1.使用for...in循环遍历数组,代码如下:
          <script type="text/javascript">
    var index;
    var myFriends = new Array();
    myFriends[0] = "chocalate Xiao";
    myFriends[1] = "sterning";
    myFriends[2] = "wolf";
    
    document.write("friends list: <br/>")
    for (index in myFriends) {
        document.write(myFriends[index] + "<br/>")
    }
    </script>
    
    
        执行结果如下:
        friends list: 
        chocalate Xiao
        sterning
        wolf
        eg2. 使用for...in语句调用对象的属性和属性值,代码如下:
        <script language="javascript">
    <!--
    function Employee() {
        this.name = "阿蜜果";
        this.age = "24";
        this.gender = "女";
    }
    
    var amigo = new Employee();
    var prop;
    for(prop in amigo) {
        document.write("属性: " + prop + ";属性值: " + amigo[prop] + "<br/>");
    }
    //-->
    </script>
         代码执行结果如下:
         属性: name;属性值: 阿蜜果
         属性: age;属性值: 24
         属性: gender;属性值: 女 
    

    With(DOM){}可以得到DOM对象,进行读出属性,那么也就可以进行设置属性。例如师姐的跑马灯

     <div id="marquees">
    2                             <!-- 这些是字幕的内容,你可以任意定义 -->
    3                             <label runat="server" id="LMessage">
    4                             </label>
    5                             <!-- 字幕内容结束 -->
    6                         </div>
    7
    8                         <script language="javascript" type="text/javascript">
    9                             marqueesWidth = 250; //内容区宽度度
    10                              stopscroll = false; //这个变量控制是否停止滚动
    11  
    12                             with (marquees) {//把一个DIV的DOM对象拿过来直接用。WITH方法,使得,其对象的属性都可以直接使用
    13                                 noWrap = true; //这句表内容区不自动换行
    14                                 style.width = marqueesWidth; //于是我们可以将它的宽度设为0,因为它会被撑大
    15                                 style.height = 'auto';
    16
    17                                 style.overflowX = "hidden"; //滚动条不可见
    18                                 onmouseover = new Function("stopscroll=true"); //鼠标经过,停止滚动
    19                                 onmouseout = new Function("stopscroll=false"); //鼠标离开,开始滚动
    20                             }

  • 相关阅读:
    node读写文件
    idea下建立bootstrap项目
    webpack
    Bootstrap-javascript插件
    Bootstrap-other内置组件
    Centos 修改当前路径显示为全路径
    深入理解java虚拟机(4)类加载的过程
    深入理解java虚拟机(3)垃圾收集器与内存分配策略
    深入理解java虚拟机(2)
    Scala学习笔记(3)
  • 原文地址:https://www.cnblogs.com/mahaisong/p/2037398.html
Copyright © 2020-2023  润新知