2024年9月正则表达式js面试题（面试题汇总-JS篇01）

　　⑴正则表达式js面试题（面试题汇总-JS篇

　　⑵场景：varstr=“helloworld!”a.str.char()//返回指定下标的值Str.char()//”l”b.Str.indexOf()//返回指定值的下标Str.indexOf(‘e’)//’’c.Str.lastIndexOf()//返回最后指定值的下标Str.lastIndexOf(‘l’)//’’d.Str.concat()//拼接字符串Str.concat(“motherfuck!”)//”helloworld!motherfuck!”Console.log(str)//”helloworld!”e.Str.substr(n,m)//从n开始截取m个字符Str.substr(,)//’el’f.Str.substring(n,m)//从n开始m结束截取字符串，不包含mStr.substring(,)//”world”g.Str.slice(n,m)//同substring，slice可以截取数组，substring不能截取数组Str.slice(,)//”world”h.Str.split//返回数组Str.split(‘’)//Str.aplit(‘l’)//i.Str.replace()//以下三个方法都是通过正则表达式对原字符串进行更改的j.Str.match()k.Str.search()场景：constobj={x:,y:}Constobj={x:,z:,fn:{number:}}a.Object.assign()//合并对象，实行的是浅拷贝Object.assign(obj,obj)Console.log(obj)//{x:,y:,z:,fn:{number:}}b.Object.create()//新建一个对象，可以使用原型链继承VarnewObj=Object.create(obj,{newValue:‘newAdd’})Console.log(newObj)//{newValue:‘newAdd’}Console.log(newObj.x)//c.Object.defineProperties()//往对象里面添加或修改新属性，值类型Object.defineProperties(obj,{name:{value:‘欧’}})//添加属性Console.log(obj)//{x:,y:,name:‘欧’}Object.defineProperties(obj,{name:{value:‘林’,writable:true}})//修改属性Console.log(obj)//{x:,y:,name:‘林’}d.Object.defineProperty()//往对象里面添加新属性，可以是引用类型Object.defineProperty(obj,‘name’,{value:function(){return‘欧’}})Console.log(obj.name())//’欧’e.Object.keys()//返回对象所有key，以数组类型输出Console.log(Object.keys(obj))//f.Object.values()//返回对象所有的value，以数组类型输出Console.log(Object.values(obj))//场景：vararr=newarray(,,)a.push()//向数组尾部添加元素arr.push()console.log(arr)//b.unshift()//向数组头部添加元素arr.unshift()console.log(arr)//c.pop()//删除数组尾部的元素arr.pop()console.log(arr)//d.shift()//删除数组头部的元素arr.shift()console.log(arr)//e.indexOf()//返回指定元素的下标arr.indexOf()//f.slice(n,m)//从n开始m结束截取数组，不包括m,此方法不会更改元数组console.log(arr.slice(,))//console.log(arr)//g.splice()//删除数组指定元素arr.splice()//删除从下标开始到最后的所有元素console.log(arr)//arr.splice(,)//删除从下标开始往后的个元素console.log(arr)//arr.splice(,,,)//删除从下标开始往后个元素并用,替代console.log(arr)//h.reverse()//数组翻转arr.reverse()console.log(arr)//i.sort()//从小到大排序数组arr.sort()console.log(arr)//j.forEach()//以下提供了几种遍历的方法k.map()l.filter()//数组过滤，如果数组的元素的对象，可以通过对象的属性名来过滤元素，用法跟C#的Linq一样。varnewArr=console.log(newArr.filter(item=》item.id===))//console.log(newArr)//m.every()n.some()o.find()p.findIndex()增删改查场景：《divclass=”div”id=”div”》《/div》a.document.createElement()//创建节点varnewDiv=document.createElement()b.document.craeteTextNode()//创建文本节点varnewDivText=document.craeteTextNode(‘这是新创建的节点’)c.div.appendChild()//向节点添加最后一个子节点newDiv.appendChild(newDivText)d.document.getElementById()//通过Id获取节点vardiv=document.getElementById(‘div’)e.div.parentNode//获取父节点f.div.childNode//获取子节点，返回一个集合varchild=div.childNodesg.div.nextSibling，div.previousSibling，div.firstChild，div.lastChild分别为，获取下一个兄弟节点，上一个兄弟节点，第一个子节点，最后一个子节点。h.div.insetBefore()//插入到特定位置div.insetBefore(newDiv,null)//插入到最后，跟appendchild用法一样div.insetBefore(newDiv,div.firstChild)//插入到第一个子节点之前div.insetBefore(newDiv,div.lastChild)//插入到最后节点之前i.div.replaceChild()//替换节点div.replaceChild(newDiv,div.firstChild)//替换第一个子节点，原节点会被删除j.div.removeChild()//删除子节点k.cloneNode(true/false)//克隆节点，true为深克隆，false为浅克隆l.document.querySelector(),document.querySelectorAll()//通过css选择器搜索匹配的节点，querySelector返回匹配的第一个节点，querySelectorAll返回所有节点document.querySelector(‘div.div’)//返回class为div的div标签节点document.querySelector(‘#div’)//返回id为div的节点m.document.getElementsByTagName(),document.getElementsByName(),document.getElementsByClassName()//返回符合需求的集合n.div.setAttribute()//给元素添加属性div.setAttribute(‘name’:‘div’)o.removeAttribute(),getAttribute(),hasAttribute()//各种操作属性的方法

