资讯专栏INFORMATION COLUMN

javascript的有趣逻辑片段

xingqiba / 2899人阅读

摘要:准备面试的刷题过程中,遇到了一些题,比较有意思,轻巧。可表示如下给出参数表示当前字符串中从下标为的字符开始的长度为的一个子串。反反拼接新的字符串结合,返回二维数组中每个一维数组的最大值用实现一个数组合并的方法要求去重。

准备面试的刷题过程中,遇到了一些题,比较有意思,轻巧。
加强运用一下js原生语法,多解。

题目来源:https://github.com/rmurphey/j...
A test-driven approach to assessing JS skills

统计数组 arr 中值等于 item 的元素出现的次数

function count(arr, item) {
     var count = 0;
     arr.forEach(function(e){
         //e为arr中的每一个元素,与item相等则count+1
         e == item ? count++ : 0;
     });
     return count;
 }

function count(arr, item) {
    return arr.filter(function(a){
        return (a==item);
    }).length
}

function count(arr, item) {
    var res;
    return (res = arr.toString().match(new RegExp(""+item+"","g")))?res.length:0;
}

function count(arr, item) {
            var count = 0;
            arr.map(function(a) {
                if(a === item) {
                    count++;
                }
            });
            return count;
        }
        

为数组 arr 中的每个元素求二次方。不要直接修改数组 arr,结果返回新的数组

function square(arr) {
    return arr.map(function(item,index,array){
        return item*item;
    })
}

function square(arr) {
   //声明一个新的数组存放结果
     var a = [];
     arr.forEach(function(e){
         //将arr中的每一个元素求平方后,加入到a数组中
         a.push(e*e);
     });
     return a;
 }

