资讯专栏INFORMATION COLUMN

JS能力测评经典题

zhangke3016 / 3840人阅读

每道题都写多种解法,开阔思路。一共45道题。
因为牛客网oj不支持ES6语法,所以大多数写法只给出传统写法。

</>复制代码

  1. 题目描述
    找出元素 item 在给定数组 arr 中的位置

输出描述:
如果数组中存在 item,则返回元素在数组中的位置,否则返回 -1
输入例子:
indexOf([ 1, 2, 3, 4 ], 3)
输出例子:
2

</>复制代码

  1. // 一般写法
  2. function indexOf(arr, item) {
  3. for (var i = 0; i < arr.length; ++i) {
  4. if (item === arr[i]) {
  5. return i;
  6. }
  7. }
  8. return -1;
  9. }
  10. // 简单粗暴版(因为js自带的indexOf函数功能已经实现了)
  11. function indexOf(arr, item) {
  12. return arr.indexOf(item);
  13. }
  14. // 每次比较后都将数组首元素去掉,同时计数器加1,直到找到元素item
  15. function indexOf(arr, item) {
  16. var count = 0, len = arr.length;
  17. while (arr.length !== 0 && arr[0] !== item) {
  18. arr.shift();
  19. count++;
  20. }
  21. return count === len ? -1 : count;
  22. }
  23. // 较复杂的写法(不建议使用)
  24. function indexOf(arr, item) {
  25. var pos = arr.map(function(e, index) {
  26. return e === item ? index: -1;
  27. }).filter(function(e) {
  28. return e !== -1;
  29. });
  30. return pos.length === 0 ? -1 : pos[0];
  31. }
  32. // forEach加try-catch语句(不建议使用)
  33. function indexOf(arr, item) {
  34. try {
  35. arr.forEach((e, i) => {
  36. if (e === item) {
  37. throw new Error(i);
  38. }
  39. } catch (err) {
  40. return err.message;
  41. }
  42. return -1;
  43. }
  44. }

</>复制代码

  1. 题目描述

计算给定数组 arr 中所有元素的总和
输入描述:
数组中的元素均为 Number 类型
输入例子:
sum([ 1, 2, 3, 4 ])
输出例子:
10

</>复制代码

  1. // 一般写法
  2. function sum(arr) {
  3. var sum = 0;
  4. for (var i = 0; i < arr.length; ++i) {
  5. sum += arr[i];
  6. }
  7. return sum;
  8. }
  9. // 使用reduce,且将sum初始化为0
  10. function sum(arr) {
  11. return arr.reduce(function(sum, e) {
  12. return sum + e;
  13. }, 0);
  14. }
  15. // ES6写法,且将reduce中传的0省略,则sum在这里相当于初始化为arr的首元素
  16. //【第一个sum为函数名,其余为函数内变量名】
  17. const sum = (arr) => arr.reduce((sum, e) => sum + e);

</>复制代码

  1. 题目描述

移除数组 arr 中的所有值与 item 相等的元素。不要直接修改数组 arr,结果返回新的数组
输入例子:
remove([1, 2, 3, 4, 2], 2)
输出例子:
[1, 3, 4]

</>复制代码

  1. // 一般写法
  2. function remove(arr, item) {
  3. var tempArr = [];
  4. for (var i = 0; i < arr.length; ++i) {
  5. tempArr.push(arr[i]);
  6. }
  7. /* 对arr的拷贝可使用一个技巧,即 tempArr = arr.slice(0);
  8. 以后均采用这种写法*/
  9. var index = tempArr.indexOf(item);
  10. while (index !== -1) {
  11. tempArr.splice(index, 1); // 每次删一个元素
  12. index = tempArr.indexOf(item);
  13. }
  14. return tempArr;
  15. }
  16. // 使用filter
  17. function remove(arr, item) {
  18. return arr.filter(function(e) {
  19. return e !== item;
  20. });
  21. };
  22. // ES6写法
  23. const remove = (arr, item) => arr.filter((e) => e !== item);

</>复制代码

  1. 移除数组 arr 中的所有值与 item 相等的元素,直接在给定的 arr 数组上进行操作,并将结果返回

输入例子:
removeWithoutCopy([1, 2, 2, 3, 4, 2, 2], 2)
输出例子:
[1, 3, 4]

</>复制代码

  1. // 一般写法
  2. function removeWithoutCopy(arr, item) {
  3. for (var i = 0; i < arr.length; ++i) {
  4. if (arr[i] === item) {
  5. arr.splice(i, 1);
  6. i--;
  7. };
  8. };
  9. return arr;
  10. }
  11. // 类似地
  12. function removeWithoutCopy(arr, item) {
  13. var index = arr.indexOf(item);
  14. while (index !== -1) {
  15. arr.splice(index, 1);
  16. index = arr.indexOf(item);
  17. }
  18. return arr;
  19. }
  20. /* 因为filter会改变不修改数组本身,会返回一个新数组,所以此处不采用 */

</>复制代码

  1. 题目描述

在数组 arr 末尾添加元素 item。不要直接修改数组 arr,结果返回新的数组
输入例子:
append([1, 2, 3, 4], 10)
输出例子:
[1, 2, 3, 4, 10]

</>复制代码

  1. function append(arr, item) {
  2. var tempArr = arr.slice(0);
  3. tempArr.push(item);
  4. return tempArr;
  5. }

</>复制代码

  1. 题目描述

删除数组 arr 最后一个元素。不要直接修改数组 arr,结果返回新的数组
输入例子:
truncate([1, 2, 3, 4])
输出例子:
[1, 2, 3]

</>复制代码

  1. // 一般写法
  2. function truncate(arr) {
  3. var tempArr = arr.slice(0);
  4. tempArr.splice(arr.length - 1);
  5. return tempArr;
  6. }
  7. // 使用pop
  8. function truncate(arr) {
  9. var tempArr = arr.slice(0);
  10. tempArr.pop();
  11. return tempArr;
  12. }

</>复制代码

  1. 题目描述

在数组 arr 开头添加元素 item。不要直接修改数组 arr,结果返回新的数组
输入例子:
prepend([1, 2, 3, 4], 10)
输出例子:
[10, 1, 2, 3, 4]

</>复制代码

  1. // 使用splice添加元素
  2. function prepend(arr, item) {
  3. var tempArr = arr.slice(0);
  4. tempArr.splice(0, 0, item);
  5. return tempArr;
  6. }
  7. // 直接使用unshift添加首元素方法
  8. function prepend(arr, item) {
  9. var tempArr = arr.slice(0);
  10. tempArr.unshift(item);
  11. return tempArr;
  12. }

</>复制代码

  1. 题目描述

删除数组 arr 第一个元素。不要直接修改数组 arr,结果返回新的数组
输入例子:
curtail([1, 2, 3, 4])
输出例子:
[2, 3, 4]

</>复制代码

  1. // 使用splice删除元素
  2. function curtail(arr) {
  3. var tempArr = arr.slice();
  4. tempArr.splice(0, 1);
  5. return tempArr;
  6. }
  7. // 直接使用shift删除首元素方法
  8. function curtail(arr) {
  9. var tempArr = arr.slice();
  10. tempArr.shift();
  11. return tempArr;
  12. }

</>复制代码

  1. 题目描述

合并数组 arr1 和数组 arr2。不要直接修改数组 arr,结果返回新的数组
输入例子:
concat([1, 2, 3, 4], ["a", "b", "c", 1])
输出例子:
[1, 2, 3, 4, "a", "b", "c", 1]

</>复制代码

  1. // 简单粗暴版,js已实现此函数功能
  2. function concat(arr1, arr2) {
  3. var tempArr = arr1.slice(0);
  4. return tempArr.concat(arr2);
  5. }
  6. // 直接将arr2中的元素一个个push
  7. function concat(arr1, arr2) {
  8. var tempArr = arr1.slice(0);
  9. arr2.forEach(function(e) {
  10. tempArr.push(e);
  11. });
  12. return tempArr;
  13. }
  14. // 简化版,使用apply
  15. function concat(arr1, arr2) {
  16. var tempArr = arr1.slice(0);
  17. [].push.apply(tempArr, arr2); // 简写版,可替换成下面一行,数组原型方法
  18. /* Array.prototype.push.apply(tempArr, arr2); */
  19. return tempArr;
  20. }

</>复制代码

  1. 题目描述

在数组 arr 的 index 处添加元素 item。不要直接修改数组 arr,结果返回新的数组
输入例子:
insert([1, 2, 3, 4], "z", 2)
输出例子:
[1, 2, "z", 3, 4]

</>复制代码

  1. // 使用splice添加元素
  2. function insert(arr, item, index) {
  3. var tempArr = arr.slice(0);
  4. tempArr.splice(index, 0, item);
  5. return tempArr;
  6. }

</>复制代码

  1. 题目描述

统计数组 arr 中值等于 item 的元素出现的次数
输入例子:
count([1, 2, 4, 4, 3, 4, 3], 4)
输出例子:
3

</>复制代码

  1. // 一般写法
  2. function count(arr, item) {
  3. var count = 0;
  4. arr.forEach(function(e) {
  5. e === item ? count++ : 0;
  6. });
  7. return count;
  8. }
  9. // 使用ES6的for...of循环
  10. function count(arr, item) {
  11. let cnt = 0;
  12. for (let e of arr) {
  13. e === item ? cnt++ : 0;
  14. }
  15. return cnt;
  16. }
  17. // 使用reduce,归约写法
  18. function count(arr, item) {
  19. return arr.reduce(function(cnt, e) {
  20. return cnt + (e === item ? 1 : 0);
  21. }, 0);
  22. }
  23. // 使用ES6箭头函数
  24. const count = (arr, item) =>
  25. arr.reduce((cnt, e) =>
  26. cnt + (e === item ? 1 : 0), 0);
  27. // 使用filter,返回一个新数组,其长度即为所求
  28. const count = (arr, item) => arr.filter(e => e === item).length;

</>复制代码

  1. 题目描述
    找出数组 arr 中重复出现过的元素

输入例子:
duplicates([1, 2, 4, 4, 3, 3, 1, 5, 3]).sort()
输出例子:
[1, 3, 4]

关于indexOf与lastIndexOf的文档

</>复制代码

  1. // 一般写法,排序之后判断相邻元素是否相等
  2. function duplicates(arr) {
  3. var sortedArr = arr.sort();
  4. var tempArr = [];
  5. for (var i = 0; i < sortedArr.length; ++i) {
  6. if (sortedArr[i] === sortedArr[i + 1] &&
  7. tempArr.indexOf(sortedArr[i]) === -1) {
  8. tempArr.push(sortedArr[i]);
  9. }
  10. }
  11. return tempArr;
  12. }
  13. // indexOf和lastIndexOf的妙用
  14. function duplicates(arr) {
  15. var tempArr = [];
  16. arr.forEach(function(e) {
  17. if (arr.indexOf(e) !== arr.lastIndexOf(e) &&
  18. tempArr.indexOf(e) === -1) {
  19. tempArr.push(e);
  20. }
  21. });
  22. return tempArr;
  23. }
  24. // 使用reduce
  25. function duplicates(arr) {
  26. var tempArr = [];
  27. arr.forEach(function(e) {
  28. tempArr[e] = (tempArr[e] === undefined ? 1 : tempArr[e] + 1);
  29. /* 计算每个元素出现次数 */
  30. });
  31. return tempArr.reduce(function(ret, e, item) {
  32. if (e && e !== 1 && ret.indexOf(item) === -1) {
  33. ret.push(item);
  34. /* 当元素存在,且出现次数不为1,且未push进ret中时... */
  35. }
  36. return ret;
  37. }, []);
  38. }

</>复制代码

  1. 题目描述

为数组 arr 中的每个元素求二次方。不要直接修改数组 arr,结果返回新的数组
输入例子:
square([1, 2, 3, 4])
输出例子:
[1, 4, 9, 16]

</>复制代码

  1. // 一般写法
  2. function square(arr) {
  3. var tempArr = [];
  4. arr.forEach(function(e) {
  5. tempArr.push(e * e);
  6. });
  7. return tempArr;
  8. }
  9. // 使用map
  10. function square(arr) {
  11. return arr.map(function(e) {
  12. return e * e;
  13. })
  14. }
  15. // ES6箭头函数版
  16. const square = arr => arr.map(e => e * e);

</>复制代码

  1. 题目描述

在数组 arr 中,查找值与 item 相等的元素出现的所有位置
输入例子:
findAllOccurrences("abcdefabc".split(""), "a").sort()
输出例子:
[0, 6]

</>复制代码

  1. // 一般写法(类C,不推荐)
  2. function findAllOccurrences(arr, item) {
  3. var tempArr = [];
  4. for (var i = 0; i < arr.length; i++){
  5. if (arr[i] === item) {
  6. tempArr.push(i);
  7. }
  8. }
  9. return tempArr;
  10. }
  11. // 改进版
  12. function findAllOccurrences(arr, item) {
  13. var tempArr = [];
  14. arr.forEach(function(e, index) {
  15. e !== item || tempArr.push(index);
  16. });
  17. return tempArr;
  18. }
  19. // 使用map和filter
  20. function findAllOccurrences(arr, item) {
  21. return arr.map(function(ele, index) {
  22. return ele === item ? index : -1;
  23. /* 样例返回结果为[ -1, -1, -1, -1, -1, -1, -1, 0, 6 ] */
  24. }).filter(function(e) {
  25. return e !== -1;
  26. /* 过滤掉 e === -1 的情况 */
  27. })
  28. }
  29. // ES6箭头函数版
  30. const findAllOccurrences = (arr, item) =>
  31. arr.map((ele, index) => ele === item ? index : -1).filter(e => e !== -1);

</>复制代码

  1. 题目描述

给定的 js 代码中存在全局变量,请修复

</>复制代码

  1. function globals() {
  2. myObject = {
  3. name : "Jory"
  4. };
  5. return myObject;
  6. }

</>复制代码

  1. /* 在JavaScript中,如果不使用var声明变量,则该变量被视为全局变量。*/
  2. // 直接加var (在ES6标准中,最好替换成const或let)
  3. function globals() {
  4. var myObject = {
  5. name : "Jory"
  6. };
  7. return myObject;
  8. }
  9. // 把对象归属改为原型
  10. function globals() {
  11. globals.prototype.myObject = {
  12. name : "Jory"
  13. };
  14. return globals;
  15. }
  16. // 把对象改为匿名的
  17. function globals() {
  18. return { name : "Jory" };
  19. }

</>复制代码

  1. 题目描述

请修复给定的 js 代码中,函数定义存在的问题

</>复制代码

  1. function functions(flag) {
  2. if (flag) {
  3. function getValue() { return "a"; }
  4. } else {
  5. function getValue() { return "b"; }
  6. }
  7. return getValue();
  8. }

输入例子:
functions(true)
输出例子:
a

</>复制代码

  1. /* else中的语句相当于将if中的function重写,因此无论flag为何值,返回的方法始终为重写后的方
  2. 法。将方法赋值给一个变量,方法就不会被重写 */
  3. // 将方法赋值给一个变量
  4. function functions(flag) {
  5. var getValue = null;
  6. if (flag) {
  7. getValue = function () { return "a"; }
  8. } else {
  9. getValue = function () { return "b"; }
  10. }
  11. return getValue();
  12. }
  13. // 修改为闭包形式
  14. function functions(flag) {
  15. if (flag) {
  16. return (function() { return "a"; })();
  17. } else {
  18. return (function() { return "b"; })();
  19. }
  20. }
  21. // 使用 ?: 判断语句整合版
  22. function functions(flag) {
  23. function getValue() {
  24. return flag ? "a" : "b";
  25. }
  26. return getValue();
  27. }
  28. // ES6箭头函数形式(精简版)
  29. const functions = flag => flag ? "a" : "b";

</>复制代码

  1. 题目描述

修改 js 代码中 parseInt 的调用方式,使之通过全部测试用例

</>复制代码

  1. function parse2Int(num) {
  2. return parseInt(num);
  3. }

输入例子:
parse2Int("12"); parse2Int("12px"); parse2Int("0x12")
输出例子:
12; 12; 0

</>复制代码

  1. /* parseInt(string, radix);
  2. 当参数radix的值为0,或没有设置该参数时,parseInt()会根据 string 来判断数字的基数。
  3. 如果string"0x"开头,parseInt()会把string的其余部分解析为十六进制的整数。
  4. 如果string0开头,那么ECMAScript3允许parseInt()的一个实现把其后的字符解析为八进制
  5. 或十六进制的数字。如果string1~9的数字开头,parseInt()将把它解析为十进制的整数 */
  6. // 将所有输入转换成十进制输出
  7. function parse2Int(num) {
  8. return parseInt(num, 10);
  9. }

</>复制代码

  1. 题目描述

判断 val1 和 val2 是否完全等同

</>复制代码

  1. function identity(val1, val2) {
  2. return val1 === val2;
  3. }

</>复制代码

  1. 题目描述

实现一个打点计时器,要求
1、从 start 到 end(包含 start 和 end),每隔 100 毫秒 console.log 一个数字,每次数字增幅为 1
2、返回的对象中需要包含一个 cancel 方法,用于停止定时操作
3、第一个数需要立即输出

</>复制代码

  1. setTimeout和setInterval的语法相同。它们都有两个参数,一个是将要执行的代码字符串,还有一个
  2. 是以毫秒为单位的时间间隔,当过了那个时间段之后就将执行那段代码。
  3. 不过这两个函数还是有区别的,setInterval在执行完一次代码之后,经过了那个固定的时间间隔,它还
  4. 会自动重复执行代码,而setTimeout只执行一次那段代码。
  5. window.setInterval("function", time); //设置一个超时对象,周期="交互时间"
  6. window.setTimeout("function", time); //设置一个超时对象,只执行一次,无周期
  7. /* 停止定时 */
  8. window.clearInterval(对象); // 清除已设置的setInterval对象
  9. window.clearTimeout(对象); // 清除已设置的setTimeout对象
setInterval setTimeout clearInterval() clearTimeout()

</>复制代码

  1. // 一般写法,使用setInterval
  2. function count(start, end) {
  3. console.log(start++);
  4. var timer = setInterval(function() {
  5. if (start <= end) {
  6. console.log(start++);
  7. } else {
  8. clearInterval(timer);
  9. }
  10. }, 100);
  11. return {
  12. cancel: function() {
  13. clearInterval(timer);
  14. }
  15. }
  16. }
  17. // 用setTimeout模拟setInterval,递归写法,表述较简洁
  18. function count(start, end) {
  19. if (start <= end) {
  20. console.log(start++);
  21. st = setTimeout(function() {
  22. count(start, end);
  23. }, 100);
  24. }
  25. return {
  26. cancel: function() {
  27. clearTimeout(st);
  28. }
  29. }
  30. }
  31. // 这种写法不符合函数式编程的特点,不推荐
  32. function count(start, end) {
  33. var timer = null;
  34. console.log(start);
  35. var obj = {
  36. timer: setInterval(function() {
  37. if (start <= end) {
  38. start++;
  39. console.log(start);
  40. } else {
  41. clearInterval(this.timer);
  42. }
  43. }, 100),
  44. cancel: function() {
  45. clearInterval(this.timer);
  46. }
  47. }
  48. return obj;
  49. }

</>复制代码

  1. 题目描述

实现 fizzBuzz 函数,参数 num 与返回值的关系如下:
1、如果 num 能同时被 3 和 5 整除,返回字符串 fizzbuzz
2、如果 num 能被 3 整除,返回字符串 fizz
3、如果 num 能被 5 整除,返回字符串 buzz
4、如果参数为空或者不是 Number 类型,返回 false
5、其余情况,返回参数 num
输入例子:
fizzBuzz(15)
输出例子:
fizzbuzz

</>复制代码

  1. // 一般写法
  2. function fizzBuzz(num) {
  3. if (num % 3 === 0 && num % 5 === 0) {
  4. /* 特殊地,可换为 if (num % 15 === 0) */
  5. return "fizzbuzz";
  6. } else if (num % 3 === 0) {
  7. return "fizz";
  8. } else if (num % 5 === 0) {
  9. return "buzz";
  10. }
  11. if (num === null || num === "" || typeof num !== "number") {
  12. return false;
  13. }
  14. return num;
  15. }
  16. // 改进写法
  17. function fizzBuzz(num) {
  18. if (num === null || num === "" || typeof num !== "number") {
  19. return false;
  20. }
  21. var result = "";
  22. if (num % 3 === 0) {
  23. result += "fizz";
  24. }
  25. if (num % 5 === 0) {
  26. result += "buzz";
  27. }
  28. return result ? result : num;
  29. }

</>复制代码

  1. 题目描述

将数组 arr 中的元素作为调用函数 fn 的参数
输入例子:
argsAsArray(function (greeting, name, punctuation) {return greeting + ", " + name + (punctuation || "!");}, ["Hello", "Ellie", "!"])
输出例子:
Hello, Ellie!

</>复制代码

  1. // 直接法
  2. function argsAsArray(fn, arr) {
  3. return fn(arr[0],arr[1],arr[2]);
  4. }
  5. /* 调用函数可以使用call或者apply这两个方法,区别在于call需要将传给函数的参数明确写出来,是
  6. 多少参数就需要写多少参数。而apply则将传递给函数的参数放入一个数组中,传入参数数组即可 */
  7. function argsAsArray(fn, arr) {
  8. return fn.apply(this, arr);
  9. }

</>复制代码

  1. 题目描述

将函数 fn 的执行上下文改为 obj 对象
输入例子:
speak(function () {return this.greeting + ", " + this.name + "!!!";}, {greeting: "Hello", name: "Rebecca"})
输出例子:
Hello, Rebecca!!!

</>复制代码

  1. // apply
  2. function speak(fn, obj) {
  3. return fn.apply(obj, []); // 第二个参数可省略
  4. }
  5. // call
  6. function speak(fn, obj) {
  7. return fn.call(obj);
  8. }
  9. // bind
  10. function speak(fn, obj) {
  11. return fn.bind(obj)();
  12. }

</>复制代码

  1. 题目描述

实现函数 functionFunction,调用之后满足如下条件:
1、返回值为一个函数 f
2、调用返回的函数 f,返回值为按照调用顺序的参数拼接,拼接字符为英文逗号加一个空格,即 ", "
3、所有函数的参数数量为 1,且均为 String 类型
输入例子:
functionFunction("Hello")("world")
输出例子:
Hello, world

</>复制代码

  1. // 一般写法
  2. function functionFunction(str) {
  3. function f(s) {
  4. return str + ", " + s; // 可替换为 return [str, s].join(", ");
  5. }
  6. return f;
  7. }
  8. // 精简版,省略内部命名函数
  9. const functionFunction = str => s => [str, s].join(", ");

</>复制代码

  1. 题目描述

实现函数 makeClosures,调用之后满足如下条件:
1、返回一个函数数组 result,长度与 arr 相同
2、运行 result 中第 i 个函数,即 result[i](),结果与 fn(arr[i]) 相同
输入例子:

</>复制代码

  1. var arr = [1, 2, 3];
  2. var square = function (x) {
  3. return x * x;
  4. };
  5. var funcs = makeClosures(arr, square);
  6. funcs[1]();

输出例子:
4

理解闭包

</>复制代码

  1. // 这种写法比较绕(多层嵌套)
  2. function makeClosures(arr, fn) {
  3. var result = [];
  4. arr.forEach(function(e) {
  5. result.push(function(num) {
  6. return function() {
  7. return fn(num);
  8. };
  9. }(e));
  10. });
  11. return result;
  12. }
  13. // 较简洁版(一般按这种方式)
  14. function makeClosures(arr, fn) {
  15. var result = [];
  16. arr.forEach(function(e) {
  17. result.push(function() {
  18. return fn(e);
  19. });
  20. });
  21. return result;
  22. }
  23. // bind的妙用(推荐写法)
  24. function makeClosures(arr, fn) {
  25. var result = [];
  26. arr.forEach(function(e) {
  27. result.push(fn.bind(this, e));
  28. });
  29. return result;
  30. }
  31. /* 为了更清晰地作对比,对这几种写法分别用箭头函数表示 */
  32. // 1
  33. function makeClosures(arr, fn) {
  34. let result = [];
  35. arr.forEach(e => result.push(num => () => fn(num))(e));
  36. return result;
  37. }
  38. // 2
  39. function makeClosures(arr, fn) {
  40. let result = [];
  41. arr.forEach(e => result.push((e => () => fn(e))(e)));
  42. return result;
  43. }
  44. // 3
  45. function makeClosures(arr, fn) {
  46. let result = [];
  47. arr.forEach(e => result.push(fn.bind(null, e)));
  48. return result;
  49. }

</>复制代码

  1. 题目描述

已知函数 fn 执行需要 3 个参数。请实现函数 partial,调用之后满足如下条件:
1、返回一个函数 result,该函数接受一个参数
2、执行 result(str3) ,返回的结果与 fn(str1, str2, str3) 一致
输入例子:
var sayIt = function(greeting, name, punctuation) { return greeting + ", " + name + (punctuation || "!"); }; partial(sayIt, "Hello", "Ellie")("!!!");
输出例子:
Hello, Ellie!!!

关于js中 call、apply、bind 的用法可参考这篇博客

</>复制代码

  1. // 一般写法
  2. function partial(fn, str1, str2) {
  3. function result(str3) {
  4. return fn(str1, str2, str3);
  5. }
  6. return result;
  7. }
  8. // call
  9. function partial(fn, str1, str2) {
  10. function result(str3) {
  11. return fn.call(this, str1, str2, str3);
  12. }
  13. return result;
  14. }
  15. // apply(这里只是为了对照)
  16. function partial(fn, str1, str2) {
  17. function result(str3) {
  18. return fn.apply(this, [str1, str2, str3]);
  19. }
  20. return result;
  21. }
  22. // 这个bind会生成一个新函数对象, 它的str1, str2参数都定死了, str3未传入, 一旦传入就会执行
  23. function partial(fn, str1, str2) {
  24. return fn.bind(this, str1, str2); //return fn.bind(null, str1, str2);
  25. }
  26. // bind同上, 多了一步, 把str3传入的过程写在另一个函数里面, 而另一个函数也有str1, str2参数
  27. function partial(fn, str1, str2) {
  28. function result(str3) {
  29. return fn.bind(this, str1, str2)(str3);
  30. }
  31. return result;
  32. }
  33. // 匿名函数
  34. function partial(fn, str1, str2) {
  35. return function(str3) {
  36. return fn(str1, str2, str3);
  37. }
  38. }
  39. // ES6
  40. const partial = (fn, str1, str2) => str3 => fn(str1, str2, str3);

</>复制代码

  1. 题目描述

函数 useArguments 可以接收 1 个及以上的参数。请实现函数 useArguments,返回所有调用参数相加后的结果。本题的测试参数全部为 Number 类型,不需考虑参数转换。
输入例子:
useArguments(1, 2, 3, 4)
输出例子:
10

关于arguments的介绍

</>复制代码

  1. // 一般写法,直接利用arguments只有length属性的特点
  2. function useArguments() {
  3. var sum = 0;
  4. for (var i = 0; i < arguments.length; ++i) {
  5. sum += arguments[i];
  6. }
  7. return sum;
  8. }
  9. // call
  10. function useArguments() {
  11. var arr = [].slice.call(arguments); // 转成数组 ([]为Array.prototype的语法糖)
  12. return arr.reduce(function(a, b) {
  13. return a + b;
  14. });
  15. }
  16. /* call, bind, apply会改变生成函数对象的this, 使得arguments可以直接使用数组的方法,
  17. 所以也可不转换成数组而直接使用reduce */
  18. // call同上, 精简版
  19. function useArguments() {
  20. return [].reduce.call(arguments, function(a, b) {
  21. return a + b;
  22. });
  23. }
  24. // bind
  25. function useArguments() {
  26. return [].reduce.bind(arguments, function(a, b) {
  27. return a + b;
  28. })();
  29. }
  30. // apply
  31. function useArguments() {
  32. return [].reduce.apply(arguments, [function(a, b) {
  33. return a + b;
  34. }]);
  35. }
  36. // eval的妙用,但不推荐使用eval
  37. function useArguments() {
  38. var arr = Array.prototype.slice.call(arguments);
  39. return eval(arr.join("+"));
  40. }

</>复制代码

  1. 题目描述

实现函数 callIt,调用之后满足如下条件
1、返回的结果为调用 fn 之后的结果
2、fn 的调用参数为 callIt 的第一个参数之后的全部参数
输入例子:
var a = 1; var b = 2; var test = function (first, second) { return first === a && second === b;}; callIt(test, a, b);
输出例子:
true

箭头函数的arguments 剩余参数(rest parameter)

</>复制代码

  1. // slice
  2. function callIt(fn) {
  3. var arr = [].slice.call(arguments, 1);
  4. /* 将arguments转成数组并只截取从1开始之后的所有元素 */
  5. return fn.apply(this, arr);
  6. }
  7. // shift
  8. function callIt(fn) {
  9. return [].shift.call(arguments).apply(null, arguments);
  10. /* [].shift.call(arguments)返回了第一个参数fn, 因为这里fn等价于arguments[0] */
  11. }
  12. // ES6语法糖
  13. const callIt = (fn, ...args) => fn(...args);

</>复制代码

  1. 题目描述

实现函数 partialUsingArguments,调用之后满足如下条件:
1、返回一个函数 result
2、调用 result 之后,返回的结果与调用函数 fn 的结果一致
3、fn 的调用参数为 partialUsingArguments 的第一个参数之后的全部参数以及 result 的调用参数
输入例子:
var a = 1; var b = 2; var c = 3; var d = 4;var test = function (first, second, third, forth) {return first + second + third + forth;};partialUsingArguments(test, a, b)(c, d);
输出例子:
10

</>复制代码

  1. function partialUsingArguments(fn) {
  2. var arr = [].slice.call(arguments, 1);
  3. /* arr是由partialUsingArguments传的arguments转换而来 */
  4. function result() {
  5. var arrFromResult = [].slice.call(arguments);
  6. /* arrFromResult则从函数result中传的arguments转换, 所以不能在result外获取 */
  7. return fn.apply(null, arr.concat(arrFromResult));
  8. }
  9. return result;
  10. }
  11. // 稍微简化,跟上面差不多
  12. function partialUsingArguments(fn) {
  13. var arr = [].slice.call(arguments, 1);
  14. return function() {
  15. return fn.apply(this, arr.concat([].slice.call(arguments)));
  16. }
  17. }

</>复制代码

  1. 题目描述

已知 fn 为一个预定义函数,实现函数 curryIt,调用之后满足如下条件:
1、返回一个函数 a,a 的 length 属性值为 1(即显式声明 a 接收一个参数)
2、调用 a 之后,返回一个函数 b, b 的 length 属性值为 1
3、调用 b 之后,返回一个函数 c, c 的 length 属性值为 1
4、调用 c 之后,返回的结果与调用 fn 的返回值一致
5、fn 的参数依次为函数 a, b, c 的调用参数
输入例子:
var fn = function (a, b, c) {return a + b + c}; curryIt(fn)(1)(2)(3);
输出例子:
6

JS中的柯里化(currying)

</>复制代码

  1. // apply
  2. function curryIt(fn) {
  3. var arr = [];
  4. return function(a) {
  5. arr.push(a);
  6. return function(b) {
  7. arr.push(b);
  8. return function(c) {
  9. arr.push(c);
  10. return fn.apply(this, arr);
  11. }
  12. }
  13. }
  14. }
  15. // 推荐写法
  16. function curryIt(fn) {
  17. return function(e1) {
  18. return function(e2) {
  19. return function(e3) {
  20. return fn(e1, e2, e3); // return fn.call(this, e1, e2, e3); 与之等价
  21. }
  22. }
  23. }
  24. }
  25. // 箭头函数
  26. const curryIt = fn => e1 => e2 => e3 => fn(e1, e2, e3);

</>复制代码

  1. 题目描述

返回参数 a 和 b 的逻辑或运算结果
输入例子:
or(false, true)
输出例子:
true

</>复制代码

  1. function or(a, b) {
  2. return a || b;
  3. }

</>复制代码

  1. 题目描述

返回参数 a 和 b 的逻辑且运算结果
输入例子:
and(false, true)
输出例子:
false

</>复制代码

  1. function and(a, b) {
  2. return a && b;
  3. }

</>复制代码

  1. 题目描述

完成函数 createModule,调用之后满足如下要求:
1、返回一个对象
2、对象的 greeting 属性值等于 str1, name 属性值等于 str2
3、对象存在一个 sayIt 方法,该方法返回的字符串为 greeting属性值 + ", " + name属性值

</>复制代码

  1. // 推荐写法
  2. function createModule(str1, str2) {
  3. return {
  4. greeting: str1,
  5. name: str2,
  6. sayIt: function() {
  7. return [this.greeting, this.name].join(", ");
  8. }
  9. }
  10. }
  11. // Constructor grammer
  12. function createModule(str1, str2) {
  13. function Obj() {
  14. this.greeting = str1;
  15. this.name = str2;
  16. this.sayIt = function() {
  17. return this.greeting + ", " + this.name;
  18. }
  19. }
  20. return new Obj();
  21. }

</>复制代码

  1. 题目描述

获取数字 num 二进制形式第 bit 位的值。注意:
1、bit 从 1 开始
2、返回 0 或 1
3、举例:2 的二进制为 10,第 1 位为 0,第 2 位为 1
输入例子:
valueAtBit(128, 8)
输出例子:
1

</>复制代码

  1. // 推荐写法 (时间复杂度是O(log bit))
  2. function valueAtBit(num, bit) {
  3. return (num & Math.pow(2, bit - 1)) === 0 ? 0 : 1;
  4. }
  5. // 利用运算符特性,简洁写法 (时间复杂度O(n))
  6. function valueAtBit(num, bit) {
  7. return num >> (bit - 1) & 1;
  8. }
  9. // 转成字符串 (不推荐)
  10. function valueAtBit(num, bit) {
  11. var s = num.toString(2);
  12. var len = s.length;
  13. return parseInt(s[len - bit]);
  14. }

</>复制代码

  1. 题目描述

给定二进制字符串,将其换算成对应的十进制数字
输入例子:
base10("11000000")
输出例子:
192

</>复制代码

  1. // parseInt(string, radix) 的可选参数是操作数的进制说明,不是目标的进制。
  2. function base10(str) {
  3. return parseInt(str, 2);
  4. }

</>复制代码

  1. 题目描述

将给定数字转换成二进制字符串。如果字符串长度不足 8 位,则在前面补 0 到满8位。
输入例子:
convertToBinary(65)
输出例子:
01000001

</>复制代码

  1. // 前三种都是采用拼接方法
  2. function convertToBinary(num) {
  3. var s = num.toString(2);
  4. var len = s.length;
  5. if (len < 8) {
  6. s = "0000000".slice(0, 8 - len) + s;
  7. }
  8. return s;
  9. }
  10. function convertToBinary(num) {
  11. var s = num.toString(2);
  12. while (s.length < 8) {
  13. s = "0" + s;
  14. }
  15. return s;
  16. }
  17. function convertToBinary(num) {
  18. var s = num.toString(2);
  19. return s.length < 8 ? new Array(8 - s.length + 1).join("0").concat(s) : s;
  20. }
  21. // 推荐写法, 如果长度过长, 则截取后8位(倒数第8位开始到最后1位)
  22. function convertToBinary(num) {
  23. var s = num.toString(2);
  24. return s.length < 8 ? ("00000000" + s).slice(-8) : s;
  25. }

</>复制代码

  1. 题目描述

求 a 和 b 相乘的值,a 和 b 可能是小数,需要注意结果的精度问题
输入例子:
multiply(3, 0.0001)
输出例子:
0.0003

String.prototype.substring() Number.prototype.toFixed()

</>复制代码

  1. // 推荐写法
  2. function multiply(a, b) {
  3. a = a.toString();
  4. b = b.toString();
  5. var aLen = a.substring(a.indexOf(".") + 1).length;
  6. var bLen = b.substring(b.indexOf(".") + 1).length;
  7. return (a * b).toFixed(Math.max(aLen, bLen));
  8. /* 本题未说明保留小数位数, 这里假定得出的结果不含多余的0, 即0.0003000...需转成0.0003 */
  9. }

</>复制代码

  1. 题目描述

将函数 fn 的执行上下文改为 obj,返回 fn 执行后的值
输入例子:
alterContext(function() {return this.greeting + ", " + this.name + "!"; }, {name: "Rebecca", greeting: "Yo" })
输出例子:
Yo, Rebecca!

</>复制代码

  1. /* 将函数fn的执行上下文改为obj对象, 只需要将obj作为call或apply的第一个参数传入即可 */
  2. // call
  3. function alterContext(fn, obj) {
  4. return fn.call(obj); // 这里的第二个参数可有可无, 如有, 则作为fn的参数(下同)
  5. }
  6. // apply
  7. function alterContext(fn, obj) {
  8. return fn.apply(obj);
  9. }
  10. // bind
  11. function alterContext(fn, obj) {
  12. return fn.bind(obj)(); // .bind()返回的是一个函数, 需要立即执行
  13. }

</>复制代码

  1. 题目描述

给定一个构造函数 constructor,请完成 alterObjects 方法,将 constructor 的所有实例的 greeting 属性指向给定的 greeting 变量。
输入例子:
var C = function(name) {this.name = name; return this;}; var obj1 = new C("Rebecca"); alterObjects(C, "What"s up"); obj1.greeting;
输出例子:
What"s up

继承与原型链(prototype chain)

</>复制代码

  1. /* 每个构造函数都有一个原型对象,原型对象都包含一个指向构造函数的指针,而实例都包含一个
  2. 指向原型对象的内部指针 */
  3. function alterObjects(constructor, greeting) {
  4. constructor.prototype.greeting = greeting;
  5. }

</>复制代码

  1. 题目描述

找出对象 obj 不在原型链上的属性(注意这题测试例子的冒号后面也有一个空格~)
1、返回数组,格式为 key: value
2、结果数组不要求顺序
输入例子:
var C = function() {this.foo = "bar"; this.baz = "bim";}; C.prototype.bop = "bip"; iterate(new C());
输出例子:
["foo: bar", "baz: bim"]

Object.getOwnPropertyNames()
Object.keys()
Object.prototype.hasOwnProperty()

</>复制代码

  1. // 前两种均使用map (推荐写法)
  2. function iterate(obj) {
  3. return Object.getOwnPropertyNames(obj).map(function(key) {
  4. return key + ": " + obj[key];
  5. });
  6. }
  7. function iterate(obj) {
  8. return Object.keys(obj).map(function(key) {
  9. return key + ": " + obj[key];
  10. });
  11. }
  12. /*用for-in遍历可枚举的属性, 用hasOwnProperty()方法判断是否是自有属性(即不在原型链上)*/
  13. function iterate(obj) {
  14. var arr = [];
  15. for (var key in obj) {
  16. if (obj.hasOwnProperty(key)) {
  17. arr.push(key + ": " + obj[key]);
  18. }
  19. }
  20. return arr;
  21. }

以下为正则表达式相关题目

</>复制代码

  1. 可以通过下面两种方法创建一个正则表达式:

使用一个正则表达式字面量,如下所示:

re = /ab+c/;

正则表达式字面量在脚本加载后编译。若你的正则表达式是常量,使用这种方式可以获得更好的性能。

调用RegExp对象的构造函数,如下所示:

re = new RegExp("ab+c");

使用构造函数,提供了对正则表达式运行时的编译。当你知道正则表达式的模式会发生改变, 或者你事先并不了解它的模式或者是从其他地方(比如用户的输入),得到的代码这时比较适合用构造函数的方式。

</>复制代码

  1. ///

</>复制代码

  1. 题目描述

给定字符串 str,检查其是否包含数字,包含返回 true,否则返回 false
输入例子:
containsNumber("abc123")
输出例子:
true

</>复制代码

  1. d 匹配一个数字, 等价于[0-9]。
  2. 例如, /d/ 或者 /[0-9]/ 匹配 "B2 is the suite number." 中的"2"
  3. test()方法执行一个检索,用来查看正则表达式与指定的字符串是否匹配。返回truefalse

</>复制代码

  1. function containsNumber(str) {
  2. return /d/.test(str);
  3. }

</>复制代码

  1. 题目描述

给定字符串 str,检查其是否包含连续重复的字母(a-zA-Z),包含返回 true,否则返回 false
输入例子:
containsRepeatingLetter("rattler")
输出例子:
true

</>复制代码

  1. [xyz] 一个字符集合, 匹配方括号的中任意字符。可以使用破折号(-)来指定一个字符范围。
  2. 对于点(.)和星号(*)这样的特殊符号在一个字符集中没有特殊的意义。他们不必进行转义,不过转义也是起作用的。
  3. 例如,[abcd] 和[a-d]是一样的。他们都匹配"brisket"中的‘b’,也都匹配“city”中的‘c’。
  4. /[a-z.]+//[w.]+/都匹配“test.i.ng”中的所有字符。
  5. (x) 匹配 "x" 并且记住匹配项,就像下面的例子展示的那样。括号被称为"捕获括号"
  6. 模式/(foo) (bar) 1 2/中的"(foo)""(bar)"匹配并记住字符串"foo bar foo bar"中前两个单词。
  7. 模式中的 1 和 2 匹配字符串的后两个单词。注意 1、2、
  8. 是用在正则表达式的匹配环节。
  9. 在正则表达式的替换环节,则要使用像 $1$2$n 这样的语法,例如,
  10. "bar foo".replace( /(...) (...)/, "$2 $1" )。

</>复制代码

  1. function containsRepeatingLetter(str) {
  2. return /([a-zA-Z])1/.test(str);
  3. }

</>复制代码

  1. 题目描述

给定字符串 str,检查其是否以元音字母结尾
1、元音字母包括 a,e,i,o,u,以及对应的大写
2、包含返回 true,否则返回 false
输入例子:
endsWithVowel("gorilla")
输出例子:
true

</>复制代码

  1. $ 匹配输入的结束。如果多行标示被设置为true,那么也匹配换行符前的位置。
  2. 例如,/t$/ 并不会匹配 "eater" 中的 "t",但是会匹配 "eat" 中的 "t"
  3. 通过标志进行高级搜索
  4. 正则表达式有四个可选参数进行全局和不分大小写搜索。
  5. 这些参数既可以多带带使用也可以一起使用在任何顺序和包含正则表达式的部分中。
  6. 正则表达式标志
  7. 标志 描述
  8. g 全局搜索。
  9. i 不区分大小写搜索。
  10. m 多行搜索。
  11. y 执行“粘性”搜索,匹配从目标字符串的当前位置开始,可以使用y标志。

</>复制代码

  1. function endsWithVowel(str) {
  2. return /[aeiou]$/i.test(str);
  3. }

</>复制代码

  1. 题目描述

给定字符串 str,检查其是否包含连续3个数字
1、如果包含,返回最新出现的3个数字的字符串
2、如果不包含,返回 false
输入例子:
captureThreeNumbers("9876543")
输出例子:
987

String.prototype.match()

</>复制代码

  1. function captureThreeNumbers(str) {
  2. var arr = str.match(/d{3}/); // 寻找三个数字字符 d{3}
  3. return arr ? arr[0] : false;
  4. }

</>复制代码

  1. 题目描述

给定字符串 str,检查其是否符合如下格式
1、XXX-XXX-XXXX
2、其中 X 为 Number 类型
输入例子:
matchesPattern("800-555-1212")
输出例子:
true

</>复制代码

  1. ^ 匹配输入的开始。如果多行标志被设置为true,那么也匹配换行符后紧跟的位置。
  2. 例如,/^A/ 并不会匹配 "an A" 中的 "A",但是会匹配 "An E" 中的 "A"
  3. "^" 作为第一个字符出现在一个字符集合模式时,它将会有不同的含义。

</>复制代码

  1. function matchesPattern(str) {
  2. return /^(d{3}-){2}d{4}$/.test(str);
  3. }

</>复制代码

  1. 题目描述

给定字符串 str,检查其是否符合美元书写格式
1、以 $ 开始
2、整数部分,从个位起,满 3 个数字用 , 分隔
3、如果为小数,则小数部分长度为 2
4、正确的格式如:$1,023,032.03 或者 $2.03,错误的格式如:$3,432,12.12 或者 $34,344.3
输入例子:
isUSD("$20,933,209.93")
输出例子:
true

</>复制代码

  1. ? 匹配前面一个表达式0次或者1次。等价于 {0,1}。
  2. 例如,/e?le?/ 匹配 "angel" 中的 "el",和 "angle" 中的 "le"
  3. (注意第二个 ? 前面的匹配表达式是 e 而不是 le) 以及 "oslo" 中的"l"
  4. 如果紧跟在任何量词 *、 +、? 或 {} 的后面,将会使量词变为非贪婪的(匹配尽量少的字符),和缺省
  5. 使用的贪婪模式(匹配尽可能多的字符)正好相反。
  6. 例如,对 "123abc" 应用 /d+/ 将会返回 "123",如果使用 /d+?/,那么就只会匹配到 "1"
  7. 还可以运用于向前断言 正向肯定查找x(?=y) 和 正向否定查找x(?!y) 。
  8. * 匹配前一个表达式0次或多次。等价于 {0,}。
  9. 例如,/bo*/会匹配 "A ghost boooooed" 中的 "booooo""A bird warbled" 中的 "b",
  10. 但是在 "A goat grunted" 中将不会匹配任何东西。
  11. . (小数点)匹配 除了换行符(
  12. )之外的任何单个字符。
  13. 例如, /.n/将会匹配"nay, an apple is on the tree"中的"an""on", 但是不会匹配 "nay"

</>复制代码

  1. function isUSD(str) {
  2. return /^$d{1,3}(,d{3})*(.d{2})?$/.test(str);
  3. }

如有错误,恳请指正,也欢迎各位大佬贡献出更好的解法

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/81901.html

相关文章

  • JavaScript书籍测评

    摘要:前言今天和大家一起聊聊的推荐书籍,每一本都是精选,做前端开发的朋友们如果没读过,可以尝试一下。如果怕麻烦,也可以关注晓舟报告,发送获取书籍,四个字,就可以得到电子书的提取码。 前言 今天和大家一起聊聊JavaScript的推荐书籍,每一本都是精选,做前端开发的朋友们如果没读过,可以尝试一下。下面给大家简单介绍了书的内容,还有读书的方法,希望可以帮大家提升读书效率。 一、《JavaScr...

    X1nFLY 评论0 收藏0
  • 求职准备 - 收藏集 - 掘金

    摘要:一基础接口的意义百度规范扩展回调抽象类的意义想不想通过一线互联网公司面试文档整理为电子书掘金简介谷歌求职记我花了八个月准备谷歌面试掘金原文链接翻译者 【面试宝典】从对象深入分析 Java 中实例变量和类变量的区别 - 掘金原创文章,转载请务必保留原出处为:http://www.54tianzhisheng.cn/... , 欢迎访问我的站点,阅读更多有深度的文章。 实例变量 和 类变量...

    cuieney 评论0 收藏0
  • 前端经典面试经典不要star!

    摘要:前言上一期说好的的核心模块进阶以及基本应用的使用将在号或者号与大家见面在此之前我想跟大家分享几个前端经典的面试题为什么我突然想写这么一篇文章呢今天我应公司要求去面试了下几位招聘者然后又现场整不出几个难题就搜了一下前端变态面试题,前提我并不是 前言 上一期说好的node.js的核心模块进阶以及基本web应用的使用将在2号或者3号与大家见面,在此之前我想跟大家分享几个前端经典的面试题,为什...

    codergarden 评论0 收藏0
  • 前端经典面试经典不要star!

    摘要:前言上一期说好的的核心模块进阶以及基本应用的使用将在号或者号与大家见面在此之前我想跟大家分享几个前端经典的面试题为什么我突然想写这么一篇文章呢今天我应公司要求去面试了下几位招聘者然后又现场整不出几个难题就搜了一下前端变态面试题,前提我并不是 前言 上一期说好的node.js的核心模块进阶以及基本web应用的使用将在2号或者3号与大家见面,在此之前我想跟大家分享几个前端经典的面试题,为什...

    archieyang 评论0 收藏0

发表评论

0条评论

zhangke3016

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<