　　⑶小白准备转行学习前端，有大神可以提一些建议吗

　　⑷学习是以兴趣为前提的，你要对你所要学的内容产生兴趣，这样你才会花心思去学习。这和是不是小白没关系的，对于小白而言，在学习过程中就需要更努力，多花时间和心思没有什么是学不会的。

　　⑸作为一个初学者，你必须明确系统的学习方案，我建议一定有一个指导的人，全靠自己学，放弃的几率非常大，在你对于web前端还没有任何概念的时候，需要一个人领进门，之后就都靠自己钻研，第一步就是确定web前端都需要哪些内容，并且在多少时间内学完，建议时间个月保底。

　　⑹视频为主，书为辅。很多初学者在学习前端的时候非常喜欢去买书，但是最后的结果是什么？看来看去什么都不会写，所以在这里给大家提醒，书可以看，但是是在建立于你已经对于某个知识点有了具体操作的执行后，在用书去巩固概念，这样更加利于你对于知识的理解。

　　⑺对于学习技术来讲，掌握一个学习方法是非常重要的，其实对于学习web前端来讲，学习方法确实很多都是相通的，一旦学习方法不对，可能就会造成“方法不对，努力白费”。其实关于这方面还是很多的，我就简单说个例子，有的人边听课边跟着敲代码，这样就不对，听课的时候就专心听，做题的时候就专心做题，这都是过来人的经验，一定要听。根据每个人的不同，可能学习方法也会有所出路，找到适合你自己的学习法方法是学习的前提。

　　⑻不建议自己一个人瞎学，在我了解学习编程的这些人来看，从零基础开始学并且最后成功做这份工作的其实并没有几个，我觉得大部分原因就是因为他们都不了解web前端是干什么的，学什么的，就盲目的买书看，到处找视频看，最后看着看着就放弃了，所以我建议初学者在没有具体概念之前，还是找有经验的人请教一下，聊过之后你就会知道web前端具体是干什么的，该怎么学，这是我个人的小建议，可以不采纳。

　　⑼第阶段：前端页面重构(周)

　　⑽内容包含了：(PC端网站布局项目、HTML+CSS基础项目、WebApp页面布局项目)

　　⑾第阶段：JavaScript高级程序设计(周)

　　⑿内容包含：(原生JavaScript交互功能开发项目、面向对象进阶与ES/ES应用项目、JavaScript工具库自主研发项目)

　　⒀第阶段：PC端全栈项目开发(周)

　　⒁内容包含：(jQuery经典交互特效开发、HTTP协议、Ajax进阶与PHP/JAVA开发项目、前端工程化与模块化应用项目、PC端网站开发项目、PC端管理信息系统前端开发项目)

　　⒂第阶段：移动端项目开发(周)

　　⒃内容包含：(Touch端项目、微信场景项目、应用Angular+Ionic开发WebApp项目、应用Vue.js开发WebApp项目、应用React.js开发WebApp项目)

　　⒄第阶段：混合(Hybrid,ReactNative)开发(周)

