题目

题目来自 慕课网 JavaScript 深入浅出 1-6 编程练习

请在 index.html 文件中，编写 arraysSimilar 函数，实现判断传入的两个数组是否相似。具体需求：

  1. 数组中的成员类型相同，顺序可以不同。例如 [1, true] 与 [false, 2] 是相似的。
  2. 数组的长度一致。
  3. 类型的判断范围，需要区分: String, Boolean, Number, undefined, null, 函数, 日期, window.

当以上全部满足，则返回“判定结果:通过”，否则返回“判定结果:不通过”。

题目给出了 index.html 如下：

<!DOCTYPE HTML>

<html>

<head>

    <meta http-equiv="Content-Type" content="text/html; charset=gb18030">

    <title>Untitled Document</title>

</head>

<body>

    <script type="text/javascript">

        /*

         * param1 Array

         * param2 Array

         * return true or false

         */

        function arraysSimilar(arr1, arr2){

        }

    </script>

    <script src="testData.js"></script>

</body>

</html>

其中 testData.js 是测试用例，代码如下

var result = function() {

    //以下为多组测试数据

    var cases = [{

        arr1: [1, true, null],

        arr2: [null, false, 100],

        expect: true

    }, {

        arr1: [

            function() {},

            100

        ],

        arr2: [100, {}],

        expect: false

    }, {

        arr1: [null, 999],

        arr2: [{},

            444

        ],

        expect: false

    }, {

        arr1: [window, 1, true, new Date(), "hahaha", (function() {}), undefined],

        arr2: [undefined, (function() {}), "okokok", new Date(), false, 2, window],

        expect: true

    }, {

        arr1: [new Date()],

        arr2: [{}],

        expect: false

    }, {

        arr1: [window],

        arr2: [{}],

        expect: false

    }, {

        arr1: [undefined, 1],

        arr2: [null, 2],

        expect: false

    }, {

        arr1: [new Object, new Object, new Object],

        arr2: [{}, {},

            null

        ],

        expect: false

    }, {

        arr1: null,

        arr2: null,

        expect: false

    }, {

        arr1: [],

        arr2: undefined,

        expect: false

    }, {

        arr1: "abc",

        arr2: "cba",

        expect: false

    }];

    //使用for循环, 通过arraysSimilar函数验证以上数据是否相似，如相似显示“通过”,否则"不通过",所以大家要完成arraysSimilar函数,具体要求，详见任务要求。

    for (var i = 0; i < cases.length; i++) {

        if (arraysSimilar(cases[i].arr1, cases[i].arr2) !== cases[i].expect) {

            document.write("不通过！case" + (i + 1) + "不正确！arr1=" + JSON.stringify(cases[i].arr1) + ", arr2=" + JSON.stringify(cases[i].arr2) + " 的判断结果不是" + cases[i].expect);

            return false;

        }

    }

    return true;

}();

document.write("判定结果:" + (result ? "通过" : "不通过"));

解答

各位读者在看解答前也可以自己考虑一下，看看咱们的想法是否一致，期待您在本文的留言。

思路

通过观察测试用例，可以发现，最后三个用例有不是数组的。所以我们可以先判断传入的参数是否是数组。
又因为题目中要求数组长度必须一致，这也是第二个限制条件。
最后再区分具体的类型。

理清思路我们可以分为以下步骤：

  1. 判断传入的参数是否为数组 (使用 instanceof 方法)
  2. 检查两个数组长度是否一致
  3. 分别判断数组内元素的基本数据类型 (使用 typeof 方法)
  4. 因为 typeof 只能检查基本数据类型，对于 null, Date, window 返回的都是 object，所以使用 Object.prototype.toString.apply() 来检查这些对象类型，其返回值为：'[object Null]', '[object Date]', '[object global]'
  5. 分别比较每个数组内元素的各种类型的个数，如果都相等，那么这两个数组是相似的。

具体实现代码

JavaScript代码如下

/**

 * =====================================================

 * 请在index.html文件中，编写arraysSimilar函数，实现判断传入的两个数组是否相似。具体需求：

 * 1. 数组中的成员类型相同，顺序可以不同。例如[1, true] 与 [false, 2]是相似的。

 * 2. 数组的长度一致。

 * 3. 类型的判断范围，需要区分:String, Boolean, Number, undefined, null, 函数，日期, window.

 *

 * 当以上全部满足，则返回"判定结果:通过"，否则返回"判定结果:不通过"。

 * =====================================================

 */

/*

* param1 Array

* param2 Array

* return true or false

*/

function arraysSimilar(arr1, arr2){

    if (arr1 instanceof Array && arr2 instanceof Array ) {    //先判断传入的是否是数组

        if (arr1.length == arr2.length) {                    //判断数组长度

            console.log("same-length");

            console.log(arr1);

            console.log(arr2);

            //开始判断数组内部是否相似

            return sameLengthArraysSimilar(arr1, arr2);

        } else{

            //两个数组长度不同返回false

            return false;

        }

    } else {

        //传入的参数不是数组返回false

        return false;

    }

}

