来挑战下你的js基本功,原来以前认为的基础扎实都是空中楼阁。由Array.from引申的知识点。包括数组排序,call,apply,bind。等等。

以前看过一句话基础的不一定简单,一直没体会到,今天终于见识到了。反思了下自己之前的工作学习,一句话总结,很浮躁。不多说,来个小的例子挑战下。
Array.from()。对你没看错,就是这个简单的api,用来将有length属性的数据结构转换为数组,在转换之前可以使用map对每一个生成的值做处理。看到这里你可能一略而过,很简单吗?不就是转换吗?
那么接下来我来引申几个问题。
问题1:Array.from()的这个api兼容性如何?你会看到ie不兼容。如果你想用怎么办?看看polyfill实现吧。然后polyfill的实现是怎样的过程呐?思路是怎样的?里边又有哪些细节需要你注意呐?我总结下来的有
           1:判断数据类型,我们看Array.from(param,fnc,thisArg)。我们自己来写,我们是不是得首先判断fnc是不是一个函数呐?用到了什么呐?对object.prototype.call(fnc) === "[object,Function]";那么这时候又有问题了如果我要判断所有的数据类型呐?

   2:使用call。我们传入的fnc。如何给她传递进去当前循环的item,index,arr,并且改变fnc中的this为thisArg,这时候用到了call。call不了解?可能你去看下call,发现还有apply,bind。是不是得对比下。然后再看看兼容性?是不是会引申其他问题?

问题2:Array.from能解决我们实际编程中什么问题呐?基础的将各种带有length属性的类型数据变为数组。这些类型包括哪些呐?set,map,arguments,nodeList, string,甚至{length: 5}。复杂的实现数组合并去重。怎样去重呐?

function combine(){
    let arr = [].concat.apply([], arguments);  //没有去重复的新数组
    return Array.from(new Set(arr));
} 

var m = [1, 2, 2], n = [2,3,3];
console.log(combine(m,n)); 

这是es6中的去重的简单实现。那么我们要考虑他的性能问题了,时间复杂度,空间复杂度。还有哪些实现去重的方法呐?你是不是得总结下。权衡下执行需要的时间和空间,选择合适的去重方法。
比如,利用一个新数组,或者一个新的对象,依次把每个元素加入到对应的新数组,新对象中。然后判断indexOf(item) != -1加入。!obj[item] 。也可以利用filter。forEach.同样通过indexOf实现。
还有一种靠源生实现的。基本的想法是,判断当前一个和下一个,如果重复了,那么忽略这个元素,取下一个元素,如果没有重复的那么添加到我们创建的新数组。show code

function qc(arr) {
if (object.prototype.toString(arr) != ‘[object, Array]‘) {
    throw newError(‘the qc need Array‘)
}
var newArr = []
    for(let i=0,len=arr.length;i<len;i++){
      for(let j=i+1;j<len;j++){
           // 如果重复,则i向前推进,但不管重复项
            if(arr[i]==arr[j]) j= ++i
        }
        // 将没有重复项的推入到新数组
        newArr.push(arr[i])
    }
    return newArr

}

原文地址:https://www.cnblogs.com/hjdjs/p/9172429.html

时间: 2024-10-26 00:48:07

来挑战下你的js基本功,原来以前认为的基础扎实都是空中楼阁。由Array.from引申的知识点。包括数组排序,call,apply,bind。等等。的相关文章

又到圣诞节,让你的网页下起雪(js特效)

又到圣诞节,让你的网页下起雪(js特效) 在4年多前,我写过一个特效,就是让你的网页下起雨,它的效果就是在你打开的网站,雨点下满你的屏幕,恩,大概效果如下图: 当然这个效果还有一些附带项,比如风速.风向.雨速.雨量,这些后来发现又变成一个不单纯的东西了,所以又隐藏了,那个时候还没有现在这么流行h5和css3,所以效果会硬一点,只作一个普通的分享. 然后四年前的今天,我又写了一个让网页下起雪来的效果,它会让你的网页飘起一个个的雪花,正适合今天这个圣诞的节日,所以就拿出来献下丑,它的效果图如下: 最

