JavaScript回调函数及数组方法测试

Stella981
• 阅读 614

JavaScript回调函数及数组方法测试

具体代码如下:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="GBK">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>javascript回调函数、数组知识点</title>
    <script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>
</head>
<body>
    <script type="text/javascript">

        function callback() {
            console.log("callback function");
        }

        function B(msg, callback) {
            callback();
            console.log("B main function");
        }

        var person = new Object();
        
        person = {name:"Jack",age:17,"height":199.3};
        
        var arr = new Array("blue", "green", "red");
        arr[arr.length] = "yellow";
        arr[arr.length] = "pink";
        var arr2 = ["car", "city", "computer"];

        //数组可以作为栈(先进后出FILO)用,使用push方法添加元素,pop方法弹出最后一个元素并返回该值
        var arr3 = new Array();
        arr3.push("lenovo");
        arr3.push("dell");
        var item = arr3.pop();//返回弹出的最后项的值dell

        /*
        数组可以作为队列(先进先出FIFO)用,使用push方法添加元素,shift方法移除数组的第一项并返回该值
        unshift方法可以在数组前端新增任意个项并返回新数组的长度
        */
        var arr4 = new Array();
        arr4.push("acer");
        arr4.push("xiaomi");
        var itme = arr4.shift();//item:acer
        var count = arr4.unshift("huawei","asus");//新数组:huawei asus xiaomi

        //用 prototype 属性为对象的类提供一组基本功能。 对象的新的实例“继承”了赋予该对象的原型的行为。
        var testEmail = "324234@qq.com";
        String.prototype.isEmail = function () {//邮箱判断
            return testEmail.includes("@");
        }
        
        /*
        数组concat方法(基于当前数组创建一个新数组)与slice(基于当前数组的一个或多个项创建数组,接受1个或2个参数)方法
        slice(n)返回索引n到数组末尾的片段
        slice(n,m)返回索引n到m-1的数组片段,不包括索引m处的元素
        */
        var arr5 = new Array("a1","a2");
        var arr6 = arr5.concat("b1","b2");//concat:创建当前数组的副本,然后在副本末尾连接上新值,返回拼接的新数组
        var t = arr6.slice(0,1);//返回arr6索引值0到0的元素
        var t2 = arr6.slice(1,3);//返回arr6索引值1到2的元素,不包括索引3
        console.log("arr5: " + arr5);//a1 a2
        console.log("arr6: " + arr6);//a1 a2 b1 b2
        console.log("arr6.slice(0,1): " + t);//a1
        console.log("arr6.slice(1,3): " + t2);//a2 b1

        /*
        数组的位置方法
        indexOf(n)从数组开头(索引0)处开始查找n所在的位置,返回n对应的索引值,找不到返回-1
        lastIndexOf(n)从数组末尾(索引arr.length-1)处开始查找n所在的位置,返回n对应的索引值,找不到返回-1
        */
        console.log("arr6.indexOf(\"b1\"): " + arr6.indexOf("b1"));//2
        console.log("arr6.lastIndexOf(\"a2\"): " + arr6.lastIndexOf("a2"));//1
        console.log("arr6.lastIndexOf(\"a3\"): " + arr6.lastIndexOf("a3"));//-1
        
        /*
        数组的5个迭代方法
        1、every():对数组中的每一项运行给定函数,如果该函数对每一项都返回true,则返回true;
        2、filter():对数组中的每一项运行给定函数,返回该函数会返回true的项组成的数组;
        3、forEach():对数组中的每一项运行给定函数。该方法无返回值;
        4、map():对数组中的每一项运行给定函数,返回每次函数调用的结果组成的数组;
        5、some():对数组中的每一项运行给定函数,如果该函数对任一项返回true,则返回true。
        以上方法都不会修改数组中包含的值。
        every()方法和some()方法很像,区别就是every()方法需要每项都返回true才能返回true,some()方法
        只要有一项运行函数返回true,则返回true。
        */
        var numbers = [0,2,-9,12,200,5,-8];
        var everyResult = numbers.every(function(value, index, array) {
            return (value > 0);//判断每项是否都大于0
        })
        console.log("everyResult: " + everyResult);//everyResult: false

        var filterResult = numbers.filter(function(value, index, array) {
            return (value > 0);//过滤出大于0的元素
        })
        console.log("filterResult: " + filterResult);//filterResult: 2,12,200,5

        numbers.forEach(function(value, index, array) {
            console.log("numbers's element is " + value);//遍历输出数组元素
        })

        var mapResults = numbers.map(function(value, index, array) {
            return (value * 3);//数组元素每项*3
        })
        console.log("mapResults: " + mapResults);//mapResults: 0,6,-27,36,600,15,-24
        
        var someResults = numbers.some(function(value, index, array) {
            return (value > 0);//是否存在大于0的项
        })
        console.log("someResults: " + someResults);


        $(document).ready(function() {
            B("HELLO",callback);//回调函数的引用作为入参,并在函数中调用回调函数
            console.log(person.name + " is " + person.age + " years old" + "height is " + person.height);
            console.log(typeof person.name);
            console.log(typeof person.age);
            console.log(typeof person.height);
            console.log(typeof person["height"]);
            //遍历数组
            arr.forEach(function(key) {
                console.log(key + "-");
            });
            $.each(arr,function(key,value) {
                console.log(key + "~" + value);
            });
            for (var i in arr) {
                console.log(arr[i] + "#");
            }
            //邮箱验证
            console.log("email check result is " + testEmail.isEmail())
        });
    </script>
