谁说 JavaScript 很简单了?
JavaScript系列——数组元素左右移动N位算法实现
14年的面试题,想不到今天在群里有人还问了这个!
call/apply用来改变函数的执行上下文(this),它们的第一个参数thisArg是个对象,即作为函数内的this。
多数时候你传啥函数内就是啥。仅以call示例
function fun() {
alert(this);
}
fun.call(1);
fun.call('a');
fun.call(true);
fun.call({name:'jack'});
分别弹出“1”、“a”、“true”、“[object Object]”。
有两种情况需要注意,传null或undefined时,将是JS执行环境的全局变量。浏览器中是window,其它环境(如node)则是global。
fun.call(null); // window or global
fun.call(undefined); // window or global
这在ECMAScript5.1 15.3.4.4中有解释,如下
严格模式下情况又有所不同,ES3比较宽容尽量去揣测代码意图。ES5严格模式(ie6/7/8/9除外)则不再揣测,给call/apply传入的任何参数不再转换。如下
'use strict'
function fun() {
alert(this);
}
fun.call(null) // null
fun.call(undefined) // undefined
几个面试小题:
1.alert(alert(1)&&alert(2)): 第一个alert执行没返回undefined【alert 是函数,alert(1)相当调用,但没有返回值,所以是undefined】,alert(2) 直接短路掉。
2.alert(1&&2) &&第一个为true,才会执行第二个,如果全部是true返回最后一个值。
3.
多次bind只保留第一次的。
4.
5.
6.自定义事件
var myEvent = new Event('myEvent');
document.addEventListener('myEvent', log, false);
function log() {
console.log('hello event');
}
document.dispatchEvent(myEvent);
7.数组循环移动
需求
假设有这样一个数组
[1,2,3,4,5]
现在想要左移或者右移N位,比如移动1位
//左移1位
[2,3,4,5,1]
//右移1位
[5,1,2,3,4]
算法实现
这样一道题目,你先不要看我下面的代码,自己思考一下如何实现它,不管是复杂的还是简单的方法。
可以先告诉你我用了2行代码实现左、右移动元素。
拆分法
当我们没有具体思路的时候,就先假设数组移动1位的情况。
[1,2,3,4,5]
=>
[null,1,2,3,4] and [5,null,null,null,null]
=>
[5,1,2,3,4]
这里可以看成2个数组,一个是没有到达边界的元素移动[null,1,2,3,4],一个是到达了边界的元素移动[5,null,null,null,null],当元素到达边界,就会往数组的初始位置移动,形成了一个循环的过程。
很明显,如果我们将这2个移动后的数组合并起来,就是需求的结果。
移动2位
同样符合2个移动后的数组合并起来为结果的情况
[1,2,3,4,5]
=>
[null,null,1,2,3] and [4,5,null,null,null]
=>
[4,5,1,2,3]
刚好移动数组长度
[1,2,3,4,5]
=>
[1,2,3,4,5] and [] //如果没有,就假设为空数组
合并数组
假设移动1位的情况
上面的步骤,我们找到了规律,接下来要做的是找到2个数组,需要用到slice截取数组元素。
截取第一个数组
arr.slice(0,-1)
// [1,2,3,4]
截取第二个数组
arr.slice(-1)
// [5]
合并数组
arr.slice(-1).concat(arr.slice(0,-1))
// [5,1,2,3,4]
这样你就实现了移动1位的情况,接着,你继续拿+5和-5范围内的数字进行测试,发现都可以正常移动,当数字大于5或者小于-5的时候,代码就无效了,始终输出[1,2,3,4,5]
arr.slice(-6).concat(arr.slice(0,-6))
// [1,2,3,4,5]
我们再加上一个小技巧,求余数,假设是移动6,那么,实际上和移动1是相同的,我们就可以根据公式求余数
n = n%arr.length
// n = 6%5 余1
同理,当移动-6时
n = n%arr.length
// n = -6%5 余-1
接着带入公式,发现输出全部都正确了!!
思路分析完了,应该很清晰了吧,源码在下面、
算法源码
arr表示原始数组,n表示移动的距离,可以是正数、可以是0、也可以是负数、正数表示右移,负数表示左移,0表示不移动。
function moveElement(arr, n) {
if(Math.abs(n)>arr.length) n = n%arr.length
return arr.slice(-n).concat(arr.slice(0,-n))
}
// moveElement(arr, 9)
// moveElement(arr, 0)
// moveElement(arr, -9)