　　⒅内容包含：(微信小程序开发、ReactNative、各类混合应用开发)

　　⒆第阶段：NodeJS全栈开发(周)

　　⒇内容包括：(WebApp后端系统开发、一、NodeJS基础与NodeJS核心模块二、Express三、noSQL数据库)

　　⒈如果你对于学习前端有任何不懂的可以随时来问我，如果没有比较好的教程，也可以问我要。

　　⒉经典的Web前端或者JavaScript面试笔试题有哪些

　　⒊不定项选择题（每题分，共分.声明一个对象，给它加上name属性和show方法显示其name值，以下代码中正确的是（DA.varobj=;B.varobj={name:”zhangsan”,show:”alert(this.name)”};C.varobj={name:”zhangsan”,show:function(){alert(name);}};D.varobj={name:”zhangsan”,show:function(){alert(this.name);}};.以下关于Array数组对象的说法不正确的是（CDA.对数组里数据的排序可以用sort函数，如果排序效果非预期，可以给sort函数加一个排序函数的参数B.reverse用于对数组数据的倒序排列C.向数组的最后位置加一个新元素，可以用pop方法D.unshift方法用于向数组删除第一个元素.要将页面的状态栏中显示“已经选中该文本框”，下列JavaScript语句正确的是（AA.window.status=”已经选中该文本框”B.document.status=”已经选中该文本框”C.window.screen=”已经选中该文本框”D.document.screen=”已经选中该文本框”.点击页面的按钮，使之打开一个新窗口，加载一个网页，以下JavaScript代码中可行的是（ADA.《inputtype=”button”value=”new”onclick=”open(‘new.html’,‘_blank’)”/》B.《inputtype=”button”value=”new”onclick=”window.location=’new.html’;”/》C.《inputtype=”button”value=”new”onclick=”location.assign(‘new.html’);”/》D.《formtarget=”_blank”action=”new.html”》《inputtype=”submit”value=”new”/》《/form》.使用JavaScript向网页中输出《h》hello《/h》，以下代码中可行的是（BDA.《scripttype=”text/javascript”》document.write(《h》hello《/h》);《/script》B.《scripttype=”text/javascript”》document.write(“《h》hello《/h》”);《/script》C.《scripttype=”text/javascript”》《h》hello《/h》《/script》D.《h》《scripttype=”text/javascript”》document.write(“hello”);《/script》《/h》.分析下面的代码：《html》《head》《scripttype=”text/javascript”》functionwriteIt(value){document.myfm.first_text.value=value;}《/script》《/head》《bodybgcolor=”#ffffff”》《formname=”myfm”》《inputtype=”text”name=”first_text”》《inputtype=”text”name=”second_text”》《/form》《/body》《/html》以下说法中正确的是（CDA.在页面的第二个文本框中输入内容后，当鼠标离开第二个文本框时，第一个文本框的内容不变B.在页面的第一个文本框中输入内容后，当鼠标离开第一个文本框时，将在第二个文本框中复制第一个文本框的内容C.在页面的第二个文本框中输入内容后，当鼠标离开第二个文本框时，将在第一个文本框中复制第二个文本框的内容D.在页面的第一个文本框中输入内容后，当鼠标离开第一个文本框时，第二个文本框的内容不变.下面的JavaScript语句中，（D实现检索当前页面中的表单元素中的所有文本框，并将它们全部清空A.for(vari=;i《form.elements.length;i++){if(form.elements.type==”text”)form.elements.value=”“;}B.for(vari=;i《document.forms.length;i++){if(forms.elements.type==”text”)forms.elements.value=”“;}C.if(document.form.elements.type==”text”)form.elements.value=”“;D.for(vari=;i《document.forms.length;i++){for(varj=;j《document.forms.elements.length;j++){if(document.forms.elements.type==”text”)document.forms.elements.value=”“;}}.在表单(form)中有一个文本框元素(fname)，用于输入电话号码，格式如：-，要求前位是，紧接一个“-”，后面是位数字。要求在提交表单时，根据上述条件验证该文本框中输入内容的有效性，下列语句中，（A能正确实现以上功能A.varstr=form.fname.value;if(str.substr(,)!=”-”||str.substr().length!=||isNaN(parseFloat(str.substr())))alert(“无效的电话号码！”);B.varstr=form.fname.value;if(str.substr(,)!=”-”&&str.substr().length!=&&isNaN(parseFloat(str.substr())))alert(“无效的电话号码！”);C.varstr=form.fname.value;if(str.substr(,)!=”-”||str.substr().length!=||isNaN(parseFloat(str.substr())))alert(“无效的电话号码！”);D.varstr=form.fname.value;if(str.substr(,)!=”-”&&str.substr().length!=&&!isNaN(parseFloat(str.substr())))alert(“无效的电话号码！”);.关于正则表达式声明位数字的邮编，以下代码正确的是（CA.varreg=/d/;B.varreg=d{};C.varreg=/d{}/;D.varreg=newRegExp(“d{}”);.关于JavaScript里的xml处理，以下说明正确的是（BCDA.Xml是种可扩展标记语言，格式更规范，是作为未来html的替代B.Xml一般用于传输和存储数据，是对html的补充，两者的目的不同C.在JavaScript里解析和处理xml数据时，因为浏览器的不同，其做法也不同D.在IE浏览器里处理xml，首先需要创建ActiveXObject对象二、问答题.列举浏览器对象模型BOM里常用的至少个对象，并列举window对象的常用方法至少个（分对象：Windowdocumentlocationscreenhistorynavigator方法：Alert()confirm()prompt()open()close().简述列举文档对象模型DOM里document的常用的查找访问节点的方法并做简单说明（分Document.getElementById根据元素id查找元素Document.getElementByName根据元素name查找元素Document.getElementTagName根据指定的元素名查找元素三、程序题、补充按钮事件的函数，确认用户是否退出当前页面，确认之后关闭窗口；（分《html》《head》《scripttype=”text/javascript”》functioncloseWin(){//在此处添加代码if(confirm(“确定要退出吗？”)){window.close();}}《/script》《/head》《body》《inputtype=”button”value=”关闭窗口”onclick=”closeWin()”/》《/body》《/html》、写出简单描述html标签（不带属性的开始标签和结束标签的正则表达式，并将以下字符串中的html标签去除掉（分varstr=“《div》这里是div《p》里面的段落《/p》《/div》”;//《scripttype=”text/javascript”》varreg=/《/?w+/?》/gi;varstr=“《div》这里是div《p》里面的段落《/p》《/div》”;alert(str.replace(reg,”“));《/script》、完成foo()函数的内容，要求能够弹出对话框提示当前选中的是第几个单选框。（分《html》《head》《meta《/select》《/body》