</body>
</html>

控制台结果:

arr5: a1,a2
arr6: a1,a2,b1,b2
arr6.slice(0,1): a1
arr6.slice(1,3): a2,b1
arr6.indexOf("b1"): 2
arr6.lastIndexOf("a2"): 1
arr6.lastIndexOf("a3"): -1
everyResult: false
filterResult: 2,12,200,5
numbers's element is 0
numbers's element is 2
numbers's element is -9
numbers's element is 12
numbers's element is 200
numbers's element is 5
numbers's element is -8
mapResults: 0,6,-27,36,600,15,-24
someResults: true
callback function
B main function
Jack is 17 years oldheight is 199.3
string
number
number
number
blue-
green-
red-
yellow-
pink-
0~blue
1~green
2~red
3~yellow
4~pink
blue#
green#
red#
yellow#
pink#
email check result is true
点赞
收藏
评论区
推荐文章
blmius blmius
2年前
MySQL:[Err] 1292 - Incorrect datetime value: ‘0000-00-00 00:00:00‘ for column ‘CREATE_TIME‘ at row 1
文章目录问题用navicat导入数据时,报错:原因这是因为当前的MySQL不支持datetime为0的情况。解决修改sql\mode:sql\mode:SQLMode定义了MySQL应支持的SQL语法、数据校验等,这样可以更容易地在不同的环境中使用MySQL。全局s
翼
3年前
js 数组 转为树形结构
需要转换为树形的数组vardata{"orderById":null,"platformCommissionProportion":1,"name":"添加剂","pid":13,"id":26
Wesley13 Wesley13
2年前
java将前端的json数组字符串转换为列表
记录下在前端通过ajax提交了一个json数组的字符串,在后端如何转换为列表。前端数据转化与请求varcontracts{id:'1',name:'yanggb合同1'},{id:'2',name:'yanggb合同2'},{id:'3',name:'yang
Jacquelyn38 Jacquelyn38
2年前
2020年前端实用代码段,为你的工作保驾护航
有空的时候,自己总结了几个代码段,在开发中也经常使用,谢谢。1、使用解构获取json数据let jsonData  id: 1,status: "OK",data: 'a', 'b';let  id, status, data: number   jsonData;console.log(id, status, number )
皕杰报表之UUID
​在我们用皕杰报表工具设计填报报表时,如何在新增行里自动增加id呢?能新增整数排序id吗?目前可以在新增行里自动增加id,但只能用uuid函数增加UUID编码,不能新增整数排序id。uuid函数说明:获取一个UUID,可以在填报表中用来创建数据ID语法:uuid()或uuid(sep)参数说明:sep布尔值,生成的uuid中是否包含分隔符'',缺省为
Wesley13 Wesley13
2年前
mysql设置时区
mysql设置时区mysql\_query("SETtime\_zone'8:00'")ordie('时区设置失败,请联系管理员!');中国在东8区所以加8方法二:selectcount(user\_id)asdevice,CONVERT\_TZ(FROM\_UNIXTIME(reg\_time),'08:00','0
Stella981 Stella981
2年前
JS 对象数组Array 根据对象object key的值排序sort,很风骚哦
有个js对象数组varary\{id:1,name:"b"},{id:2,name:"b"}\需求是根据name或者id的值来排序,这里有个风骚的函数函数定义:function keysrt(key,desc) {  return function(a,b){    return desc ? ~~(ak
Stella981 Stella981
2年前
JavaScript回调函数的高手指南
摘要:本文将会解释回调函数的概念,同时帮你区分两种回调:同步和异步。回调函数是每个前端程序员都应该知道的概念之一。回调可用于数组、计时器函数、promise、事件处理中。本文将会解释回调函数的概念,同时帮你区分两种回调:同步和异步。1.回调函数首先写一个向人打招呼的函数。只需要创建一个接受name参数的函数gree
Wesley13 Wesley13
2年前
MySQL部分从库上面因为大量的临时表tmp_table造成慢查询
背景描述Time:20190124T00:08:14.70572408:00User@Host:@Id:Schema:sentrymetaLast_errno:0Killed:0Query_time:0.315758Lock_
Python进阶者 Python进阶者
3个月前
Excel中这日期老是出来00:00:00,怎么用Pandas把这个去除
大家好,我是皮皮。一、前言前几天在Python白银交流群【上海新年人】问了一个Pandas数据筛选的问题。问题如下:这日期老是出来00:00:00,怎么把这个去除。二、实现过程后来【论草莓如何成为冻干莓】给了一个思路和代码如下:pd.toexcel之前把这