02web前端笔试题

又参加了几场web前端的宣讲会,复习了一下，感觉有点用处吧，至少没有前几天一脸懵逼！希望接下来，越来越好，加油！！！

对啦，如果下面有错的地方，欢迎指出，谢谢~

1、什么是跨域？跨域资源请求的方式有哪些？
浏览器从一个域名的网页去请求另一个域名的资源时，域名、端口、协议任一不同，都是跨域
存在跨域的情况：
网络协议不同，如http协议访问https协议。
端口不同，如80端口访问8080端口。
域名不同，如qianduanblog.com访问baidu.com。
子域名不同，如abc.qianduanblog.com访问def.qianduanblog.com。
域名和域名对应ip,如www.a.com访问20.205.28.
跨域资源请求的方式：
(1)、porxy代理
定义和用法：proxy代理用于将请求发送给后台服务器，通过服务器来发送请求，然后将请求的结果传递给前端。
实现方法：通过nginx代理；
注意点：1、如果你代理的是https协议的请求，那么你的proxy首先需要信任该证书（尤其是自定义证书）或者忽略证书检查，否则你的请求无法成功。
(2)、CORS 【Cross-Origin Resource Sharing】:跨域资源共享
定义和用法：是现代浏览器支持跨域资源请求的一种最常用的方式。
使用方法：一般需要后端人员在处理请求数据的时候，添加允许跨域的相关操作。
(3)、jsonp
定义和用法：通过动态插入一个script标签。浏览器对script的资源引用没有同源限制，同时资源加载到页面后会立即执行（没有阻塞的情况下）。
特点：通过情况下，通过动态创建script来读取他域的动态资源，获取的数据一般为json格式。

2、请说出Vue、Angular、react的组件传值？
A、react的组件传值:
分父亲向儿子传值，
子向父亲传值，
没有嵌套关系的组件之间传值，例如兄弟组件传值。
B.Vue组件传值：
父组件向子组件传值
子组件调用父组件方法并向父组件传值
兄弟组件之间传值
事件总线：不相关组件之间传递数据
C、Angular组件传值：

3、以下程序输出的是什么？怎么修改才能使输出结果为1,2,3,4,5？
for(var i=1;i<=5;i++){
setTimeout(function(){
Console.log(i);
},1000);
}
输出为5,5,5，5,5

修改方式：
1、将var改成let,因为let 中的i是区块变量，每个i只能存活到大括号结束，并不会把后面的for循环的i 值赋给前面的setTimeout中的i；而var i 则是局部变量，这个 i 的生命周期不受for循环的大括号限制；

4、同步和异步的区别？（自己补充的）
同步，是所有的操作都做完，才返回给用户结果。即写完数据库之后，在相应用户，用户体验不好。（银行转账系统）
异步，不用等所有操作等做完，就相应用户请求。即先相应用户请求，然后慢慢去写数据库，用户体验较好。

5、简述一下什么是XXS（跨站脚本攻击）攻击？

XSS是一种经常出现在web应用中的计算机安全漏洞，它允许恶意web用户将代码植入到提供给其它用户使用的页面中。比如这些代码包括HTML代码和客户端脚本。攻击者利用XSS漏洞旁路掉访问控制——例如同源策略。这种类型的漏洞由于被黑客用来编写危害性更大的网络钓鱼攻击而变得广为人知。对于跨站脚本攻击，黑客界共识是：跨站脚本攻击是新型的“缓冲区溢出攻击“，JavaScript是新型的“ShellCode”。

6、简述get和post请求的区别？
（1）使用Get请求时,参数在URL中显示,而使用Post请求,则不会显示出来；
（2）Post传输的数据量大，可以达到2M，而Get方法由于受到URL长度的限制,只能传递大约1024字节.
（3）Get请求需注意缓存问题,Post请求不需担心这个问题；
（4）Post请求必须设置Content-Type值为：application/x-form-www-urlencoded；
（5）发送请求时,因为Get请求的参数都在url里,所以send函数发送的参数为null,而Post请求在使用send方法时,却需赋予其参数；
（6）GET方式请求的数据会被浏览器缓存起来，因此其他人就可以从浏览器的历史记录中读取到这些数据，例如账号和密码等。在某种情况下，GET方式会带来严重的安全问题，POST方式相对来说就可以避免这些问题。

7、CSS有哪些选择器？哪些属性是可以继承？哪些不可以？

优先级：!important >行间 >id >类选择器 > 标签

8、用js写一个方法，实现字符串反转，如“abc”>“cba”
方法1：

var str = '123';
   var newStr = str.split("").reverse().join("");
	alert(newStr);

解释：split()： 用于把一个字符串分隔成字符串数组
Reverse():用于颠倒数组元素顺序
Join()：连接数组元素，生成一个字符串
方法2：

var str="abcdef" var i=str.length; i=i-1; for (var x = i; x >=0; x--) { alert(str.charAt(x)); }
解释：逐个输出字符串各个位上的字符

   function reverse(str) {
			if(str.length == 0) return null;  //判断字符串是否为空
			var i = str.length;
			var dstr = "";
			while(--i >= 0) {
				dstr += str.charAt(i); //将各个位上的字符连接起来
			}
			return dstr;
		}
		var str = "abcdef";
		str = reverse(str);
		document.write(str);

9、实现div1和div2自适应窗口的高，div1定宽400px，div2随窗口的缩放而缩放。
（额，这题不太会写，欢迎各位大佬指教~）

10、用js写一个方法，将字符串的“a”替换成“hello”,如“abcad”>“hellobchellod”。

 function replace(str){
            	if(str.length==0) return null;
            	var dstr="";
            	dstr+=str.replace(/a/g, 'hello'); 
            	return dstr;
            }
			var str = "abcadef";
			str = replace(str);
			document.write(str);

11、var a=Math.floor(5.3).toFixed(2)，那么a=？ a=5.00
解释：floor()：向下取整
toFixed（）：把number四舍五入为指定小数位数

12、var a=‘abcdef’;var b=a.substr(-4,2)，b=?, b=cd
解释:substr() 方法可在字符串中抽取从 start 下标开始的指定数目的字符。
即：从字符串中截取一些字符
语法：stringObject.substr(start,length)

13、写出下列程序的输出结果：

function (){
Var a ={name:undefined};
Var b={name:a.name};
Var c={name:b.name+’jack’};
Console.log(c.name);
}

输出结果为：undefinedjack