/**

 * 判断两个等长的数组内部是否相似

 * 遍历数组

 * arr1中元素各种类型出现的个数是否和arr2中元素各种类型出现的个数相同

 * @param  {Array} arr1 数组1

 * @param  {Array} arr2 数组2

 * @return {true,false}

 */

function sameLengthArraysSimilar(arr1,arr2) {

    var numInArr1 = 0;

    var numInArr2大专栏  判断两个数组是否相似 (arraysSimilar)an> = 0;

    var booleanInArr1 = 0;

    var booleanInArr2 = 0;

    var funInArr1 = 0;

    var funInArr2 = 0;

    var undefinedInArr1 = 0;

    var undefinedInArr2 = 0;

    var stringInArr1 = 0;

    var stringInArr2 = 0;

    var nullInArr1 = 0;

    var nullInArr2 = 0;

    var dateInArr1 = 0;

    var dateInArr2 = 0;

    var windowInArr1 = 0;

    var windowInArr2 = 0;

    for (var i = 0; i < arr1.length; i++) {

        if(typeof arr1[i] === 'number' ){

            numInArr1 ++;

        } else if(typeof arr1[i] === 'boolean'){

            booleanInArr1 ++;

        } else if(typeof arr1[i] === 'function'){

            funInArr1 ++;

        } else if(typeof arr1[i] === 'undefined'){

            undefinedInArr1 ++;

        } else if(typeof arr1[i] === 'string'){

            stringInArr1 ++;

        } else if(typeof arr1[i] ==='object'){

            if(Object.prototype.toString.apply(arr1[i]) === '[object Null]'){

                nullInArr1 ++;

            } else if(Object.prototype.toString.apply(arr1[i]) === '[object Date]'){

                dateInArr1 ++;

            } else if(Object.prototype.toString.apply(arr1[i]) === '[object global]'){

                windowInArr1 ++;

            }

        }

        if(typeof arr2[i] === 'number'){

            numInArr2 ++;

        } else if(typeof arr2[i] === 'boolean'){

            booleanInArr2 ++;

        } else if(typeof arr2[i] === 'function'){

            funInArr2 ++;

        } else if(typeof arr2[i] === 'undefined'){

            undefinedInArr2 ++;

        } else if(typeof arr2[i] === 'string'){

            stringInArr2 ++;

        } else if(typeof arr2[i] ==='object'){

            if(Object.prototype.toString.apply(arr2[i]) === '[object Null]'){

                nullInArr2 ++;

            } else if(Object.prototype.toString.apply(arr2[i]) === '[object Date]'){

                dateInArr2 ++;

            } else if(Object.prototype.toString.apply(arr2[i]) === '[object global]'){

                windowInArr2 ++;

            }

        }

    }

    console.log("num---"+numInArr1);

    console.log("num---"+numInArr2);

    console.log("boo---"+booleanInArr1);

    console.log("boo---"+booleanInArr2);

    console.log("null---"+nullInArr1);

    console.log("null---"+nullInArr2);

    console.log("window---"+windowInArr1);

    console.log("window---"+windowInArr2);

    console.log("date---"+dateInArr1);

    console.log("date---"+dateInArr2);

    console.log("string---"+stringInArr1);

    console.log("string---"+stringInArr2);

    console.log("fun---"+funInArr1);

    console.log("fun---"+funInArr2);

    console.log("undefined---"+undefinedInArr1);

    console.log("undefined---"+undefinedInArr2);

    if(numInArr1 == numInArr2 && booleanInArr1==booleanInArr2 && funInArr1==funInArr2 && undefinedInArr1==undefinedInArr2 && stringInArr1==stringInArr2 && nullInArr1==nullInArr2 && dateInArr1==dateInArr2 && windowInArr1==windowInArr2){

        console.log('================================true');

        return true;

    }else{

        console.log('================================false');

        return false;

    }

}

总结

  • 上述代码完美的跑完所有的测试用例，读者 点击这里查看结果，并且可以按 f12 看 Console 信息， 里面有代码的执行过程。
  • 当然你也可以复制本文的 JavaScript 代码，在 慕课网的习题 下跑一下，也可以看到 判定结果:通过 的结果
  • 完整源代码在我的 GitHub javascript-test/arraysSimilar/ 仓库中
  • 其实我的代码逻辑并不复杂，有点空间换时间的感觉，执行效率应该是较高的。没有用 JavaScript 封装的任何函数，完全是自己写的。其实代码除去 console.log() 也并没有多少行。
  • 各位读者有什么好的想法欢迎留言交流！

