1 <!DOCTYPE html>

  2 <html lang="en">

  3 <head>

  4     <meta charset="UTF-8">

  5     <title>Title</title>

  6 </head>

  7 <body>

  8     <hr><h1>循环遍历对象“person”的属性</h1>

  9         <button onclick="myFunction()">点击显示循环</button>

 10         <p id="demo"></p>

 11         <p id="demo1"></p>

 12     <hr><h1>数组方法</h1>

 13         <p id="demo2"></p>

 14         <button onclick="myFunction1()">点击将数组作为字符串输出</button>

 15     <hr><h1>Math（算数） 对象</h1>

 16         <p id="demo3"></p>

 17         <button onclick="myFunction2()">点击显示算数</button>

 18     <hr><h1>RegExp：是正则表达式（regular expression）</h1>

 19         <p id="demo4"></p>

 20

 21     <script>

 22         function myFunction() {

 23             var x,txt = "";

 24             var person={fname:"Bill ",lname: "Gates ",age:56};

 25             for (x in person){

 26                 txt+=person[x];

 27             }

 28             document.getElementById("demo").innerHTML=txt;

 29         }

 30         function person(firstname,lasrname,age,eyecolor) {//使用函数来构造对象

 31             this.firstname = firstname;

 32             this.lastname = lasrname;

 33             this.age = age;

 34             this.eyecolor = eyecolor;

 35             // this.nationality = "English";

 36             this.changeName = changeName;

 37             function changeName(name) {

 38                 this.lastname = name;

 39             }

 40         }

 41         person.prototype.nationality = "English";// 添加属性；相当于this.nationality = "English";

 42         person.prototype.name = function(){return this.firstname + " "+ this.lastname};//给对象的构造函数添加新的方法

 43

 44         myMother = new person("Sally","Rally",48,"Green");

 45         myMother.changeName("Doe");//changeName() 函数 name 的值赋给 person 的 lastname 属性。

 46         document.getElementById("demo").innerHTML=myMother.nationality;

 47         document.getElementById("demo1").innerHTML=myMother.name();

 48

 49         document.write(myMother.lastname);

 50         document.write(myMother.firstname,myMother.lastname,myMother.age,myMother.eyecolor);

 51

 52         var hege = ["Cecilie","Lone"];

 53         var stale = ["Emil","Tobias","Linus"];

 54         var brothers = ["Jani","Tove"];

 55         var Children = hege.concat(stale);//合并两个数组 - concat()

 56         var Children1 = hege.concat(stale,brothers);//合并三个数组 - concat()

 57         document.write(Children);

 58         document.write(Children1);

 59

 60         function myFunction1() {

 61             var fruits = ["Banana","Orange","Apple","Mango","Lemon"];

 62             var x = document.getElementById("demo2");

 63             x.innerHTML = fruits.join();

 64             fruits.pop();//删除数组的最后一个元素

 65             x.innerHTML = fruits;

 66             fruits.push("Kiwi");//给数组添加新的元素

 67             x.innerHTML = fruits;

 68             fruits.reverse();//将数组反转排序

 69             x.innerHTML = fruits;

 70             fruits.shift();//删除数组的第一个元素

 71             x.innerHTML = fruits;

 72             var citrus = fruits.slice(1,3);//截取数组下标 1 到 2 的元素

 73             x.innerHTML = citrus;

 74             fruits.sort();//字母升序排列数组

 75             x.innerHTML = fruits;

 76             var points = [100,10,15,45,56,77];//数字升序排列数组

 77             points.sort(function (a,b) {return a-b});

 78             x.innerHTML = points;

 79             points.sort(function (a,b) {return b-a});//数字降序排列数组

 80             x.innerHTML = points;

 81             fruits.splice(2,0,"Lemon","Kiwi","Kiwi1");//向数组第2个位置添加元素;0指的是覆盖后面几个元素

 82             x.innerHTML = fruits;

 83             x.innerHTML = fruits.toString();//将数组转为字符串并返回

 84             fruits.unshift("Pineapple","Pineapple1");//在数组的开头插入元素

 85             x.innerHTML = fruits;

 86         }

 87

 88         document.write("<br>"+Math.floor(Math.random()*11));// floor() 方法和 random() 来返回一个介于 0 和 11 之间的随机数

 89         function myFunction2() {

 90             document.getElementById("demo3").innerHTML=Math.round(2.6);//round 方法对一个数进行四舍五入

 91             document.getElementById("demo3").innerHTML=Math.random();//返回一个介于 0 和 1 之间的随机数

 92             document.getElementById("demo3").innerText = Math.max(2,2.6);//max() 来返回两个给定的数中的较大的数;min() 来返回两个给定的数中的较小的数

 93         }

 94

 95         var str="Is this all there is?";

 96         var patt1 = /is/gi;//i 不区分大小写的匹配；g 全文的搜索（而不是在找到第一个就停止查找,而是找到所有的匹配）

 97         document.write(str.match(patt1));

 98     </script>

 99 </body>

100 </html>