function square(arr) {
//复制一个arr数组
    var newarr = arr.slice(0);
    for (var i=0;i

将数组 arr 中的元素作为调用函数 fn 的参数

function argsAsArray(fn, arr) {
  return fn.apply(this, arr);
 }

function argsAsArray(fn, arr) {
    return function(para1,para2){ 
        return  para1.apply(this,para2);
    }(fn,arr);
}

完成函数 createModule,调用之后满足如下要求:

1、返回一个对象
2、对象的 greeting 属性值等于 str1,name 属性值等于 str2
3、对象存在一个 sayIt 方法,该方法返回的字符串为 greeting属性值 + ", " +name属性值

function createModule(str1, str2) {
     var obj = {
         greeting : str1,
         name     : str2,
         sayIt    : function(){
             //两个属性前面都需要加上this
             return this.greeting+", "+this.name;
         }
     };
     return obj;
 }

//使用构造函数法
function createModule(str1, str2) {
    function Obj(){
        this.greeting = str1;
        this.name = str2;
        this.sayIt = function(){
            return this.greeting + ", " + this.name;
        };
    }
    return new Obj();
}

//构造函数与原型组合
function createModule(str1, str2) {
    function CreateMod(){
        this.greeting = str1;
        this.name = str2;
    }
    CreateMod.prototype.sayIt = function(){
        return this.greeting + ", "  + this.name;
    }
    return new CreateMod();
}

已知 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);
function curryIt(fn) {
     //获取fn参数的数量
     var n = fn.length;
     //声明一个数组args
     var args = [];
     //返回一个匿名函数
     return function(arg){
         //将curryIt后面括号中的参数放入数组
         args.push(arg);
         //如果args中的参数个数小于fn函数的参数个数,
         //则执行arguments.callee(其作用是引用当前正在执行的函数,这里是返回的当前匿名函数)。
         //否则,返回fn的调用结果
         if(args.length < n){
            return arguments.callee;
         }else return fn.apply("",args);
     }
 }

function curryIt(fn) {
    return function a(xa){
        return function b(xb){
            return function c(xc){
                return fn.call(this,xa,xb,xc);
            };
        };
    };
}

数组中输出元素位置

function indexof(arr,item){
    for(var i = 0,len = arr.length;i

数组求和

function sum(arr) {
    return eval(arr.join("+"));
};

删除给定元素

   function remove(arr, item) {
        for(var i=0, m=arr.length, res=[]; i-1;i=newA.indexOf(item)){
        newA.splice(i,1);
    }
    return newA;
}

将函数放入数组,参数放入函数,调用数组里面的函数,返回函数执行的结果。

function makeclosures(arr,fn){
    var funcs = [];
    for(var i = 0;i

将函数a暂时保存在一个内建函数result中,返回这个result函数,再执行.(有闭包,call/apply)

partialUsingArguments(test,a,b)(c,d);//用法

function partialUsingArguments(fn){
    var args1  = Array.prototype.slice.call(arguments,1);
    var result = function(){
        var args2 = Array.prototype.slice.call(arguments,0);
        var args = args1.concat(args2);
        return fn.apply(null,args);
    }
    return result;
}

判断字符串是否连续重复(若是,则返回true)

function containRepeatingLetter(str){
    var re = /[a-zA-Z]/;
    for(var i = 0,len = str.length;i

如下的结果是?

var m= 1, 
j = k = 0; 
function add(n) { 
    return n = n+1; 
  } 
y = add(m);   //4
function add(n) { 
    return n = n + 3; 
} 
z = add(m);   //4


所有声明的函数都会被提前。所以function add(){}定义的函数会优先解析,而不是顺序解析;因此整个过程中,首先依次解析两个add function,由于同名,所以后者会覆盖前者;然后,顺序解析其余的JS代码,y = add(m);语句和z = add(m); 语句调用的都是第二个add function,因此返回的都是4.

如下的结果是?

 (function() {
          var a = b = 5;
      })();   
    console.log(b);  //5
    console.log(a);   //a is not defined
    
    

vara=b=5;其中var a表示a为当前作用域的全局变量,b=5并没有定义为当前作用域的全局变量,它会申明提前在全局作用域中。
可表示如下:

var b=5;
(function() {
      var a = b ;
  })();        
  console.log(b);  //5
  console.log(a);   //a is not defined      
  
  

给出参数 str,start,end 表示当前字符串中从下标为 start 的字符开始的长度为 end
的一个子串。你要将这个子串左右翻转后插在这个子串原来位置的正后方,求最后得到的字符串是什么。

  
 function reverseString(str,start,end){
     var slice = str.slice(start,end);
     var sliceReverse = slice.split("").reverse().join(""); //string -> array ->反array -> 反string
     var reverseString = str.slice(0,start+end)+sliceReverse+str.slice(start+end); //拼接新的字符串
     return reverseString;
}     

apply,bind(es5)结合,返回二维数组中每个一维数组的最大值

function largestOfFour(arr) {
  return arr.map(Function.apply.bind(Math.max, null));
}
largestOfFour([[4, 5, 1, 3], [13, 27, 18, 26], [32, 35, 37, 39], [1000, 1001, 857, 1]]);

用JS实现一个数组合并的方法(要求去重)。

var arr1 = ["a"];
var arr2 = ["b", "c"];
var arr3 = ["c", ["d"], "e", undefined, null];

var concat = (function(){
  // concat arr1 and arr2 without duplication.
  var concat_ = function(arr1, arr2) {
    for (var i=arr2.length-1;i>=0;i--) {
      arr1.indexOf(arr2[i]) === -1 ? arr1.push(arr2[i]) : 0;
    }
  };
  // concat arbitrary arrays.
  // Instead of alter supplied arrays, return a new one.
  return function(arr) {
    var result = arr.slice();
    for (var i=arguments.length-1;i>=1;i--) {
      concat_(result, arguments[i]);
    }
    return result;
  };
}());

为字符串实现一个render方法,实现下面的变量替换功能

var greeting = "my name is $(name),age $(age)";
var result = greeting.render({name:"XiaoMing",age:11});
console.log(result); // my name is XiaoMing,age 11

answer:

 String.prototype.render = function(option){
        var s = this,
                reg;
        Object.keys(option).forEach(function(k){
            reg = new RegExp("$("+k+")","g");
            s = s.replace(reg,option[k])
        });
        return s
    };

    var greeting = "my name is $(name),age $(age)";
    var result = greeting.render({name:"XiaoMing",age:11});
    console.log(result); // my name is XiaoMing,age 11

取字符串中间的字符,奇数取1,偶数取2

function getMiddle(str){
   return str.substr(Math.ceil(str.length/2-1),str.length % 2 == 0 ? 2: 1)
 }
var p1 = getMiddle("test"); //es
    var p2 = getMiddle("testing"); //t
    var p3 = getMiddle("middle"); //dd
    var p4 = getMiddle("A"); //A

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

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

相关文章

  • 翻译_20行代码创造JavaScript模板引擎(一)

    摘要:翻译行代码创造模板引擎一想看博客原文链接,请点击下方一个非常好用的学习正则表达的网站正则表达式图文解说网站译文事情的起因,我想编写一个逻辑简单的模板引擎,它可以很好满足我现在的需求。,表示全局匹配。 翻译_20行代码创造JavaScript模板引擎(一) 想看博客原文链接,请点击下方 JavaScript template engine in just 20 lines 一个非常好用...

    hiyang 评论0 收藏0
  • [译] 只有 20 行 JavaScript 模板引擎

    摘要:原文链接译者吐槽只收藏不点赞都是耍流氓前言我仍旧在为我的预处理器进行开发工作。它原本是一个预处理器,但之后它扩展成为了预处理器,很快它将支持到的转换。 原文链接:JavaScript template engine in just 20 lines (译者吐槽:只收藏不点赞都是耍流氓) 前言 我仍旧在为我的JS预处理器AbsurdJS进行开发工作。它原本是一个CSS预处理器,但之后它扩...

    leon 评论0 收藏0
  • javascript知识点

    摘要:模块化是随着前端技术的发展,前端代码爆炸式增长后,工程化所采取的必然措施。目前模块化的思想分为和。特别指出,事件不等同于异步,回调也不等同于异步。将会讨论安全的类型检测惰性载入函数冻结对象定时器等话题。 Vue.js 前后端同构方案之准备篇——代码优化 目前 Vue.js 的火爆不亚于当初的 React,本人对写代码有洁癖,代码也是艺术。此篇是准备篇,工欲善其事,必先利其器。我们先在代...

    Karrdy 评论0 收藏0
  • 【翻译】Web渲染概述

    摘要:由我所在的团队共同翻译完成,并发布在前端技术公众号方凳雅集上,转载于此。在移动端,客户端渲染很难获得并保持一个较快的渲染速度。使用技术进行服务端渲染的主要问题在于它会对可交互时间有明显的负面影响,尽管它缩短了首次绘制时间 本文简单介绍了web应用各种渲染方案,其中包括客户端渲染、服务器端渲染等各种渲染方案。文章翻译自:https://developers.google.com...。由...

    RobinQu 评论0 收藏0
  • 【翻译】Web渲染概述

    摘要:由我所在的团队共同翻译完成,并发布在前端技术公众号方凳雅集上,转载于此。在移动端,客户端渲染很难获得并保持一个较快的渲染速度。使用技术进行服务端渲染的主要问题在于它会对可交互时间有明显的负面影响,尽管它缩短了首次绘制时间 本文简单介绍了web应用各种渲染方案,其中包括客户端渲染、服务器端渲染等各种渲染方案。文章翻译自:https://developers.google.com...。由...

    NervosNetwork 评论0 收藏0

发表评论

0条评论

xingqiba

|高级讲师

TA的文章

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