判断两个数组是否相似 (arraysSimilar)的更多相关文章

  1. js中的传值和传引用,判断两个数组是否相等

    所谓js的中的传值,其实也就是说5种基本数据类型(null,undefind,boolean,number,string) 传引用也就是说的那个引用数据类型,(array和objec) 基本数据类型的 ...

  2. php判断两个数组是否相等

    php判断两个数组是否相等 一.总结 一句话总结: php判断两个数组是否相等可以直接上==或者===号 二.php 判断两个数组是否相等 转自或参考:php 判断两个数组是否相等https://ww ...

  3. JS判断两个数组的元素是否完全相等

    1.使用ES6 新增的扩展运算符和Set新数据类型判断两个数组是否包含有相同的元素 var arr1 = ['green' , 'yellow' ,'blue' ,'red']; var arr2 = ...

  4. 利用哈希map快速判断两个数组的交集

    在大多数情况,也就是一般的情况下,大家都能想出最暴力的解法,通常也就是采用遍历或者枚举的办法来解决问题. 该题需要找出两个数组的交集,最简单的一个办法就是用A数组里面的所有数去匹配B数组里面的数.假设 ...

  5. JS深度判断两个数组对象字段相同

    /** * 判断此对象是否是Object类型 * @param {Object} obj */ function isObject(obj){ return Object.prototype.toSt ...

  6. C#如何判断两个数组相等

    /// <summary> /// 数组比较是否相等 /// </summary> /// <param name="bt1">数组1</ ...

  7. Javascript 判断传入的两个数组是否相似

    任务描述: 请在index.html文件中,编写arraysSimilar函数,实现判断传入的两个数组是否相似.具体需求: 1. 数组中的成员类型相同,顺序可以不同.例如[1, true] 与 [fa ...

  8. NX二次开发-算法篇-判断找到两个数组里不相同的对象

    NX9+VS2012 #include <uf.h> #include <uf_curve.h> #include <uf_modl.h> #include < ...

  9. javascript 简单实现对两个数组相似度的检验

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

随机推荐

  1. Java学习笔记--精品札记

    forech循环增强版(JDK1.7新特性) for(数组单位元素类型 i:遍历目标数组){ 代码块 } char(只能放单个字符)数组可以直接遍历不需要循环,其他数组不可以,必须遍历 toStrin ...

  2. （一）ORBSLAM2主要配置

    (1)ORBSLAM2文件夹里面有个build.sh文件,里面主要是编译时终端需要执行的命令,这里把它们放到.sh文件中统一执行. (2)阅读ORBSLAM2的CmakeList可以知道运行ORBSL ...

  3. LeetCode——787. K 站中转内最便宜的航班

    有 n 个城市通过 m 个航班连接.每个航班都从城市 u 开始,以价格 w 抵达 v. 现在给定所有的城市和航班,以及出发城市 src 和目的地 dst,你的任务是找到从 src 到 dst 最多经过 ...

  4. oracle 学习（四）游标

    显式游标 隐式游标:如果在PL/SQL程序段中使用SELECT语句进行操作,PL/SQL 会隐含的处理游标定义,即为隐式游标.这种游标不需要像显式那样声明,也不必打开关闭. CREATE OR REP ...

  5. Maven--远程仓库的认证

    大部分远程仓库无须认证就可以访问,但有时候出于安全方面的考虑,我们需要提供认证信息才能访问一些远程仓库. 配置认证信息和配置仓库信息不同,仓库信息可以直接配置在 POM 文件中,但是认证信息必须配置在 ...

  6. python3.6内置模块——random详解

    python内置模块random是用来生成随机数的,在许多场合都能应用到,算是比较常见的一种模块吧,下面详细介绍其具体用法. 基本用法 随机生成浮点数:有两种,一种没有参数,默认是0~1,另一种可以指 ...

  7. java 里没有友元函数怎么办

    我希望一个service可以访问某个对象中的私有对象,但是不希望这个私有对象暴露给其它的service. public xxxServiceImpl{ public void do(){ xxxent ...

  8. 如何选字体（font-family）

    一.默认字体情况 1.Window下: 宋体(SimSun):Win下大部分游览器的默认字体,宋体在小字号下(如12px.14px)的显示效果还可以接受,但是字号一大就非常糟糕了,所以使用的时候要注意 ...

  9. vue打包成app后，点击手机上的物理返回按钮后直接退出app

    在浏览器上浏览vue项目时,后退按钮是可以正常返回上一页的,但是打包成app后,点击手机上的屋里返回按钮,就直接退出app回到桌面了, 以下是解决办法: 使用mui进行手机的物理键的监听 1.首先安装 ...

  10. HTTP1.0和HTTP1.1的一些区别

    HTTP1.0和HTTP1.1的一些区别 HTTP1.0最早在网页中使用是在1996年,那个时候只是使用一些较为简单的网页上和网络请求上,而HTTP1.1则在1999年才开始广泛应用于现在的各大浏览器 ...