前端js面试题
JQ 常见选择器？
，号选择器，分组选择器。空格，祖父选择器。>大于号，父子选择器。+号选择器，紧接下一个兄弟选择器。~号，元素之后所有的 siblings 元素。
：first，：last，：not，：first-child，:last-child,:animated.：checked jQuery 插件实现方式，分别介绍？
jQuery.fn.extend 封装直接在$下面的方法，就是根下面，
扩展 jQuery 元素集来提供新的方法（通常用来制作插件）。
$.extend 用来在 jQuery 命名空间上增加新函数。用一个或多个其他对象来扩展一个对象，返回被扩展的对象
批量的方法用 fn，静态的用$.extend（），不建议用扩展到根下面。
bind 和live 的区别?
live 方法其实是 bind 方法的变种，其基本功能就同 bind 方法的功能是一样的，都是为一个元素绑定某个事件，但是 bind 方法只能给当前存在的元素绑定事件，对于事后采用 JS 等方式新生成的元素无效，而 live 方法则正好弥补了 bind 方法的这个缺陷，它可以对后生成的元素也可以绑定相应的事件.
js 和jq 如何转换？
jQuery 对象是通过 jQuery 包装 DOM 对象后产生的对象。jQuery 对象是 jQuery 独有的，其可以使用 jQuery 里的方法，但是不能使用 DOM 的方法；例如：$("#img").attr("src","test.jpg"); 这里的 $("#img")就是 jQuery 对象。
DOM 对象就是 Javascript 固有的一些对象操作。DOM 对象能使用 Javascript 固有的方法，但是不能使用 jQuery 里的方法。例如：
document.getElementById("img").src = “test.jpg"；这里的
document.getElementById("img") 就是 DOM 对象。
$("#img").attr("src","test.jpg"); 和 document.getElementById("img").src = "test.jpg"; 是等价的，是正确的，但是 $("#img").src = "test.jpg" ；或者document.getElementById("img").attr("src","test.jpg"); 都是错误的。
DOM 对象转成jQuery 对象
对于已经是一个 DOM 对象，只需要用 $() 把 DOM 对象包装起来，就可以获得一个
jQuery 对象了，$(DOM 对象)
如：var v = document.getElementById("v"); //DOM 对象
var $v = $(v); //jQuery 对象
转换后，就可以任意使用 jQuery 的方法。
jQuery 对象转成DOM 对象
两种转换方式讲一个 jQuery 对象转换成 DOM 对象： [index] 和 .get(index)；
(1) jQuery 对象是一个数据对象，可以通过 [index] 的方法，来得到相应的 DOM 对象。
如： var $v = $("#v"); //jQuery 对象
var v = $v[0]; //DOM 对象
alert(v.checked); //检测这个 checkbox 是否被选中
(2) jQuery 本身提供，通过.get(index) 方法得到相应的 DOM 对象
如：var $v = $("#v"); //jQuery 对象
var v = $v.get(0); //DOM 对象 ( $v.get()[0] 也可以 )
alert(v.checked); //检测这个 checkbox 是否被选中
通过以上方法，可以任意的相互转换 jQuery 对象和 DOM 对象，需要再强调的是：DOM 对象才能使用 DOM 中的方法，jQuery 对象是不可以使用ＤＯＭ中的方法
给出一个数组如何去掉重复的项？
实现一个把数组里面的重复元素去除的方法：
主要的是 Array 的 prototype 的方法。
var arr=[1,3,5,3,6,9,1,2,2]
var arr=['a','b','a','c','c','ab','bc']
function removeRepeat(arr){
var i,tmpArr=[];
for(i in arr){
if(tmpArr.join(',').indexOf(arr[i])==-1){
tmpArr.push(arr[i]);
}
}
return tmpArr;
}
var r=(arremoveRepeatr);
console.log(r);
二．方法：
Array.prototype.unique=function(){
var i,tmpArr=[];
for(i in this){
if(typeof this[i]!='function'){
if(tmpArr.join(',').indexOf(this[i])==-1){
tmpArr.push(this[i]);
}
}
}
return tmpArr;
}
var arr=['a','b','a','c','c','ab','bc'];
var r=arr.unique();
console.log(r);
js 如何实现面向对象？
var name = 'Chen Hao';
var email = 'haoel(@)https://www.360docs.net/doc/0414570002.html,';
var website = 'https://www.360docs.net/doc/0414570002.html,';
var chenhao = {
name : 'Chen Hao',
email : 'haoel(@)https://www.360docs.net/doc/0414570002.html,',
website : 'https://www.360docs.net/doc/0414570002.html,'
};
//以成员的方式 https://www.360docs.net/doc/0414570002.html,; chenhao.email; chenhao.website;
//以 hash map 的方式 chenhao["name"]; chenhao["email"];
chenhao["website"];
//我们可以看到，其用 function 来做 class。
var Person = function(name, email, website){
https://www.360docs.net/doc/0414570002.html, = name; this.email = email; this.website = website;
this.sayHello = function(){
var hello = "Hello, I'm "+ https://www.360docs.net/doc/0414570002.html, + "， \n" + "my email is: " + this.email + "， \n" + "my website is: " + this.website;
alert(hello);
};
};
var chenhao = new Person("Chen Hao", "haoel@https://www.360docs.net/doc/0414570002.html,",
"https://www.360docs.net/doc/0414570002.html,");
chenhao.sayHello();
Javascript 的数据和成员封装很简单。没有类完全是对象操作。纯动态！
Javascript function 中的 this 指针很关键，如果没有的话，那就是局部变量或局部函数。去找最紧跟的上一个 function。
Javascript 对象成员函数可以在使用时临时声明，并把一个全局函数直接赋过去就好了。
Javascript 的成员函数可以在实例上进行修改，也就是说不同实例相同函数名的行为不一定一样。
js 如何实现继承?
继承是指一个对象直接使用另一对象的属性和方法
实现方法：对象冒充，及call（）Apply（）参见上述call和apply的用法。
原型链方式：js中每个对象均有一个隐藏的__proto__属性，一个实例化对象的
__proto__属性指向其类的prototype方法，而这个prototype方法又可以被赋值成另一个实例化对象，这个对象的__proto__又需要指向其类，由此形成一条链。
那么__proto__是什么？每个对象都会在其内部初始化一个属性，就是__proto__，当我们访问一个对象的属性时，如果这个对象内部不存在这个属性，那么他就会去
__proto__里找这个属性，这个__proto__又会有自己的__proto__，于是就这样一直找下去，也就是我们平时所说的原型链的概念。
定义一个 Dog 对象，并增加一个 name 属性，该属性可以在新建对象时通过参数传入
function Dog( name ){ https://www.360docs.net/doc/0414570002.html, = name;}
// 通过原型方式扩展 Dog 对象
Dog.prototype = {
// 重新覆盖构造函数让其指向 Dog constructor:Dog,
Wow:function(){
console.group();
https://www.360docs.net/doc/0414570002.html,("I am: "+https://www.360docs.net/doc/0414570002.html, );
https://www.360docs.net/doc/0414570002.html,("WangWang....");
console.groupEnd();
},
yelp:function(){this.Wow();}
};
function MadDog(name){ Dog.apply( this, [name]);}
MadDog.prototype=new Dog();
// 重新覆盖构造函数，让其指向 MadDog
MadDog.prototype.constructor=MadDog;
MadDog.prototype.yelp=function(){
self=this;
setInterval(function(){self.Wow();},5000);
}
var xiaoXian=new Dog("xiaoXian"); xiaoXian.yelp();
var xiaoMang=new MadDog("xiaoMang"); xiaoMang.yelp();
console.log( xiaoXian.constructor == xiaoMang.constructor );
如果扩展js 中原生的String 对象?string 的方法？
https://www.360docs.net/doc/0414570002.html,= function(){}
Slice 从字符串的第一个参数提取第二个参数，也可以截取数组。返回的结果类型：string/object
Substring 从字符串的第一个参数提取第二个参数，返回的结果类型，string。
Indexof 返回短字符串在长字符串出现的位置。
Lastindexof 返回最后一个短字符串出现的位置。
Replace 字符串的替换方法，
Split 字符串分割方法，能转换为数组，数组转换字符串，用 json（）方法。document.ready()和window.onload 的区别?
Document.ready()是 jQuery 中准备出发的事件，当加载到当前元素就执行了，Window.onload 是整个页面加载之后才执行
闭包是什么？
闭包是有权访问另一个函数作用域中的变量的函数。
闭包是个函数，而它“记住了周围发生了什么”。表现为由“一个函数”体中定义了“另一个函数”
“闭包”是一个表达式（一般是函数），它具有自由变量以及绑定这些变量的环境（该环境“封闭了”这个表达式）。
1.闭包有权访问函数内部的所有变量。
2.当函数返回一个闭包时，这个函数的作用域将会一直在内存中保存到闭包不存在为止。
function f() {
var rs = [];
for (var i=0; i <10; i++) {
rs[i] = function() {return i;};
}
return rs;
}
var fn = f();
for (var i = 0; i < fn.length; i++) {
console.log('函数 fn[' + i + ']()返回值:' + fn[i]());
}
介绍jQuery easyUI？jQuery easyUI 组件使用?
jQuery EasyUI 是一组基于 jQuery 的 UI 插件集合，而 jQuery EasyUI 的目标就是帮助 web 开发者更轻松的打造出功能丰富并且美观的 UI 界面。开发者不需要编写复杂的 javascript，也不需要对 css 样式有深入的了解，开发者需要了解的只有一些简单的 html 标签。
布局 layout，上南，下北，左西右东，中间内容，左边的组件是：tree，手风琴，中间的有 tab，tab 里有 datagrid 数据表格，还有数据表格的 toolbar 工具栏。对话框 dialog；
什么是DOM，什么是DOM？以及它们的用法？
BOM 即浏览器对象模型，浏览器对象模型(BOM)使JavaScript有能
力与浏览器“对话”，由于现代浏览器已经（几乎）实现了JavaScript交互性方面的相同方法和
属性，因此常被认为是BOM的方法和属性。所有浏览器都支持 window 对象。它表示浏览器窗口。
所有 JavaScript 全局对象、函数以及变量均自动成为 window 对象的成员。
全局变量是 window 对象的属性。
全局函数是 window 对象的方法。
甚至 HTML DOM 的 document 也是 window 对象的属性之一：
Window 对象其实是 DOM 中所有的对象都源自 window 对象，有 location 对象，history 对象，方法有.Resize（）
alert( ) .confirm( ).prompt( ).open().close().setInterval().setTimeout()。
window.open() - 打开新窗口
window.close() - 关闭当前窗口
window.moveTo() - 移动当前窗口
window.resizeTo() - 调整当前窗口的尺寸
DOM 的文档对象模型，最顶级的对象是 document。可以 js 通过操作 DOM，就是一个接口，可以访问 html 的标准方法。要改变页面的某个东西，JavaScript就需要获得对HTML文档中所有元素进行访问的入口。这个入口，连同对HTML元素进行添加、移动、改变或移除的方法和属性，都是通过文档对象模型来获得的（DOM）。
JSON 和JSONP 的区别？JSONP 的原理？
JSON(JavaScript Object Notation)和 JSONP(JSON with Padding)虽然只有一个
字母的差别，但其实他们根本不是一回事儿：JSON 是一种数据交换格式，而JSONP 是一种依靠开发人员的聪明才智创造出的一种非官方跨域数据交互协议。
1、一个众所周知的问题，Ajax 直接请求普通文件存在跨域无权限访问的问题，甭管你是静态页面、动态网页、web 服务、WCF，只要是跨域请求，一律不准；
2、不过我们又发现，Web 页面上调用 js 文件时则不受是否跨域的影响（不仅如此，我们还发现凡是拥有”src”这个属性的标签都拥有跨域的能力，比如 B. C. D.
html+css+js面试题
html+css+js面试题 87 . 如何求得2和4中最大的数？ A) Math.ceil(2,4) B) Math.max(2,4) C) ceil(2,4) D) top(2,4) 88 . 打开名为“window2”的新窗口的JavaScript语法是？ A) open.new("https://www.360docs.net/doc/0414570002.html,","window2") B) window.open("https://www.360docs.net/doc/0414570002.html,","window2") C) new("https://www.360docs.net/doc/0414570002.html,","window2") D) new.window("https://www.360docs.net/doc/0414570002.html,","window2") 89 . 如何在浏览器的状态栏放入一条消息？ A) statusbar = "put your message here" B) window.status = "put your message here" C) window.status("put your message here") D) status("put your message here") 90.下列不属于文档对象的方法的是（） A）createElement B）getElementById C）getElementByName D）forms.length 91.下面这段代码运行的结果（）
A）弹出一个对象框 B）没有任何输出 C）在文档中显示文档最后修改的时间前端开发的面试题
前端开发的面试题 web前端面试题 以下是收集一些面试中经常会遇到的经典面试题以及自己面试过程中无法解决的问题，通过对知识的整理以及经验的总结，重新巩固自身的前端基础知识。 1.对WEB标准以及W3C的理解与认识 标签闭合、标签小写、不乱嵌套、提高搜索机器人搜索几率、使用外链css和js脚本、结构行为表现的分离、文件下载与页面速度更快、内容能被更多的用户所访问、内容能被更广泛的设备所访问、更少的代码和组件，容易维护、改版方便，不需要变动页面 内容、提供打印版本而不需要复制内容、提高网站易用性; 2.xhtml和html有什么区别 HTML是一种基本的WEB语言，XHTML是一个基于XML的置标语言 最主要的不同： XHTML 元素必须被正确地嵌套。 XHTML 元素必须被关闭。 标签名必须用小写字母。 XHTML 文档必须拥有根元素。 3.Doctype? 严格模式与混杂模式-如何触发这两种模式，区分它们有何意义? 用于声明文档使用那种规范(html/Xhtml)一般为严格过度基于框架的html文档 加入XMl声明可触发，解析方式更改为IE5.5 拥有IE5.5的bug 4.行内元素有哪些?块级元素有哪些?CSS的盒模型? 块级元素：div p h1 h2 h3 h4 form ul 行内元素: a b br i span input select Css盒模型:内容，border ,margin，padding 5.CSS引入的方式有哪些? link和@import的区别是?
内联内嵌外链导入 区别：同时加载 前者无兼容性，后者CSS2.1以下浏览器不支持 Link 支持使用script改变样式，后者不可 6.CSS选择符有哪些?哪些属性可以继承?优先级算法如何计算?内联和important哪个优先级高? 标签选择符类选择符 id选择符 继承不如指定 Id>class>标签选择 后者优先级高 7.前端页面有哪三层构成，分别是什么?作用是什么? 结构层 Html 表示层 CSS 行为层 js 8.css的基本语句构成是? 选择器{属性1:值1;属性2:值2;……} 9.你做的页面在哪些流览器测试过?这些浏览器的内核分别是什么? Ie(Ie内核) 火狐(Gecko) 谷歌(webkit) opear(Presto) 10.写出几种IE6 BUG的解决方法 1.双边距BUG float引起的使用display 2.3像素问题使用float引起的使用dislpay:inline -3px 3.超链接hover 点击后失效使用正确的书写顺序 link visited hover active 4.Ie z-index问题给父级添加position:relative 5.Png 透明使用js代码改 6.Min-height 最小高度 !Important 解决’ 7.select 在ie6下遮盖使用iframe嵌套
前端工程师面试题题及答案(全面综合)
1. 要动态改变层中内容可以使用的方法有（AB ） a)innerHTML b)innerText c)通过设置层的隐藏和显示来实现 d)通过设置层的样式属性的display属性 2. 在javascript里，下列选项中不属于数组方法的是（B）； a)sort() b)length() c)concat() d)reverse() 3 、var emp = new Array(3); for(var i in emp) 以下答案中能与for循环代码互换的是: （选择一项）。(D ) A for(var i =0; i c)getElementsByName() d)bgColor() 6. 、display属性值的常用取值不包括(C ) a)inline b)block c)hidden d)none 7. 以下有关pixelTop属性与top属性的说法正确的是。(D ) a)都是Location对象的属性 b)使用时返回值都是字符串 c)都是返回以像素为单位的数值 d)以上都不对 8. 使用open方法打开具有浏览器工具条,地址栏,菜单栏的窗 口，下列选项正确的是__D__ a)open("x.html","HI","toolbas=1,scrollbars=1,status=1"); b)open("HI","scrollbars=1,location=1,status=1"); c)open("x.html","status=yes,menubar=1,location=1"); d)open("x.html","HI","toolbas=yes,menubar=1,location=1"); 9. 、javascript中表达式parseInt(“X8X8”)+paseFloat(‘8’)的结果是什么?( C) a)8+8 b)88 c)16 d)“8”+’8 10. 关于setTimeout(“check”,10)中说法正确的是( D) 一选择题（单选） 1、以下哪条语句会产生运行错误：（） A.var obj = (); B.var obj = []; C.var obj = {}; D.var obj = //; 答案：A 2、以下哪个单词不属于javascript保留字：（） A.with B.parent C.class D.void 答案：B 3、请选择结果为真的表达式：（） A.null instanceof Object B.null === undefined C.null == undefined D.NaN == NaN 答案：C 二、不定项选择题 4、请选择对javascript理解有误的：() A.JScript 是javascript的简称 B.javascript是网景公司开发的一种Java脚本语言，其目的是为了简化Java的开发难度 C.FireFox 和IE存在大量兼容性问题的主要原因在于他们对javascript 的支持不同上 D.AJAX技术一定要使用javascript技术 答案：ABCD 5、foo对象有att属性，那么获取att属性的值，以下哪些做法是可以的：（） A.foo.att B.foo(“att”) C.foo[“att”] D.foo{“att”} E.foo[“a”+”t”+”t”] 答案：ACE 6、在不指定特殊属性的情况下，哪几种HTML标签可以手动输入文本：（） A. B. C. D.JavaScript精选面试题
node.js面试题大全-侧重后端应用与对Node核心的理解
node.js面试题大全－侧重后端应用与对Node核心的理解 Node是搞后端的，不应该被被归为前端，更不应该用前端的观点去理解，去面试node开发人员。所以这份面试题大全，更侧重后端应用与对Node核心的理解。 github地址: https://https://www.360docs.net/doc/0414570002.html,/jimuyouyou/node-interview-questions 注: 这是本人历时一星期完成的小作品，github里面对一些关键代码还有js源文件．直接node filename.js就可查看效果． 第一个版本，写的匆忙，能力有限，欢迎拍砖补充！后面持续更新会及时发布到github上. node开发技能图解 起源 node正风生火起，很多介绍却停留在入门阶段，无法投入生产 node相关的高质量面试题更是少之又少，很难全面考查应聘者的node能力 许多文章在讲第三方类库，可是这些库质量差距较大，一旦
遇到问题怎么办 必需的，全面了解node核心才能成为一名合格的node开发人员 目标与原则 前后端兼顾，更侧重后端 理论实战兼顾，侧重考察对实战中应用较多的理论的理解 参考答案简单明了，一针见血，不为追求严谨而浪费口舌，绕弯子 尽量用代码讲清理论的应用与区别，以接地气 终极目标是让大家对node有一个快速完整的认识 内容大纲 javascript高级话题(面向对象，作用域，闭包，设计模式等) node核心内置类库(事件，流，文件，网络等) node高级话题(异步，部署，性能调优，异常调试等) 常用知名第三方类库(Async, Express等) 其它相关后端常用技术(MongoDB, Redis, Apache, Nginx 等) 常用前端技术(Html5, CSS3, JQuery等)
js基础部分面试题
JS基础面试题 1.介绍下js中关于arguments 。【考点：函数arguments】 在函数代码中，使用特殊对象 arguments，开发者无需明确指出参数名，就能访问它们。例如，在函数 sayHi() 中，第一个参数是 message。用 arguments[0] 也可以访问这个值，即第一个参数的值（第一个参数位于位置 0，第二个参数位于位置 1，依此类推）。 因此，无需明确命名参数，就可以重写函数： function sayHi() { if (arguments[0] == "bye") { return; } alert(arguments[0]); } 2.看以下JavaScript程序问：执行以上程序后，num的值为（ D ）【考点：数据类型】 var num; num=5+true; A、true B、false C、5 D、6 3、看以下JavaScript程序【考点：switch语句,break】 var x=prompt(“请输入1-5的数字！”,“”); switch (x) { case “1”:alert(“one”); case “2”:alert(“two”); case “3”:alert(“three”); case “4”:alert(“four”); case “5”:alert(“five”); default:alert(“none”); } 运行以上程序，在提示对话框中输入“4”，依次弹出的对话框将输出: （ B ） A、four,none B、four,five,none C、five D、five,none 4、分析下面的JavaScript代码段【考点：for循环】 a=new Array(2,3,4,5,6); sum=0; 输出结果是().(选择一项)
前端面试题含答案
前端面试题含答案 The latest revision on November 22, 2020
前端开发面试知识点大纲： HTML&CSS ： 对Web 标准的理解、浏览器内核差异、兼容性、hack 、CSS 基本功：布 局、盒子模型、选择器优先级及使用、HTML5、CSS3、移动端适应 JavaScript ： 数据类型、面向对象、继承、闭包、插件、作用域、跨域、原型链、模块 化、自定义事件、内存泄漏、事件机制、异步装载回调、模板引擎、Nodejs 、 JSON 、ajax 等。 其他： HTTP 、安全、正则、优化、重构、响应式、移动端、团队协作、可维护、SEO 、UED 、架构、职业生涯 作为一名前端工程师，无论工作年头长短都应该必须掌握的知识点： 1、DOM 结构 —— 两个节点之间可能存在哪些关系以及如何在节点之间任意移动。 产品部-前端面试题-答案 产品部 Beijing
2、DOM操作——如何添加、移除、移动、复制、创建和查找节点等。 3、事件——如何使用事件，以及IE和标准DOM事件模型之间存在的差 别。 4、XMLHttpRequest ——这是什么、怎样完整地执行一次GET请求、怎样检测 错误。 5、严格模式与混杂模式——如何触发这两种模式，区分它们有何意义。 6、盒模型——外边距、内边距和边框之间的关系，及IE8以下版本的浏览器 中的盒模型 7、块级元素与行内元素——怎么用CSS控制它们、以及如何合理的使用它们 8、浮动元素——怎么使用它们、它们有什么问题以及怎么解决这些问题。 9、HTML与XHTML——二者有什么区别，你觉得应该使用哪一个并说出理由。 10、JSON ——作用、用途、设计结构。 HTML 一、Doctype作用严格模式与混杂模式如何区分它们有何意义 （1）、 声明位于文档中的最前面，处于 标签之前。告知浏览器的解析器，用什么文档类型规范来解析这个文档。
Javascript笔试题及答案
J a v a s c r i p t笔试题及 答案 Company Document number：WTUT-WT88Y-W8BBGB-BWYTT-19998
Javascript面试笔试题 考试时间90分钟 一、不定项选择题（每题3分，共30分） 1.声明一个对象，给它加上name属性和show方法显示其name值，以下 代码中正确的是（ D ） A.var obj = [name:"zhangsan",show:function(){alert(name);}]; B.var obj = {name:"zhangsan",show:”alert”}; C.var obj = {name:"zhangsan",show:function(){alert(name);}}; D.v ar obj = {name:"zhangsan",show:function(){alert;}}; 2.以下关于Array数组对象的说法不正确的是（ CD） A.对数组里数据的排序可以用sort函数，如果排序效果非预期，可以给 sort函数加一个排序函数的参数 B.reverse用于对数组数据的倒序排列 C.向数组的最后位置加一个新元素，可以用pop方法 D.unshift方法用于向数组删除第一个元素 3.要将页面的状态栏中显示“已经选中该文本框”，下列JavaScript语句正确的 是（ A ） A.="已经选中该文本框" B.="已经选中该文本框" C.="已经选中该文本框" D.="已经选中该文本框" 4.点击页面的按钮，使之打开一个新窗口，加载一个网页，以下JavaScript 代码中可行的是（ AD）
js_ext_jquery面试题
对js,ext,jquey的总结 一：js面试题 1.js中到的String你是怎么理解的 答:String是js中唯一可以变长的长度到值,存储方式是以数组存储的一般组合alert使用 \n:是代表回车 \r是代表换行 2.写js代码的时候要注意的语法 答:1.区分大小写 2.变量类型是弱类型 var 3.注释 //单行注释 /** 多行注释 **/ 4.变量名要是字母下划线 $ 5.数据类型: * 原始数据类型(栈) boolean,null,undefind,number,String * 引用数据类型(堆)比如对象 3.强类型变量和弱类型变量到区别 1.强类型变量:编译前必须要声明----->基于java 2.弱类型变量:编译前不需要声明(使用前不需要声明 , 而是解释器在运行时检查数据类型)---->js 3.在js中function()表示什么? 可不可以重载? function的声明方式? 答: 1.可以表示为---> 类 , 对象 , 方法 , 构造器 2.不可以重载(当function()的名字相同--->后面到会覆盖前面到)
3.function()是所有函数到父类例如:function 函数名(参数列明){ } 4.js的特点 答: 1.脚本语言,基于对象 2.基于java的,基于语句和控制流之上简单而紧凑 3.动态的脚本语言 4.依赖于浏览器本身于操作环境无关 5.以字符串解析执行 5.给你一页面，要你写JS代码拿对象，得到它值，然后进行一些操作 答: 第一种方法是 document.getEelementById("标签里面到id属性").value; 第二种方法是 document.getEelementsByName("标签里面name属性 ").value; 第三种方法是直接用document点name里面到属性例 如:document.xxx.xxx.value 这样就可以拿到值 6.你是怎么理解js里面到this关键字 答:this是对当前对象的引用,在js中由于对象到引用是多层次的,为了避免乱(谁调用了它,它就会指向谁) 7.js里面的警告框和询问框确认框有什么作用 答: 1.警告框为了输出js调式用例:alert("我是用于js调式"); 2.询问框为了询问你通不通过例:提问 var number=prompt("你到分数") if(number>100){通过}else{没有通过} 3.确认框为了让你确认的例: 确认 var name = confirm("js菜鸟") if(name==true){彼此彼此}else{你才是菜鸟} 8.js是的组成分为哪三部分 答:核心(Ecmscript) , 文档对象模型 , 浏览器对象模型 9.在js里面跳转一个页面用什么方法
基础JavaScript面试问题及答案
基础JavaScript面试问题及答案 1.使用typeof bar === "object"来确定bar是否是对象的潜在陷阱是什么？如何避免这个陷阱？ 尽管typeof bar === "object"是检查bar是否对象的可靠方法，令人惊讶的是在JavaScript 中null也被认为是对象！ 因此，令大多数开发人员惊讶的是，下面的代码将输出true (而不是false) 到控制台： var bar = null;console.log(typeof bar === "object"); // logs true! 只要清楚这一点，同时检查bar是否为null，就可以很容易地避免问题： console.log((bar !== null) && (typeof bar === "object")); // logs false 要答全问题，还有其他两件事情值得注意： 首先，上述解决方案将返回false，当bar是一个函数的时候。在大多数情况下，这是期望行为，但当你也想对函数返回true的话，你可以修改上面的解决方案为： console.log((bar !== null) && ((typeof bar === "object") || (typeof bar === "function")));
第二，上述解决方案将返回true，当bar是一个数组（例如，当var bar = [];）的时候。在大多数情况下，这是期望行为，因为数组是真正的对象，但当你也想对数组返回false时，你可以修改上面的解决方案为： console.log((bar !== null) && (typeof bar === "object") && (toString.call(ba r) !== "[object Array]")); 或者，如果你使用jQuery的话： console.log((bar !== null) && (typeof bar === "object") && (! $.isArray(ba r))); 2.下面的代码将输出什么到控制台，为什么？ (function(){ var a = b = 3; })(); console.log("a defined? " + (typeof a !== 'undefined'));console.log("b defin ed? " + (typeof b !== 'undefined')); 由于a和b都定义在函数的封闭范围内，并且都始于var关键字，大多数JavaScript开发人员期望typeof a和typeof b在上面的例子中都是undefined。
JS数组的前端面试题
关于数组的前端面试题 1、如何判断一个变量是否为数组？ （1）为什么不用typeof？ var list = [1,2,3]; typeof list //"object" Array继承与Object，所以typeof 会直接返回object，所以不可以用typeof方法来检测（2）为什么不用instanceof? var list = [1,2,3]; list instanceof Array //true instanceof 表面上看确实是返回了true，但其实并不可靠。原因是Array实质是一个引用，用instanceof方法（包括下面的constructor方法）都是利用和引用地址进行比较的方法来确定的，但是在frame嵌套的情况下，每一个Array的引用地址都是不同的，比较起来结果也是不确定的，所以这种方法有其局限性。 （3）为什么不用constructor方法？ var list = [1,2,3]; list.constructor === Array; //true 原因已经解释过了，不再赘述。 可靠的检测数组方式 （1）利用Object的toString方法 var list = [1,2,3]; Object.prototype.toString.call(list); //[object Array] （2）利用ES6的Array.isArray()方法 var list = [1,2,3]; Array.isArray(list); //true 2、数组的原生方法有哪些？ 一是考察面试者平时使用的是否足够平凡；二是观察面试者是否对于日常的知识有所归纳。 可以用MDN中给出的方式来回答： （1）会改变自身的方法 Array.prototype.copyWithin() 在数组内部，将一段元素序列拷贝到另一段元素序列上，覆盖原有的值。 Array.prototype.fill() 将数组中指定区间的所有元素的值，都替换成某个固定的值。 Array.prototype.pop()删除数组的最后一个元素，并返回这个元素。 Array.prototype.push()在数组的末尾增加一个或多个元素，并返回数组的新长度。 Array.prototype.reverse()颠倒数组中元素的排列顺序，即原先的第一个变为最后一个，原先的最后一个变为第一个。 Array.prototype.shift()删除数组的第一个元素，并返回这个元素。 Array.prototype.sort()对数组元素进行排序，并返回当前数组。 Array.prototype.splice()在任意的位置给数组添加或删除任意个元素。 Array.prototype.unshift()在数组的开头增加一个或多个元素，并返回数组的新长度。
js基础测试题
一、选择题（每题 2 分，多选题错选、少选不得分） 1、分析下段代码输出结果是（） var arr = [2,3,4,5,6]; var sum =0; for(var i=1;i < arr.length;i++) { sum +=arr[i] } console.log(sum); A．20 B．18 C．14 D．12 2、以下关于Array 数组对象的说法不正确的是（） A．对数组里数据的排序可以用sort 函数，如果排序效果非预期，可以给sort 函数加一个排序函数的参数 B．reverse 用于对数组数据的倒序排列 C．向数组的最后位置加一个新元素，可以用pop 方法 D．unshift 方法用于向数组删除第一个元素
3、以下代码运行的结果是输出( ) var a = b = 10; (function(){ var a=b=20 })(); console.log(b); A．10 B．20 C．报错D．undefined 4、以下代码运行后的结果是输出( ) var a=[1, 2, 3]; console.log(a.join()); A．123 B．1,2,3 C．1 2 3 D．[1,2,3] 5、在JS 中，’1555 ’+3 的运行结果是( )
A．1558 B．1552 C．15553 D．1553 6、以下代码运行后弹出的结果是( ) var a = 888; ++a; alert(a++); A．888 B．889 C．890 D．891 7、关于变量的命名规则，下列说法正确的是（） A．首字符必须是大写或小写的字母，下划线（_）或美元符（$ ）B．除首字母的字符可以是字母，数字，下划线或美元符 C．变量名称不能是保留字 D．长度是任意的 E．区分大小写
25个最基本的JavaScript面试问题及答案
25个最基本的JavaScript面试问题及答案 1.使用typeof bar === "object"来确定bar 是否是对象的潜在陷阱是什么？如何避免这个陷阱？ 尽管typeof bar === "object"是检查bar 是否对象的可靠方法，令人惊讶的是在JavaScript中null 也被认为是对象！ 因此，令大多数开发人员惊讶的是，下面的代码将输出 true (而不是false) 到控制台： var bar = null; console.log(typeof bar === "object"); // logs true! 只要清楚这一点，同时检查bar是否为null，就可以很容易地避免问题：console.log((bar !== null) && (typeof bar === "object")); // logs false 要答全问题，还有其他两件事情值得注意： 首先，上述解决方案将返回false，当bar是一个函数的时候。在大多数情况下，这是期望行为，但当你也想对函数返回true的话，你可以修改上面的解决方案为： console.log((bar !== null) && ((typeof bar === "object") || (typeof bar === "function "))); 第二，上述解决方案将返回true，当bar是一个数组（例如，当var bar = [];）的时候。在大多数情况下，这是期望行为，因为数组是真正的对象，但当你也想对数组返回false时，你可以修改上面的解决方案为：
console.log((bar !== null) && (typeof bar === "object") && (toString.call(bar) !== "[obje ct Array]")); 或者，如果你使用jQuery的话： console.log((bar !== null) && (typeof bar === "object") && (! $.isArray(bar))); 2.下面的代码将输出什么到控制台，为什么？ (function(){ var a = b = 3; })(); console.log("a defined? " + (typeof a !== 'undefined')); console.log("b defined? " + (typeof b !== 'undefined')); 由于a和b 都定义在函数的封闭范围内，并且都始于var关键字，大多数JavaScript开发人员期望typeof a和typeof b在上面的例子中都是undefined。然而，事实并非如此。这里的问题是，大多数开发人员将语句var a = b = 3;错误地理解为是以下声明的简写： var b = 3; var a = b; 但事实上，var a = b = 3;实际是以下声明的简写： b = 3; var a = b; 因此（如果你不使用严格模式的话），该代码段的输出是： a defined? false b defined? true
史上最全前端面试题(含答案)
HTML+CSS 1.对WEB标准以及W3C的理解与认识 标签闭合、标签小写、不乱嵌套、提高搜索机器人搜索几率、使用外链css和js脚本、结构行为表现的分离、文件下载与页面速度更快、内容能被更多的用户所访问、内容能被更广泛的设备所访问、更少的代码和组件，容易维护、改版方便，不需要变动页面内容、提供打印版本而不需要复制内容、提高网站易用性； 2.xhtml和html有什么区别 HTML是一种基本的WEB网页设计语言，XHTML是一个基于XML的置标语言 最主要的不同： XHTML 元素必须被正确地嵌套。 XHTML 元素必须被关闭。 标签名必须用小写字母。 XHTML 文档必须拥有根元素。 3.Doctype? 严格模式与混杂模式-如何触发这两种模式，区分它们有何意义? 用于声明文档使用那种规范（html/Xhtml）一般为严格过度基于框架的html 文档 加入XMl声明可触发，解析方式更改为IE5.5 拥有IE5.5的bug 4.行内元素有哪些？块级元素有哪些？CSS的盒模型？ 块级元素：div p h1 h2 h3 h4 form ul 行内元素: a b br i span input select Css盒模型:内容，border ,margin，padding 5.CSS引入的方式有哪些? link和@import的区别是? 内联内嵌外链导入 区别：同时加载 前者无兼容性，后者CSS2.1以下浏览器不支持 Link 支持使用javascript改变样式，后者不可 6.CSS选择符有哪些？哪些属性可以继承？优先级算法如何计算？内联和important哪个优先级高？ 标签选择符类选择符 id选择符 继承不如指定 Id>class>标签选择 后者优先级高 7.前端页面有哪三层构成，分别是什么？作用是什么？ 结构层 Html 表示层 CSS 行为层 js 8.css的基本语句构成是？ 选择器{属性1:值1;属性2:值2;……}
JavaScript面试题汇总
一、单选题 1、以下哪条语句会产生运行错误：（A） A.var obj = ( ); B.var obj = [ ];//定义一个数组 C.var obj = { };//定义一个对象 D.var obj = / /;//定义一个正则表达式 2、以下哪个单词不属于javascript保留字：（B） A. with B. parent C. class D. void 3、请选择结果为真的表达式：（C） A. null instanceof Object B. null === undefined C. null == undefined D. NaN == NaN 说明： ==用于一般比较，===用于严格比较， ==在比较的时候可以转换数据类型， ===严格比较，只要类型不匹配就返回flase。 举例说明： "1" == true 类型不同，"=="将先做类型转换，把true转换为1，即为 "1" == 1； 此时，类型仍不同，继续进行类型转换，把"1"转换为1，即为 1 == 1； 此时，"==" 左右两边的类型都为数值型，比较成功！ 如果比较："1" === true 左侧为字符型，右侧为bool布尔型，左右两侧类型不同，结果为false； 如果比较："1" === 1 左侧为字符型，右侧为int数值型，左右两侧类型不同，结果为false； 如果比较： 1 === 1 左侧为int数值型，右侧为int数值型，左右两侧类型相同，数值大小也相同，结果为true；
如果比较： 1 === 2 左侧为int数值型，右侧为int数值型，左右两侧类型相同，但数值大小不同，结果为false； 简而言之就是 "==" 只要求值相等; "===" 要求值和类型都相等 二、不定项选择题 4、请选择对javascript理解有误的：(ABCD) A. JScript是javascript的简称、 B. javascript是网景公司开发的一种Java脚本语言，其目的是为了简化Java 的开发难度（没有什么关系）。 C. FireFox和IE存在大量兼容性问题的主要原因在于他们对javascript的支持不同上 D. AJAX技术一定要使用javascript技术 说明： Java、javascript、JS和JScript 首先，这三者没有必然的联系，它们是完全不同的事物，它们是分别由不同公司开发的，在函数方面有相同的地方，也有很多不同之处。Java是由Sun公司创立、开发；javascript则是Sun和Netscape公司共同开发的产品；JScript 是微软对ECMA262语言规范的一种实现。这三者的共同点是，语法与C语言相似。 JS是javascript的简称。 JScript应用于ASP，运行于服务器端。而Java、javascript都是运行于客户端。Sun公司后来又推出了JSP，以Java语言为基础，运行于服务器端。运行于服务器端的网页是动态网页，所以以JScript为基础的ASP、以Java为基础的JSP是动态网页，而Java、javascript则是静态网页。 ajax是一种概念，它是几种技术的综合运用（javascript，xml），ajax可以用在任何动态语言开发的网站里（asp,https://www.360docs.net/doc/0414570002.html,，jsp，php等）。它不为微软专有，不过呢，微软为https://www.360docs.net/doc/0414570002.html,专门开发了一个ajax框架。 5、foo对象有att属性，那么获取att属性的值，以下哪些做法是可以的：（ACE） A. foo.att B. foo(“att”) C.foo[“att”] D. foo{“att”} E. foo[“a”+”t”+”t”]
2019前端经典面试题
1，html和xml有什么区别 html是超文本标记语言xml是可扩展标记语言 html语法宽松，xml语法严谨 html使用固有标记，xml没有固有标记 html标签预定义，xml标签可扩展，可定义 html是用来显示数据的，xml是用来描述和存储数据的 2，css有哪几种选择器？权重的优先级？ 第一种为属性选择器 第二种为id选择器 第三种为class选择器 第四种为伪类选择器 第五种是后代选择器 第六种是标签选择器 第七种是通用选择器 第八种是伪元素选择器 1. 第一等：代表内联样式，如: style=””，权值为1000。 2. 第二等：代表ID选择器，如：#content，权值为0100。 3. 第三等：代表类，伪类和属性选择器，如.content，权值为0010。 4. 第四等：代表类型选择器和伪元素选择器，如div p，权值为0001。 5. 通配符、子选择器、相邻选择器等的。如*、>、+,权值为0000。 6. 继承的样式没有权值。 3，网页有哪几部分组成？ 结构层：html 表示层：css 行为层：js和dom 4，一个200*200的div在不同分辨率屏幕上下左右居中，用css实现 Div{ position:absolute; width:200px; height:200px; top:50%; left:50%; margin-top:-100px; margin-left:-100px; }
5，阐述清楚浮动的几种方式 第一种父级div定义高度height 适合高度固定的布局 第二种父级div定义overflow：hidden 第三种结尾处加空标签clear：both 让父级自动获取高度 第四种父级div定义伪类:after 和zoom 6，解释css sprites，如何使用？ CSS Sprites其实就是把网页中一些背景图片整合到一张图片文件中，再利用CSS的“background-image”，“background- repeat”，“background-position”的组合进行背景定位，background-position可以用数字能精确的定位出背景图片的位置。 CSS Sprites为一些大型的网站节约了带宽，让提高了用户的加载速度和用户体验，不需要加载更多的图片 7，如何用原生js给一个按钮绑定两个onclick事件？ Var btn1 =document. getElementsById(“btn”); btn1.addEnventListener(“click”,”hello1); btn1.addEnventListener(“click”,”hello2); function hello1(){ alert(“hello1”); } function hello2(){ alert(“hello2”); } 8, 拖曳会用到哪些事件？ Dragstart Dragenter Dragover Dragleave Drag Drop Dragend 9, 请列举jQuery中选择器？ 1，基本选择器 ID，class，元素之类的 2，层级选择器 返回的是jQuery对象才可以进行的链式操作