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. file新建文件及文件夹

    1.获取包名的根目录:mRootPath = getFilesDir().getParent(); // ====mRootPath===/data/data/com.yoyu.file  获取SD卡 ...

  2. Swift3 今日(TodayExtension)扩展图文笔记

    >图片1(创建今日扩展) >图片2  >图片3(设置大小)  >图片4(绘画控件) >图片5(设置共享文件)  >图片6(设置群组ID) >图片7(设置URL ...

  3. 控制uniFrame显示的一个管理类

    控制uniFrame显示的一个管理类 (2016-03-29 06:41:17) 转载▼ 标签: delphi 分类: uniGUI 利用uniGUI Frame的机制来搭建项目,是非常好的实现方式, ...

  4. hiho 第二周

    Trie树,第一次写,简单的建树+搜索 它的思路hiho上讲得很清楚,good~ #include<iostream> #include<string> using names ...

  5. 使用PerfView监测.NET程序性能（一）：Event Trace for Windows

    前言: 在日常项目开发中,我们时不时会遇到程序占用了很高CPU的情况,可能是程序里某些未经优化的代码或者Bug,或者是程序运行压力太大.无论是什么原因,我们总希望能看到到底是哪个方法占用了如此高的CP ...

  6. ip网段变更

    背景 公司网络跟集团靠拢,先走第一步:IP网段变更.从XX网段切换到OO网段 方法 1. 准备工作 a. 保证IPMI连接正常 b. 获得新IP并核对对应主机名.旧IP是否相符 2. 确认网卡名称 # ...

  7. 剑指offer编程题Java实现——面试题4后的相关题目

    题目描述: 有两个排序的数字A1和A2,内存在A1的末尾有足够多的空余空间容纳A2.请实现一个函数,把A2中的所有数字插入到A1中并且所有的数字是排序的. 还是利用从后向前比较两个数组中的数字的方式来 ...

  8. PHP程序员职业发展路线

    重点:把LNMP搞熟练(核心是安装配置基本操作) 1.Linux: 基本命令.操作.启动.基本服务配置(包括rpm安装文件,各种服务配置等): 会写简单的shell脚本和awk/sed 脚本命令等. ...

  9. JS关闭窗口或JS关闭页面的几种代码！

    第一种:JS定时自动关闭窗口 <script language="javascript"> <!-- function closewin(){ self.open ...

  10. 【hyperscan】编译hyperscan 4.0.0

    ref: http://01org.github.io/hyperscan/dev-reference/getting_started.html 1. 硬件需求 intel x86处理器 64-bit ...