JS_进阶-遍历对象属性、数组输出、Math、正则表达式匹配的更多相关文章

  1. js遍历对象属性

    对象虽然与数组一样,都是数据的集合. 因为对象中的数据是处于无序状态,不能像数组那样,使用下标来遍历对象的所有属性. 如果要遍历对象属性,就必须要使用for in 语句. var a={ A1=180 ...

  2. javaScript遍历对象、数组总结（转载）

    javaScript遍历对象.数组总结  转载来源 https://www.cnblogs.com/chenyablog/p/6477866.html 在日常工作过程中,我们对于javaScript遍 ...

  3. ES6之6种遍历对象属性的方法

    ES6之6种遍历对象属性的方法 for ... in 循环遍历对象自身的和继承的可枚举属性(不含Symbol属性). Obejct.keys(obj),返回一个数组,包括对象自身的(不含继承的)所有可 ...

  4. JS/jQuery 遍历对象属性

    Javascript For/In 循环: 循环遍历对象的属性 var person={fname:"John",lname:"Doe",age:25}; fo ...

  5. JS遍历对象和数组总结

    在日常工作过程中,我们对于javaScript遍历对象.数组的操作是十分的频繁的,今天把经常用到的方法总结一下! 一.遍历对象 1.使用Object.keys()遍历 返回一个数组,包括对象自身的(不 ...

  6. JavaScript 遍历对象、数组总结

    在日常工作过程中,我们对于javaScript遍历对象.数组的操作是十分的频繁的,今天抽空把经常用到的方法小结一下,方便今后参考使用!   javaScript遍历对象总结     1.使用Objec ...

  7. jquery中each遍历对象和数组示例

    通用遍历方法,可用于遍历对象和数组.$().each(),回调函数拥有两个参数: 第一个为对象的成员或数组的索引,第二个为对应变量或内容.如需退出each循环可使回调函数返回false 现有如下两个s ...

  8. [C#]反射遍历对象属性

    /// <summary> /// C#反射遍历对象属性 /// </summary> /// <typeparam name="T">对象类型 ...

  9. js 遍历对象属性(for in、Object.keys、Object.getOwnProperty) 以及高效地输出 js 数组

    js中几种遍历对象的方法,包括for in.Object.keys.Object.getOwnProperty,它们在使用场景方面各有不同. for in 主要用于遍历对象的可枚举属性,包括自有属性. ...

随机推荐

  1. badusb

    ​badusb介绍 BadUSB是利用伪造HID设备执行攻击载荷的一种攻击方式.HID(Human InterfaceDevice)设备通常指的就是键盘鼠标等与人交互的设备,用户插入BadUSB,就会 ...

  2. P5017 [NOIP2018 普及组] 摆渡车

    P5017 [NOIP2018 普及组] 摆渡车 题目 P5017 思路 将实际问题抽象后,不难发现这是一个 区间 \(DP\) 我们不妨认为时间是一条数轴,每名同学按照到达时刻分别对应数轴上可能重合 ...

  3. luoguP6622 [省选联考 2020 A/B 卷] 信号传递(状压dp)

    luoguP6622 [省选联考 2020 A/B 卷] 信号传递(状压dp) Luogu 题外话: 我可能是傻逼, 但不管我是不是傻逼, 我永远单挑出题人. 题解时间 看数据范围可以确定状压dp. ...

  4. windows配置jdk环境变量、mysql环境变量、tomcat环境变量、maven环境变量、git环境变量、node环境变量

    一.windows配置各种环境变量后 path 路径下的目录: 二.windows 配置各种环境变量的目的: 为windows系统添加上各种环境对应的命令 举例,为什么要添加jdk的bin目录,是因为 ...

  5. python3 爬虫 Scrapy库学习1

    1生成项目:生成项目文件夹 scrapy startproject 项目名 2生成爬虫文件 scrapy genspider 爬虫名 指定域名 3进入items文件可以输入自己想要爬取的内容比如 te ...

  6. 什么是 Spring Cloud？

    Spring cloud 流应用程序启动器是 于 Spring Boot 的 Spring 集成应用程序,提供与外部系统的集成.Spring cloud Task,一个生命周期短暂的微服务框架,用于快 ...

  7. spring 中有多少种 IOC 容器？

    BeanFactory - BeanFactory 就像一个包含 bean 集合的工厂类.它会在客户端 要求时实例化 bean.ApplicationContext - ApplicationCont ...

  8. osi七层模型&tcp/udp

    1.TCP/UDP协议 1.1 TCP协议 可靠,速度慢,全双工通信 建立连接三次握手,断开连接四次挥手 建立起链接之后,发送每条消息都有回执,为了保证数据的完整性,还有重传机制 数据传输:有收必有发 ...

  9. scrapy基于请求传参实现深度爬取

    请求传参实现深度爬取 请求传参: 实现深度爬取:爬取多个层级对应的页面数据 使用场景:爬取的数据没有在同一张页面中 在手动请求的时候传递item:yield scrapy.Request(url,ca ...

  10. Unity用Input.touches实现手机端多点触控

    多点触控的方法,两边的触控互不干扰: 主要采用Input.touches的相关属性进行操作: 而采用IPointerDrag接口会造成两个drag的相互干扰: 代码如下: using System.C ...