mac下配置Node.js开发环境、express安装、创建项目

mac下配置Node.js开发环境.express安装.创建项目 一.node.js的安装 去官网下载对应的平台版本就可以了,https://nodejs.org 二.express安装 sudo npm install -g express 进行全局安装. 这时有可能会安装不成功,用下面的命令即可 sudo npm install express-generator -g 三.创建项目 终端输入 express -e 你的项目名称 -e 为使用ejs框架 express默认为jade,为了 学

IE下使用excanvas.js之后动态创建的canvas不支持getContext的解决方法(转)

IE下使用excanvas.js之后动态创建的canvas不支持getContext的解决方法(转) IE下使用excanvas.js之后,动态创建的canvas不支持getContext的解决方法 引入excanvas.js以后,在ie下,文档中的canvas就可以用了,但是如果是通过createElement方法创建的就不行了 var canvas=document.createElement(”canvas”); if(canvas.getContext){ alert(”support

OpenWrt下交叉编译Node.js(HG255D)

操作系统:deepin linux 2013 或 ubuntu 13.04 1.安装交叉编译前,需要安装的包 sudo apt-get install build-essential subversion git-core libncurses5-dev zlib1g-dev gawk flex quilt xsltproc 2.下载OpenWrt的源代码 git clone git://git.openwrt.org/openwrt.git cd openwrt ./scripts/feeds

Vue框架下的node.js安装教程

Vue框架下的node.js安装教程 python服务器.php  ->aphche.java ->tomcat.   iis -->它是一个可以运行JAVASCRIPTR 的运行环境 -->它可以作为后端语言(websocket \ ) --强大的包管理工具npm,可以使用它安装插件 -->VUE框架是基于node.js平台运行的 --->它是基于chrome浏览器的V8引擎,运行速度快,性能高效 安装淘宝镜像:npm install cnpm -g --regist

在window下搭建Vue.Js开发环境(转)

nodejs官网http://nodejs.cn/下载安装包,无特殊要求可本地傻瓜式安装,这里选择2017-5-2发布的 v6.10.3 cmd命令行: node -v //显示node版本 v6.10.3 npm -v  //显示npm包管理器版本 3.10.10 由于有些npm有些资源被屏蔽或者是国外资源的原因,经常会导致用npm安装依赖包的时候失败,所有我还需要npm的国内镜像---cnpm Cmd命令行中输入npm install -g cnpm --registry=http://re

Windows 下安装 Node.js

搭建博客系列的 Node.js 环境安装.Windows 下面安装可以通过图形化界面进行安装,非常方面. 1.打开 Node.js 官网,下载对应版本的安装包(msi 后缀的) 2.双击运行下载的程序,点击 next 下一步,然后勾选同意安装协议,安装路径修改成之前建立好的 Tools 文件夹下,或者其它目录,也可以使用默认路径. 3.自定安装,这里我们选择默认就可以了. 4.点击 install 按钮进行安装,等待一下,出现 Finish 按钮,点击完成安装. 5.安装完成之后,我们打开命令行

【win7下安装node.js错误:roling back action】与【&quot;grunt&quot; 不是内部或外部命令】 解决方法

[win7下安装node.js错误:roling back action] 解决方法: Node.js 服务器端的JavaScript Node.js 是一个基于Chrome JavaScript 运行时建立的一个平台, 用来方便地搭建快速的 易于扩展的网络应用· Node.js 借助事件驱动, 非阻塞I/O 模型变得轻量和高效, 非常适合 运行在分布式设备 的 数据密集型 的实时应用 本文为大家讲解的是在win7下安装node.js到最后时出现回滚,安装失败的解决方法,感兴趣的同学参考下. 问

在linux环境下安装Node.JS

在linux环境下安装Node.JS 1.确定自己linux操作系统的位数 uname -a 2.选择合适版本的node.js 3.上传服务器并解压 解压上传的nodejs文件 tar -xvf node-v8.12.0-linux-x64.tar.xz mv node-v8.12.0-linux-x64 nodejs 4.建立软连接 ln -s /usr/local/software/nodejs/node-v8.12.0-linux-x64/npm /usr/local/bin/ ln -s