前端须要记住的一些基础问题

时间 2019-11-13

标签前端须要记住一些基础问题繁體版

原文原文链接

最近在面试，一些公司会有笔试题，有些本身确实作的很差，因此把它记录下来，巩固复习。html

部分没有完善，抽时间回来补充html5

怎样实现a对象能够调用b对象的方法？git

考的是继承，b要有a的方法，继承有3种web

function classA(name) {
　　this.name = name;
　　this.showName = function() {
　　　　alert(this.name);
　　}
}面试

function classB(name) {
　　classA.call(this, name);
}gulp

var oB = new classB("Black Cat");
oB.showName(); // Black Catcanvas

h5有哪些新标签数组

header, nav, section, article, aside, footer, details, summary浏览器

headercookie	定义文档或节的页眉
nav	定义导航连接的容器
section	定义文档中的节
article	定义独立的自包含文章
aside	定义内容以外的内容（好比侧栏）
footer	定义文档或节的页脚
details	定义额外的细节
summary	定义 details 元素的标题

<!DOCTYPE> 的做用

定义文档的类型，让浏览器正确地显示文档（html5: <!DOCTYPE html>）

表单元素

Input, textarea, option, select , button (html5新增:datalist, keygen, output)

Html5新增的input输入类型

color
date
datetime
datetime-local
email
month
number
range
search
tel
time
url
week

html5新特性

新的语义元素，好比 <header>, <footer>, <article>, and <section>。
新的表单控件，好比数字、日期、时间、日历和滑块。
强大的图像支持（借由 <canvas> 和 <svg>）
强大的多媒体支持（借由 <video> 和 <audio>）
强大的新 API，好比用webstorage(本地存储) 取代 cookie。

数组去重的实现

方法一：用是indexOf方法：

var arr = [1, 2, 3, 4, 4, 1, 21, 3, 12, 3, 4, 5324, 234, 3, 2, 1, 3]

function unique(res) {

var result = [];

for (var i = 0; i < res.length; i++) {

if (result.indexOf(res[i]) == -1) {

result.push(res[i])

}

return result;

}

console.log(unique(arr));

方法二：

var arr2 = [1,2,4,5,3,2,1,3,4,2,4,5,4,234];

var o = {};

var resultArr = [];

for(var i=0;i<arr2.length;i++){

if(!o[arr2[i]]){

resultArr.push(arr2[i]);

o[arr2[i]] = 2

}

console.log(resultArr)

js实现clone方法，对5中数据类型进行复制

function clone(obj) {

var o;

if (typeof obj == "object") {

if (obj === null) {

o = null;

} else {

if (obj instanceof Array) {

o = [];

for (var i = 0, len = obj.length; i < len; i++) {

o.push(clone(obj[i]));

}

} else {

o = {};

for (var j in obj) {

o[j] = clone(obj[j]);

}

} else {

o = obj;

}

return o;

}

说说对gulp的了解

记住5个API

gulp.tesk() // 定义任务

gulp.src() // 获取流（虚拟的文件对象流），有路径，文件名，内容等信息

gulp.dest() // 输出文件（写文件）

gulp.watch() // 监听文件变化

gulp.run() // 用来执行任务

// pipe() 管道

Git版本管理的经常使用命令

回头来整理他们各自的做用

git add .

git checkout xxx

git commit –m xxx

git push origin master

git pull origin master

git branch

git checkout –b xxx / git checkout xxx

git merge xxx

360金融笔试题

　　写在前面：有些题目本身还以为是面试官出的题目有问题呢，实际上并非，只是都有他的目的。

1.随便列举4个或多个BOM对象

　　一、window对象，是JS的最顶层对象，其余的BOM对象都是window对象的属性；

　　二、document对象，文档对象；

　　三、location对象，浏览器当前URL信息；

　　四、navigator对象，浏览器自己信息；

　　五、screen对象，客户端屏幕信息；

　　六、history对象，浏览器访问历史信息；

2.img元素的alt和title的异同

alt属性和title属性的区别是前者是在图片没法加载的时候才会显示的其值，而title是在图片正常加载鼠标划上去显示的值，虽然alt也有后者的功能，可是只是在低版本的ie浏览器才支持，高版本及标准浏览器不支持这个功能了。

3.Javascript有哪几种数据类型

基本类型：String Number Boolean Null undefined

引用类型：Object

4.下面这段的执行结果

var a = 1,b = 0;

<!--

b = 2;

-->

if(a<b) alert('a is smaller');

else slert('b is smaller')

</script>

结果：弹出a is smaller

5.说出下面脚本的执行结果，并说明缘由

var a;

　　if(a == undefined) alert('undefined');

　　if(a == null) alert('null')

　　结果：先弹出 undefined。关闭后再弹出 null。缘由：这里“==”会强制类型转换，a声明了，但未定义，因此a是undefined，而undefined == null也返回true，因此两个alert都会执行

6.下面脚本的执行结果：

考的是进制的问题，这块本身须要去增强

var x = 011, y= 0x10, z= 1.2e2;

alert(x+y+z)

结果：145 （9+16+120）

7.下面脚本的执行结果：

var a=1,b=2;

function c(){

alert('c1')

}

function test(){

alert(a);

alert(b);

c();

function b(){

return 0

}

var a=5,b=6;

function c(){

alert('c2')

}

test();

弹出undefined

弹出：function b(){

return 0

}

弹出：c2

8. 下方脚本能正确alert出2吗？若是不行，怎么解决？

for (var i = 0, l = 10, obj = []; i <= l; i++) {

obj[i] = function() {

alert(i);

}

obj[2]()

结果：不能，alert的是11，解决方案是利用闭包

for (var i = 0, l = 10, obj = []; i <= l; i++) {

(function(i) {

obj[i] = function() {

alert(i);

}

})(i)

}

obj[2]()

9. 说出下方脚本的执行结果

var array = [1,2];

deal(array, array);

function deal(arrA, arrB){

arrA = [3,4];

console.log(array[1]); // 2

arrB[1] = 9; // arrB[1] = 9, arrB为[1,9] arrB是array引用，array为[1,9]

console.log(array[1]); // 9

}

结果：// 2 // 9