前端经典面试题-代码

1、检测变量类型。

// 此方法不仅可检测出6种基本数据类型,还能检测出Array、Function
Object.prototype.toString.call(Array)
// [‘Object‘,‘Array‘]

2、去除字符串中的空格,可使用trim()方法或正则表达式。

// trim()用于去除字符串左右两端的所有空格
// trimLeft()、trimRight()用于去除字符串左边和右边的空格
‘   today is Monday   ‘.trim()  // "today is Monday"
‘   today is Monday   ‘.trimLeft()  // "today is Monday   "
// 使用正则表达式和replace方法可以去除所有空格
// 注意replace方法默认只能替换一次,因此正则表达式需加g修饰符完成全部替换
‘   today is Monday   ‘.replace(/\s*/g,‘‘)  // "todayisMonday"
‘   today is Monday   ‘.replace(/^\s*|\s*$/g,‘‘)  // "today is Monday"

3、获取URL中的参数。

function getUrlParam(sUrl, sKey) {
    var reg = /[?&](\w+)=(\w+)/g // 正则表达式
    var obj = {}
    while(reg.exec(sUrl)) // 每次匹配结果返回一个数组,RegExp.$1表示第一个子表达式的匹配,即key
        obj[RegExp.$1]? obj[RegExp.$1] = [].concat(obj[RegExp.$1],RegExp.$2):obj[RegExp.$1] = RegExp.$2
    return sKey? obj[sKey]||‘‘:obj
}

4、把字符串转换为化成驼峰格式,如-webkit-border-image 转换后的结果为 webkitBorderImage。

// 注意(?!^)的使用,表示不以……开头
// replace方法的第二个参数为函数,函数的a表示完整匹配,b、c表示匹配到的子表达式
function convertToUpper(str){
    return str.replace(/(?!^)-(\w)(\w+)/g, function(a,b,c){
        return b.toUpperCase()+c.toLowerCase()
    }).replace(/-/g,‘‘)
}

5、数组去重,可以使用IndexOf方法或利用对象的key不能重复的特性来做。

// 创建一个新数组,通过判断索引的方法去重,元素不存在时,indexOf返回-1
function arryUniq(arr){
    var uniq = []
    arr.forEach(function(item){
        if(uniq.indexOf(item) < 0){
            uniq.push(item)
        }
    })
    return uniq
}
// 对象的key值不能重复
function arryUniq(arr){
    var obj = {}
    var uniq = []
    arr.forEach(function(item){
        if(!obj[item]){
            obj[item] = true
            uniq.push(item)
        }
    })
    return uniq
}

原文地址:https://www.cnblogs.com/i-Leo/p/9283043.html

时间: 2024-08-30 15:58:08

前端经典面试题-代码的相关文章

前端经典面试题:如何理解 HTML 语义化?

本文最初于 2018-09-21 发布于 知乎 ,后在 <重学前端> 专栏的学习中,重新复习整理,发布于 Github 上,并计划写一系列前端学习相关的文章.欢迎 star . HTML 语义化 简单来说,我们可以理解为:用正确的标签做正确的事情. 例如: 段落用 p 标签,标题用 h 系列标签,边栏用 aside 标签,主要内容用 main 标签.正确使用语义标签可以带来很多好处. 为什么要关注 HTML 语义化?(为什么要使用语义类标签?) 对人: 增强可读性,对开发者更友好,在没有 CS

Web前端经典面试试题(三)

一. 什么是Ajax??? 术语Ajax用来描述一组技术,它使浏览器可以为用户提供更为自然的浏览体验. Ajax它是"Asynchronous JavaScript + XML的简写" 定义Ajax: Ajax不是一种技术.实际上,它由几种蓬勃发展的技术以新的强大方式组合而成.Ajax包含: * 基于XHTML和CSS标准的表示: * 使用Document Object Model进行动态显示和交互: * 使用XMLHttpRequest与服务器进行异步通信: * 使用JavaScri

【前端经典面试题】前后端分离(说一说你理解的前后端分离?)

