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. SystemProperties.get/set property_get/set

    在java层设置系统属性要注意几点: 1 需要有系统权限.可以在AndroidManifest.xml添加android:sharedUserId="android.uid.system&q ...

  2. hdu 4455 Substrings(计数）

    题目链接:hdu 4455 Substrings 题目大意:给出n,然后是n个数a[1] ~ a[n], 然后是q次询问,每次询问给出w, 将数列a[i]分成若干个连续且元素数量为w的集合,计算每个集 ...

  3. sed，grep，进阶+source+export+环境变量

    三剑客之sed 概括流程:从文件或管道中,可迭代读取. 命令格式: sed(软件) 选项 sed命令 输入文件 增 两个sed命令: a: 追加文本到指定行后 i: 插入到指定行前 sed -i '1 ...

  4. golang 本地构建包

    说点废话 为小胖做一个温馨提示的功能,思路已经整理好.今天使用goquery的时候,发现已经修改了.其中需要一个golang.org/x/net/html这个包,但是官网已经被万恶的GFW给墙了.这里 ...

  5. 聊聊如何设计千万级吞吐量的.Net Core网络通信！

    聊聊如何设计千万级吞吐量的.Net Core网络通信! 作者:大石头 时间:2018-10-26 晚上 20:00 地点:QQ群-1600800 内容:网络通信, 网络库使用方式 网络库设计理念,高性 ...

  6. 通过JS拦截 pushState 和 replaceState 事件

    history.pushState 和 history.replaceState 可以在不刷新当前页面的情况下更改URL,但是这样就无法获取通过AJAX得到的新页面的内容了.虽然各种HTML5文档说  ...

  7. google breakpad for linux(2)

    breakpad 是什么 breakpad 是一个包含了一系列库文件和工具的开源工具包,使用它可以帮助我们在程序崩溃后进行一系列的后续处理,如现场的保存(core dump),及事后分析(重建 cal ...

  8. Linux的1000个命令

    目录 Linux常用命令 uptime wget uname free who last history pwd cd ls cat head tail tr wc cut diff touch mk ...

  9. Swift5 语言参考(十) 语法汇总

    词法结构 GRAMMAR OF WHITESPACE whitespace → whitespace-item whitespace opt whitespace-item → line-break ...

  10. 10-05 Java 内部类概述和讲解

    内部类的概述 /* 内部类概述: 把类定义在其他类的内部,这个类就被称为内部类. 举例:在类A中定义了一个类B,类B就是内部类. 内部的访问特点: A:内部类可以直接访问外部类的成员,包括私有. B: ...