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. JVM可支持的最大线程数

    转微博,因为他也是转载  不知道原出处 一.认识问题: 首先我们通过下面这个 测试程序 来认识这个问题:运行的环境 (有必要说明一下,不同环境会有不同的结果):32位 Windows XP,Sun J ...

  2. 100度享乐电商网 jQuery

    $(function() {// x表示不会的需要注意 //新闻走马灯 x  var num = 0 var len = $(".wrap ul li").length $(&qu ...

  3. 用Html创建简历

    用最基本的html实现简历的创建 代码 <!doctype html> <html> <head><meta charset="utf-8" ...

  4. adb push 和 adb pull命令

    adb push命令 :从电脑上传送文件到手机: adb pull命令 :从手机传送文件到电脑上             @Cocos 下次需要权限的目录可以执行chmod 777 目录名      ...

  5. 获取物料分类excel公式

    物料格式 大类|中类|小类|名称|.......   =MID(D2,FIND("|",D2,FIND("|",D2)+1)+1,FIND("|&qu ...

  6. mysql 唯一索引UNIQUE使用方法详解

    创建唯一索引的目的不是为了提高访问速度,而只是为了避免数据出现重复.唯一索引可以有多个但索引列的值必须唯一,索引列的值允许有空值.如果能确定某个数据列将只包含彼此各不相同的值,在为这个数据列创建索引的 ...

  7. Windows核心编程：第2章 字符和字符串处理

    Github https://github.com/gongluck/Windows-Core-Program.git //第2章 字符和字符串处理.cpp: 定义应用程序的入口点. // #incl ...

  8. ServiceStack 多租户的实现方案

    以SqlServer为例子说明ServiceStack实现多租户,在SqlServer中创建4个Database:TMaster.T1,T2,T3,为了安全起见 每个Database不用sa账号,而是 ...

  9. .Net桌面程序自动更新NAppUpdate

    自动更新介绍 我们做了程序,不免会有版本升级,这就需要程序有自动版本升级的功能.应用程序自动更新是由客户端应用程序自身负责从一个已知服务器下载并安装更新,用户唯一需要进行干预的是决定是否愿意现在或以后 ...

  10. 文本框仅可接收decimal

    文本框html如下: <div><label class="label">价格:</label><input id="TextP ...