JS_进阶-遍历对象属性、数组输出、Math、正则表达式匹配

  1 DOCTYPE html>
  2 <html lang="en">
  3 <head>
  4     <meta charset="UTF-8">
  5     <title>Titletitle>
  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(""+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>

Original: https://www.cnblogs.com/chunfang/p/13490158.html
Author: 白月如初12138
Title: JS_进阶-遍历对象属性、数组输出、Math、正则表达式匹配

原创文章受到原创版权保护。转载请注明出处:https://www.johngo689.com/712354/

转载文章受原作者版权保护。转载请注明原作者出处!

(0)

大家都在看

  • [转]Jira Work with issue workflows

    A Jira workflow is a set of statuses and transitions that an issue moves through during it…

    技术杂谈 2023年5月30日
    097
  • 词表示

    在NLP领域,自然语言通常是指以文本的形式存在,但是计算无法对这些文本数据进行计算,通常需要将这些文本数据转换为一系列的数值进行计算。那么具体怎么做的呢?这里就用到词向量的概念。 …

    技术杂谈 2023年7月11日
    082
  • 关于力场

    1.概念陈述 接触力(contact force):只有相互接触才会发生的力叫做接触力,接触力分为弹性力和摩擦力,因为它们在本质上都是由电磁场引起的,属于电磁力. 非接触力(non…

    技术杂谈 2023年5月31日
    098
  • 2个函数宏技巧

    1.用宏调用对象函数 #define FOR_EACH_OBSERVER(ObserverType, observer_list, func) \ do{ \ CObserverL…

    技术杂谈 2023年5月31日
    085
  • 导致ANR的几种情况

    KeyDispatchTimeout(5s): 按键或触摸事件在特定时间内无法处理完成 BroadcastTimeout(前台10s,后台60s): 广播在特定时间内无法处理完成 …

    技术杂谈 2023年5月31日
    088
  • c json解析示例

    json-c是最主流的json c库。[root@hs-10-20-30-193 build]# cmake -DCMAKE_INSTALL_PREFIX=/usr/local ….

    技术杂谈 2023年6月1日
    092
  • 63.殉情的抹香鲸

    sdfds posted @2022-09-28 08:36 随遇而安== 阅读(24 ) 评论() 编辑 Original: https://www.cnblogs.com/55…

    技术杂谈 2023年6月21日
    0117
  • 一文搞懂│http和https 的通信过程及区别

    404. 抱歉,您访问的资源不存在。 可能是网址有误,或者对应的内容被删除,或者处于私有状态。 代码改变世界,联系邮箱 contact@cnblogs.com 园子的商业化努力-困…

    技术杂谈 2023年7月11日
    076
  • 从Spring中学到的【1】–读懂继承链

    最近看了一些 Spring 源码,发现源码分析的文章很多,而底层思想分析的文章比较少,这个系列文章准备总结一下Spring中给我的启示,包括设计模式思想、SOLID设计原则等,涉及…

    技术杂谈 2023年7月25日
    0121
  • 初等数论学习笔记 II:分解质因数

    初等数论学习笔记 I:同余相关。 CHANGE LOG 2022.7.13:重构文章,更新 PR 模板代码。 2023.1.23:对文章进行修补。 1. Miller-Rabin …

    技术杂谈 2023年6月21日
    0111
  • 支持JDK19虚拟线程的web框架,之二:完整开发一个支持虚拟线程的quarkus应用

    欢迎访问我的GitHub 这里分类和汇总了欣宸的全部原创(含配套源码):https://github.com/zq2599/blog_demos 本篇概览 本篇是《支持JDK19虚…

    技术杂谈 2023年7月11日
    096
  • Java实现7种常见密码算法

    原创:扣钉日记(微信公众号ID:codelogs),欢迎分享,转载请保留出处。 简介 前面在密码学入门一文中讲解了各种常见的密码学概念、算法与运用场景,但没有介绍过代码,因此,为作…

    技术杂谈 2023年7月24日
    080
  • 在工作中学习看问题的角度

    向架构师学习 修改 A 导致 B 出了问题。 我们: 这里是个坑,下次要小心点 也许我应该写文档记录下这件事 也许我应该告诉下其他同事 …… 架构师:从框架…

    技术杂谈 2023年7月11日
    079
  • easyExcel入门使用

    1 easyExcel介绍 1) easyExcel官网介绍 传统操作Excel大多都是利用Apach POI进行操作的,但是POI框架并不完善,使用过程非常繁琐且有较多的缺陷: …

    技术杂谈 2023年7月10日
    077
  • 一步一步写miscdevice的驱动模块

    (本文使用的平台为友善tiny210SDKv2) 对于linux的驱动程序来说,主要分为三种: miscdevice、platform_device、platform_driver…

    技术杂谈 2023年5月31日
    080
  • Python实现秒杀某宝商品抢购(附超详细代码)

    前言 618过去了,前两天我干了一件惊天动地的大事,估计这件大事是很多小伙伴都想干的。我居然用python抢购淘宝商品,没想到 吧,最勇敢的还是我。关于抢购的思路以及代码,我将会在…

    技术杂谈 2023年6月21日
    092
亲爱的 Coder【最近整理,可免费获取】👉 最新必读书单  | 👏 面试题下载  | 🌎 免费的AI知识星球