　　⒋web前端面试题二（Keeplive、V-show和v-if的区别、同源策略及跨域

　　⒌在vue中，我们使用ponent内置组件或者vue-router切换视图的时候，由于vue会主动卸载不使用的组件，所以我们不能保存组件之前的状态，而我们经常能遇到需要保存之前状态的需求，例如：搜索页（保存搜索记录，列表页（保存之前的浏览记录等等。????????????Keep-alive是一个vue的内置组件，它能将不活动的组件保存下来，而不是直接销毁，当我们再次访问这个组件的时候，会先从keep-alive中存储的组件中寻找，如果有缓存的话，直接渲染之前缓存的，如果没有的话，再加载对应的组件。????????????作为抽象组件，keep-alive是不会直接渲染在DOM中的。????????Keep-alive提供了三种可选属性????????Include-字符串或数组或正则表达式。只有名称匹配的组件被缓存。????????Exclude-字符串或数组或正则表达式。名称匹配的组件不会被缓存。????????Max-数字类型。表示最多可以缓存多少组件实例。????????Keep-alive提供了两个生命钩子，分别是activated与deactivated。????????因为Keep-alive会将组件保存在内存中，并不会销毁以及重新创建，所以不会重新调用组件的created等方法，需要用activated与deactivated这两个生命钩子来得知当前组件是否处于活动状态。????????V-show有较高的渲染成本，????????V-if有较高的切换成本。????????V-if是真正的条件渲染，确保切换过程中条件内的事件监听器和子组件适当的被销毁和重建。????????V-show的元素始终被渲染并保存在dom中，操作的只是display属性控制演示影藏。????????源（origin——就是协议、域名和端口号。若地址里面的协议、域名和端口号均相同则属于同源。????????同源策略——同源策略是浏览器的一个安全功能，不同源的客户端脚本在没有明确授权的情况下，不能读写对方资源。所以a.下的js脚本采用ajax读取b.里面的文件数据是会报错的。????不受同源策略限制的????????????.页面中的链接，重定向以及表单提交是不会受到同源策略限制的。????????????.跨域资源的引入是可以的。但是js不能读写加载的内容。如嵌入到页面中的《scriptsrc=等。???跨域——只要协议、域名、端口号有一个不同就是跨域。????跨域的原因？（只做了解跨域问题来源于JavaScript的同源策略，即只有协议+主机名+端口号(如存在)相同，则允许相互访问。为了防止某域名下的接口被其他域名下的网页非法调用，是浏览器对JavaScript施加的安全限制。也就是说JavaScript只能访问和操作自己域下的资源，不能访问和操作其他域下的资源。跨域问题是针对JS和ajax的，html本身没有跨域问题，比如a标签、script标签、甚至form标签（可以直接跨域发送数据并接收数据等。????、Jsonp——????????????????利用script标签可跨域的特点，在跨域脚本中可以直接回调当前脚本的函数。jsonp是一种常用的跨域手段，和反向代理，服务端做跨域处理相比，jsonp更显得方便轻巧?jsonp的缺点只能发送get请求。因为script只能发送get请求需要后台配合。此种请求方式应该前后端配合，将返回结果包装成callback(result)的形式。????、Cors——????????????????服务器设置HTTP响应头中Aess-Control-Allow-Origin值，解除跨域限制。CORS是一个WC标准,全称是“跨域资源共享“（Cross-originresourcesharing，他允许浏览器向跨源服务器发送XMLHttpRequest请求，从而克服AJAX只能同源使用的限制????????????????缺点是：目前所有最新浏览器都支持该功能，但是万恶的IE不能低于Aess-Control-Allow-Origin这个字段是必须的,表示接受那些域名的请求(*为所有)、Aess-Control-Allow-Credentials该字段可选,表示是否可以发送cookie、Aess-Control-Expose-Headers该字段可选,XHMHttpRequest对象的方法只能够拿到六种字段:Cache-Control、Content-Language、Content-Type、Expires、Last-Modified、Pragma,如果想拿到其他的需要使用该字段指定。????、反向代理（ReverseProxy{前端独立就能解决的跨域方案}——????指以代理服务器来接受inter上的连接请求，然后将请求转发给内部网络上的服务器，并将从服务器上得到的结果返回给inter上请求连接的客户端，此时代理服务器对外就表现为一个反向代理服务器。