前言:昨晚面试遇到了这个问题,既然遇到了,找些资料来一起做个总结吧. 1.对前后端分离的误解  在回答这个问题的时候不要钻到某个具体的技术 ,或者某个具体的框架上面→比如ajax异步请求.vue或react等组件化的开发框架.再或者rest接口规范.API接口数据约定等.从某个具体的技术切入来回答对前后端分离的理解本身就是一种局限的看法,所以在回答这个问题的时候应该从以下几个方面展开. 2.为什么要分离?  在以往的很长一段时间里,后端开发才是开发团队里的核心,前端开发往往仅由一小撮人甚至交给后

前端经典面试题解密:JS的new关键字都干了什么?

前言 new关键字在实例化获取对象时都做了什么?是一道经常出现在前端面试时的问题.如果只是简单的了解new关键字是实例化构造函数获取对象,是万万不能够的.更深入的层级发生了什么呢?同时面试官想从这道题里面考察什么呢?下面胡哥为各位小伙伴一一来解密. 一.new关键字 new关键字的作用:通过new关键字实例化构造函数,获取对象.说一千道一万,不如来段代码看一看 // 定义构造函数 function Person (name, age) { this.name = name this.age =

微信牛牛平台日租搭建技巧 web前端经典面试题如何应对

一.javascript 基础(es5) 1.原型:这里可以谈很多,只要围绕 [[ prototype ]] 谈,都没啥问题2.闭包:牵扯作用域,可以两者联系起来一起谈3.作用域:词法作用域,动态作用域(微信牛牛平台日租搭建Q-2189563389 代码<?13182926751>)4.this:不同情况的调用,this 指向分别如何.顺带可以提一下 es6 中箭头函数没有 this, arguments, super 等,这些只依赖包含箭头函数最接近的函数5.call,apply,bind

前端经典面试题

1.请说出==和===的区别? 答:== 判断内容是否相等 不比较类型 console.log (1 == "1") ;  true ===判断内容相等  且类型也相等 console.log (1 === "1") ;  false 2.行级元素有哪些?块级元素有哪些?行级元素如何转换成块级元素? 块级元素:div, dl, form, h1, h2, h3, h4, h5, h6, hr, p, ul, table 行内元素:br, em, i, img, in

大公司移动前端开发面试题——做转盘[参考代码]

题目在此 http://www.cnblogs.com/arfeizhang/p/turntable.html 这几天一直在忙,终于找到时间把参考代码放出来了.大家参考一下. 参考代码考虑到让入行不久的前端也看得懂,没有进行封装.变量名也没有进行简写,尽量一看就明白. 图片随手在网上截的,也许没有对准圆心.这段代码只考虑了webkit内核的浏览器,没做兼容.重在让大家弄懂原理. :P 如果感到有些卡帧,可能是转盘图片带来的效果.在调试器上试过,能维持50-60帧,流畅度还是让人满意的.在LG G

.NET 经典面试题

微软.NET 经典面试题 1.  OO 面向对象的语言具有的三大特性:________性._________性.________性 答:封装.继承.多态. 2.  什么是多态?C#如何支持多态? 多态指的是多种行为.C#可以通过方法重载以及方法重写实现多态. 3.  C#中能用 foreach 遍历访问的对象需要实现 ________________接口或声明 ________________方法的类型. 答:IEnumerable . GetEnumerator. 4.  垃圾收集器 GC 作

jQuery经典面试题精选

jQuery是一款非常流行的Javascript框架,如果你想要从事Web前端开发这个岗位,那么jQuery是你必须掌握而且能够熟练应用的一门技术. 本文整理了一些关于jQuery的经典面试题及答案,分享给正要面试Web开发岗位的同学.当然可以学习网页前端教程(div+css+jquery)教程了解更多前端知识. 问题:jQuery的美元符号$有什么作用? 回答:其实美元符号$只是”jQuery”的别名,它是jQuery的选择器,如下代码: $(document).ready(function(