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"));//

        console.log("arr6.lastIndexOf(\"a2\"): " + arr6.lastIndexOf("a2"));//

        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

JavaScript回调函数及数组方法测试的更多相关文章

  1. JavaScript回调函数的实现

    https://github.com/forsigner/blog/blob/master/source/_posts/javascript-callback.md 在JavaScript中,回调函数 ...

  2. 【JavaScript】JavaScript回调函数

    什么是Javascript 回调函数? 函数和其他数据一样可以被赋值,删除,拷贝等,所以也可以把函数作为参数传入到另一个函数中. 这个函数就是所谓的回调函数   举例: //不带参数的case fun ...

  3. 理解 JavaScript 回调函数并使用

    JavaScript中,函数是一等(first-class)对象:也就是说,函数是 Object 类型并且可以像其他一等对象(String,Array,Number等)一样使用.它们可以"保 ...

  4. 理解javascript 回调函数

    ##回调函数定义 百度百科:回调函数 回调函数就是一个通过函数指针调用的函数.如果你把函数的指针(地址)作为参数传递给另一个函数,当这个指针被用为调用它所指向的函数时,我们就说这是回调函数.回调函数不 ...

  5. ES5新增数组方法测试和字符串常见API测试

    首先是ES5新增数组方法测试: <!DOCTYPE html><html lang="en"><head> <meta charset=& ...

  6. 如何定义 Java 的回调函数，与 JavaScript 回调函数的区别

    JavaScript 中的回调函数 在 JavaScript 中经常使用回调函数,比如:get 请求.post 请求等异步任务.在我们请求之前以及请求之后,都需要完成一些固定的操作,比如:请求之前先从 ...

  7. 回调函数及数组中sort()方法实现排序的原理

    1.回调函数:把一个方法A当一个参数值传递到另外一个函数B中,在B执行的过程当中我们随时根据需求让A方法执行:   什么是回调 :它是异步编程基本的方法,需要异步处理的时候一般采用后续传递的方式,将后 ...

  8. javascript 原生常用api 数组方法大全

     <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  9. javascript 回调函数应用

    回调函数是什么在学习之前还真不知道js回调函数怎么使用及作用了,下面本文章把我在学习回调函数例子给各位同学介绍一下吧,有需了解的同学不防进入参考. 回调函数原理: 我现在出发,到了通知你”这是一个异步 ...

随机推荐

  1. Spring中ApplicationEvent和ApplicationListener封装

    1.测试程序EventTest.java,发布一个事件只需要调用FrameEventHolder.publishEvent()方法即可. package com.junge.spring.event; ...

  2. iOS_URI跳转方式多种地图导航的代码实践

    先来看一下我们要达到什么效果,就是当我们点导航的时候,会弹出下面这个选择列表. 当然,如果没有安装某个地图APP,那么对应的选项是不会出现的.检测APP是否安装,只要调用下面这个方法就可以了 [[UI ...

  3. Linux下SVN配置hook经验总结

    前几天给实验室搭建了一个内部测试的开发环境,LAMP.svn提交以及自动部署. 之前没干过这事儿,到最终搞定还是颇费了些周折.总结一下我的经验,主要是hook的自动执行问题. 拿我的post-comm ...

  4. .NetCore 发布到 Centos docker

    [搭建环境] 系统:CentOS 7.0    容器:Docker 1.13.1    .Net Core 版本:.NET Core 2.2     工具:putty.filezilla 等. 一.安 ...

  5. windform 重绘Treeview "+-"号图标

    模仿wind系统界面,重绘Treeview + - 号图标 一,首先需要图片 ,用于替换原有的 +-号 二.新建Tree扩展类 TreeViewEx继承TreeView using System; u ...

  6. [宁波集训]0827Day1

    1.\(CF771D\ Bear\ and\ Company\)(原题,比赛时改为多组数据) 一道毒瘤\(dp\)题,\(dp[i][j][k][0/1]\)表示有\(i\)个\(V\),有\(j\) ...

  7. FunDA（17）－ 示范：异常处理与事后处理 - Exceptions handling and Finalizers

    作为一个能安全运行的工具库,为了保证占用资源的安全性,对异常处理(exception handling)和事后处理(final clean-up)的支持是不可或缺的.FunDA的数据流FDAPipeL ...

  8. Freemarker实例教程

    原创作品,允许转载,转载时请务必以超链接形式标明文章 原始出处 .作者信息和本人声明.否则将追究法律责任.作者:永恒の_☆ 地址:http://blog.csdn.net/chenghui0317/a ...

  9. new关键字创建对象带不带{}的区别

    gson通过TypeToken实现了对泛型数据的支持,使用方式如下: gson.fromJson([待转化的字符串], new TypeToken<[目标类]<目标类中的泛型>> ...

  10. python -猜字小游戏

    代码运行效果如下: 注意: 1.必须要在python3环境想使用 2.QQ:3084276329(一起交流学习) 3.还请大家评论 Guess the word game代码如下: #! /usr/b ...