　　⒍前端开发工程师面试题

　　⒎前端开发工程师面试题

　　⒏下面代码的输出值是?

　　⒐正则表达式匹配，开头为N,N或NNN，后面是--个数字的电话号码。

　　⒑写出下面代码的`输出值：

　　⒒b:function(){console.log(this.a)}

　　⒓varobjb=obj.b;

　　⒔obj.b.call(window);

　　⒕写出下列代码的输出值：

　　⒖functionA(){

　　⒗functionB(a){

　　⒘functionC(a){

　　⒙A.prototype.a=;

　　⒚B.prototype.a=;

　　⒛C.prototype.a=;

　　console.log(newA());

　　console.log(newB());

　　console.log(newC());

　　写出下列代码的输出值：

　　functionb(){

　　functionc(){

　　console.log(a);

　　写出下列代码在各个浏览器中的颜色值?

　　background:red;

　　_background:green;

　　*background:blue;

　　background:black;

　　添加些css让其水平垂直居中。

　　如下代码，在空白处填写代码，是其点击时，前景色为白色，背景色为黑色。

　　书写代码，点击时从分钟开始，每秒递减到。

　　简述在IE下mouseover和mouseenter的区别?

　　一道面试题你有个朋友生病在家，你带着礼物前去看望，偏巧在楼道里遇见了你领导的爱人，对方以为你是来看

　　要回礼物来的话，双方都会尴尬，可以先去领导家坐一会，和领导汇报一下工作，若领导不在家，就和夫人说改天再来，然后提及自己的一个朋友病了，要去看望，出来后，再买礼物去看朋友

　　web前端面试经常问到的面试题有哪些

　　Web前端经常被问到的面试题及答案

　　对WEB标准以及WC的理解与认识

　　标签闭合、标签小写、不乱嵌套、提高搜索机器人搜索几率、使用外链css和js脚本、结构行为表现的分离、文件下载与页面速度更快、内容能被更多的用户所访问、内容能被更广泛的设备所访问、更少的代码和组件，容易维护、改版方便，不需要变动页面内容、提供打印版本而不需要复制内容、提高网站易用性;

　　xhtml和html有什么区别

　　HTML是一种基本的WEB网页设计语言，XHTML是一个基于XML的置标语言

　　XHTML元素必须被正确地嵌套。

　　XHTML元素必须被关闭。

　　标签名必须用小写字母。

　　XHTML文档必须拥有根元素。

　　Doctype?严格模式与混杂模式-如何触发这两种模式，区分它们有何意义?

　　用于声明文档使用那种规范(html/Xhtml)一般为严格过度基于框架的html文档

　　加入XMl声明可触发，解析方式更改为IE.拥有IE.的bug

　　行内元素有哪些?块级元素有哪些?CSS的盒模型?

　　块级元素：divphhhhformul

　　行内元素:abbrispaninputselect

　　Css盒模型:内容，border,margin，padding

　　CSS引入的方式有哪些?link和import的区别是?

　　前者无兼容性，后者CSS.以下浏览器不支持

　　Link支持使用javascript改变样式，后者不可

　　CSS选择符有哪些?哪些属性可以继承?优先级算法如何计算?内联和important哪个优先级高?

　　标签选择符类选择符id选择符

　　继承不如指定Id》class》标签选择

　　前端页面有哪三层构成，分别是什么?作用是什么?

　　结构层Html表示层CSS行为层js

　　css的基本语句构成是?

　　选择器{属性:值;属性:值;……}

　　你做的页面在哪些流览器测试过?这些浏览器的内核分别是什么?

　　Ie(Ie内核)火狐(Gecko)谷歌(webkit)opear(Presto)

　　Javascript

　　javascript的typeof返回哪些数据类型

　　Objectnumberfunctionbooleanunderfind

　　例举种强制类型转换和种隐式类型转换?

　　强制(parseInt,parseFloat,number)

　　隐式(==–===)

　　split()join()的区别

　　前者是切割成数组的形式，后者是将数组转换成字符串

　　数组方法pop()push()unshift()shift()

　　Push()尾部添加pop()尾部删除

　　Unshift()头部添加shift()头部删除

　　事件绑定和普通事件有什么区别

　　IE和DOM事件流的区别

　　IE和标准下有哪些兼容性的写法

　　Varev=ev||window.event

　　document.documentElement.clientWidth||document.body.clientWidth

　　Vartarget=ev.srcElement||ev.target

　　ajax请求的时候get和post方式的区别

　　一个在url后面一个放在虚拟载体里面

　　应用不同一个是论坛等只需要请求的，一个是类似修改密码的

　　call和apply的区别

　　Object.call(this,obj,obj,obj)

　　Object.apply(this,arguments)

　　ajax请求时，如何解释json数据

　　使用evalparse鉴于安全性考虑使用parse更靠谱

　　写一个获取非行间样式的函数

　　functiongetStyle(obj,attr,value)

　　if(!value)

　　if(obj.currentStyle)

　　returnobj.currentStyle(attr)

　　obj.getputedStyle(attr,false)

　　obj.style=value

　　有哪些经典的Web前端或者JavaScript面试笔试题

　　JavaScript面试题:字符串处理在应聘前端程序员时，在笔试部分经常会考到字符串处理的问题。这些题有一个特点，站在考官的角度去考虑，它考的不是你会不会，而是你能不能在不借用XX手册或者XX指南再或者百度谷歌的情况下，用比较简洁的方式写出答案来。就具体的字符串处理问题，郑州尚学堂给大家分享一下。、字符串转换字符串转换是最基础的要求和工作，你可以将任何类型的数据都转换为字符串，你可以用下面三种方法的任何一种：varnum=;//varmyStr=num.toString();//““你同样可以这么做：varnum=;//varmyStr=String(num);//““或者，再简单点儿：varnum=;//varmyStr=““+num;//““、字符串分割字符串分割，即将一个字符串分割为多个字符串，JavaScript中给我们提供了一个非常方便的函数，如：varmyStr=“I,Love,You,Do,you,love,me“;varsubstrArray=myStr.split(“,“);//;vararrayLimited=myStr.split(“,“,);//;split()的第二个参数，表示返回的字符串数组的最大长度。、获取字符串长度字符串长度是在开发中经常要用到的，非常简单如下：varmyStr=“I,Love,You,Do,you,love,me“;varmyStrLength=myStr.length;//、查询子字符串很多人都会忘记这几个JavaScript的自带的方法，或者忘记它们的具体用法，从而导致在做题的时候不得不嵌套for循环来做。第一个函数：indexOf()，它从字符串的开头开始查找，找到返回对应坐标，找不到返回-，如下：varmyStr=“I,Love,you,Do,you,love,me“;varindex=myStr.indexOf(“you“);//,基于开始,找不到返回-第二个函数：lastIndexOf()，它从字符串的末尾开始查找，找到返回对应坐标，找不到返回-，如下：varmyStr=“I,Love,you,Do,you,love,me“;varindex=myStr.lastIndexOf(“you“);//以上两个函数同样接收第二个可选的参数，表示开始查找的位置。、字符串替换单单查到字符串应该还不会停止，一般题目都还经常会遇到让你查到并替换为你自己的字符串，例如：varmyStr=“I,love,you,Do,you,love,me“;varreplacedStr=myStr.replace(“love“,“hate“);//“I,hate,you,Do,you,love,me“默认只替换第一次查找到的，想要全局替换，需要置上正则全局标识，如：varmyStr=“I,love,you,Do,you,love,me“;varreplacedStr=myStr.replace(/love/g,“hate“);//“I,hate,you,Do,you,hate,me“、查找给定位置的字符或其字符编码值想要查找给定位置的字符，你可以使用如下函数：varmyStr=“I,love,you,Do,you,love,me“;vartheChar=myStr.charAt();//“o“,同样从开始同样，它的一个兄弟函数就是查找对应位置的字符编码值，如：varmyStr=“I,love,you,Do,you,love,me“;vartheChar=myStr.charCodeAt();//、字符串连接字符串连接操作可以简单到用一个加法运算符搞定，如：varstr=“I,love,you!“;varstr=“Do,you,love,me?“;varstr=str+str+“Yes!“;//“I,love,you!Do,you,love,me?Yes!“同样，JavaScript也自带了相关的函数，如：varstr=“I,love,you!“;varstr=“Do,you,love,me?“;varstr=str.concat(str);//“I,love,you!Do,you,love,me?“其中concat()函数可以有多个参数，传递多个字符串，拼接多个字符串。、字符串切割和提取有三种可以从字符串中抽取和切割的方法，如：第一种，使用slice():varmyStr=“I,love,you,Do,you,love,me“;varsubStr=myStr.slice(,);//“,lov“第二种，使用substring():varmyStr=“I,love,you,Do,you,love,me“;varsubStr=myStr.substring(,);//“,lov“第三种，使用substr():varmyStr=“I,love,you,Do,you,love,me“;varsubStr=myStr.substr(,);//“,love“与第一种和第二种不同的是，substr()第二个参数代表截取的字符串最大长度，如上结果所示。、字符串大小写转换常用的转换为大写或者小写字符串函数，如下：varmyStr=“I,love,you,Do,you,love,me“;varlowCaseStr=myStr.toLowerCase();//“i,love,you,do,you,love,me“;varupCaseStr=myStr.toUpperCase();//“I,LOVE,YOU,DO,YOU,LOVE,ME“、字符串匹配字符串匹配可能需要你对正则表达式有一定的了解，先来看看match()函数：varmyStr=“I,love,you,Do,you,love,me“;varpattern=/love/;varresult=myStr.match(pattern);//console.log(result.index);//console.log(result.input);//I,love,you,Do,you,love,me如你所见，match()函数在字符串上调用，并且接受一个正则的参数。来看看第二个例子，使用exec()函数：varmyStr=“I,love,you,Do,you,love,me“;varpattern=/love/;

　　第一阶段：HTML+CSS+JS基础（HTML+CSS:HTML进阶、CSS进阶、DIV+CSS布局、HTML+CSS整站开发、（JavaScript基础：Js基础教程、js内置对象常用方法、常见DOM树操作大全、ECMAscript、DOM、BOM、定时器和焦点图。（JS基本特效：常见特效、例如：tab、导航、整页滚动、轮播图、JS制作幻灯片、弹出层、手风琴菜单、瀑布流布局、滚动事件、滚差视图。程序猿的生活：前端只需要掌握这些，你也能拿K！（（附简历模板份最完整面试题含答案赞同·评论文章（JS高级特征：正则表达式、排序算法、递归算法、闭包、函数节流、作用域链、基于距离运动框架、面向对象基础、（JQuery：基础使用悬着器、DOM操作、特效和动画、方法链、拖拽、变形、JQueryUI组件基本使用。第二阶段：HTML和移动Web开发（HTML：HTML新语义标签、HTML表单、音频和视频、离线和本地存储、SVG、WebSocket、Canvas.（CSS:CSS新选择器、伪元素、脸色表示法、边框、阴影、flex布局、background系列属性改变、Transition、动画、景深和深透、D效果制作、Velocity.js框架、元素进场、出场策略、炫酷CSS网页制作。（Bootstrap:响应式概念、媒体查询、响应式网站制作、删格系统、删格系统原理、Bootstrap常用模板、LESS和SASS。（移动Web开发：跨终端WEB和主流设备简介、视口、流式布局、弹性盒子、rem、移动终端JavaScript事件、手机中常见JS效果制作、手机聚划算页面、手机滚屏。第三阶段：HTTP服务和AJAX编程（WEB服务器基础：服务器基础知识、Apache服务器和其他WEB服务器介绍、Apache服务器搭建、HTTP介绍。（AJAX上篇：Ajax简介和异步的概念、Ajax框架的封装、XMLHttpRequest对象详细介绍方法、兼容性处理方法、Ajax框架的封装、Ajax中缓存问题、XML介绍和使用、会处理简单的GET或者POST请求、（AJAX下篇：JSON和JSON解析、数据绑定和模板技术、JSONP、跨域技术、图片预读取和lazy-load技术、JQuery框架中的AjaxAPI、使用Ajax实现爆布流案例额。程序猿的生活：打造全网web前端全栈资料库（总目录看完学的更快，掌握的更加牢固，你值得拥有（持续更新赞同·评论文章第四阶段：面向对象进阶（面向对象终极篇：从内存角度到理解JS面向对象、基本类型、复杂类型、原型链、ES中的面向对象、ES中变量的作用域（let，const(声明变量只读)，块级作用域，ES中函数新特性。（面向对象三大特征：继承性、多态性、封装性。（面向对象中创建对象的五种方法：自定义对象、工厂模式创建对象、构造函数、混合模式创造对象、JSO格式创建对象。第五阶段：封装一个属于自己的框架（框架封装基础：事件流、冒泡、捕获、事件对象、事件框架、选择框架。（框架封装中级：运动原理、单物体运动框架、多物体运动框架、运动框架面向对象封装。（框架封装高级和补充：JQuery框架雏形、可扩展性、模块化、封装属于传智自己的框架。第六阶段：模块化组件开发（面向组件编程：面向组件编程的方式、面向组件编程的实现原理、面向组件编程实战、基于组件化思想开发网站应用程序。（面向模块编程：AMD设计规范、CMD设计规范、RequireJS，LoadJS、淘宝的SeaJS。第七阶段：主流的流行框架（Web开发工作流：GIT/SVN、Vue-cli脚手架、NPM/Bower依赖管理工具、Grunt/Gulp/Webpack。（前端主流框架：Vue.js、Angular.js、React.JS、Bootstrap。（常用库：React.js、Vue.js、JQuery.js。第八阶段:Node.js全栈开发：（快速入门：Node.js发展、生态圈、Io.js、Linux/Windows/OSX环境配置、REPL环境和控制台程序、异步编程，非阻塞I/O、模块概念，模块管理工具、开发流程，调试，测试。（核心模块和对象：全局对象globa