JavaScript面试题整理

JavaScript

面试题初级 https://www.jianshu.com/p/38f81f61e72c
https://blog.csdn.net/liuwengai/article/details/52628652

1.javascript是一门什么样的语言,有何特点?

js最初是一门为了网页交互而设计的语言,一个完整的Javascript实现由下列三个部分组成,严格来说,js是ECMAScript的实现,是ECMAScript+BOM+DOM组成的一种web开发技术:
ECMAScript (核心)
文档对象模型(DOM)
浏览器对象模型(BOM)

JavaScript特点

js是一门弱类型语言,其变量类型采用弱类型,并未使用严格的数据类型 (灵活性)
js是一门解释型脚本语言,在程序运行中被逐行的解释,不像(C/C++/Java)这些语言需要先编译,所以它运行起来非常快
js有事件驱动机制,js对用户的响应,是以事件驱动的方式进行的。在网页中执行了某种操作所产生的动作,称为“事件”,如按下鼠标、移动窗口等
JavaScript具有跨平台性,JavaScript依赖于浏览器本身,与操作环境无关,只要设备有浏览器,就可以运行js语言

2.javascript的数据类型?

基本数据类型:String,boolean,Number,Undefined, Null
引用数据类型:Object(Array,Date,RegExp,Function)
null表示"没有对象",即该处不应该有值。典型用法是:
(1) 作为函数的参数,表示该函数的参数不是对象。
(2) 作为对象原型链的终点。
Object.getPrototypeOf(Object.prototype)// null
获取元素时,如果当前文档中特定元素不存在则返回null.
undefined表示"缺少值",就是此处应该有一个值,但是还没有定义。典型用法是:
(1)变量被声明了,但没有赋值时,就等于undefined。
(2) 调用函数时,应该提供的参数没有提供,该参数等于undefined。
(3)对象没有赋值的属性,该属性的值为undefined。
(4)函数没有返回值时,默认返回undefined。

3.已知ID的Input输入框,希望获取这个输入框的输入值,怎么做?(不使用第三方框架)

document.getElementById(“ID”).value

4.设置一个已知ID的DIV的html内容为xxxx,字体颜色设置为黑色(不使用第三方框架)

var dom = document.getElementById(“ID”);
	dom.innerHTML = “xxxx”;
	dom.style.color = “#000”;

5.已知ID的Input输入框,希望获取这个输入框的输入值,怎么做?(不使用第三方框架)

document.getElementById(“ID”).value

6.希望获取到页面中所有的checkbox怎么做?(不使用第三方框架)

var domList = document.getElementsByTagName(‘input’)
var checkBoxList = [];
var len = domList.length;  //缓存到局部变量
while (len--) {  //使用while的效率会比for循环更高
  if (domList[len].type == ‘checkbox’) {
      checkBoxList.push(domList[len]);
  }
}

7.当一个DOM节点被点击时候,希望执行一个函数,应该怎么做?

直接在DOM里绑定事件:<div onclick=”test()”></div>
在JS里通过onclick绑定:xxx.onclick = test
通过事件添加进行绑定:addEventListener(xxx, ‘click’, test)

8.javascript的事件流模型

“事件冒泡”:事件开始由最具体的元素接受,然后逐级向上传播
“事件捕捉”:事件由最不具体的节点先接收,然后逐级向下,一直到最具体的
“DOM事件流”:三个阶段:事件捕捉,目标阶段,事件冒泡

9.什么是ajax和json?优缺点

Ajax是异步JavaScript和XML,用于在Web页面中实现异步数据交互。
优点: 可以使得页面不重载全部内容的情况下加载局部内容,降低数据传输量 避免用户不断刷新或者跳转页面,提高用户体验
缺点: 对搜索引擎不友好( 要实现ajax下的前后退功能成本较大 可能造成请求数的增加 跨域问题限制 JSON是一种轻量级的数据交换格式,ECMA的一个子集 优点:轻量级、易于人的阅读和编写,便于机器(JavaScript)解析,支持复合数据类型(数组、对象、字符串、数字)

10.输出var a;alert(typedef a); // undefined alert(b); // 报错

Undefined是一个只有一个值的数据类型,这个值就是“undefined”,在使用var声明变量但并未对其赋值进行初始化时,这个变量的值就是undefined。而b由于未声明将报错。注意未申明的变量和声明了未赋值的是不一样的。

11.var a=null;alert(typedef a);

null是一个只有一个值的数据类型,这个值就是null。表示一个空指针对象,所以用typeof检测会返回”object”。

12.Var underfined; undefind=null; 1=true; 0=false; 0=’’; []=false; []=![];

var undefined;
undefined == null; // true
1 == true;   // true
2 == true;   // false
0 == false;  // true
0 == '';     // true
NaN == NaN;  // false
[] == false; // true
[] == ![];   // true
undefined与null相等,但不恒等(===)
一个是number一个是string时,会尝试将string转换为number
尝试将boolean转换为number,0或1
尝试将Object转换成number或string,取决于另外一个对比量的类型
所以,对于0、空字符串的判断,建议使用 “===” 。
“===”会先判断两边的值类型,类型不匹配时为false。

详细解释请点击:
https://blog.csdn.net/liuwengai/article/details/52628652?utm_source=copy

13.输出今天的日期 格式YYYY-MM-DD 2018-09-10

var d = new Date();
var year = d.getFullYear();  // 获取年,getFullYear()返回4位的数字
var month = d.getMonth() + 1;   // 获取月,月份比较特殊,0是1月,11是12月 
month = month < 10 ? '0' + month : month;     // 变成两位
var day = d.getDate();   // 获取日
day = day < 10 ? '0' + day : day; // 变成两位
alert(year + '-' + month + '-' + day);

14.

for(var i=1;i<=3;i++){
	setTimeOut(function(){
    		console.log(i);
    },0);
}

setTimeout是异步的代码,即使setTimeout中设置的等待时间为0也不会立刻执行,for循环代码是同步,所以要等待for循环执行完以后才会执行setTimeout。
上面这个代码块会打印三个 4 出来,而我们预想的结果是打印 1 2 3 。
之所以会这样,是因为 setTimeout 中的 i 是对外层 i 的引用。当 setTimeout 的代码被解释的时候,运行时只是记录了 i 的引用,而不是值。而当 setTimeout 被触发时,三个 setTimeout 中的 i 同时被取值,由于它们都指向了外层的同一个 i,而那个 i 的值在迭代完成时为 4,所以打印了三次 4
全文地址请点击:
https://blog.csdn.net/u012872875/article/details/52601477?utm_source=copy

15.数组和对象有哪些原生方法,列举一下?

Array.concat( ) 连接数组
Array.join( ) 将数组元素连接起来以构建一个字符串
Array.length 数组的大小
Array.pop( ) 删除并返回数组的最后一个元素
Array.push( ) 给数组添加元素
Array.reverse( ) 颠倒数组中元素的顺序
Array.shift( ) 将元素移出数组
Array.slice( ) 返回数组的一部分
Array.sort( ) 对数组元素进行排序
Array.splice( ) 插入、删除或替换数组的元素
Array.toLocaleString( ) 把数组转换成局部字符串
Array.toString( ) 将数组转换成一个字符串
Array.unshift( ) 在数组头部插入一个元素
Object.hasOwnProperty( ) 检查属性是否被继承
Object.isPrototypeOf( ) 一个对象是否是另一个对象的原型
Object.propertyIsEnumerable( ) 是否可以通过for/in循环看到属性
Object.toLocaleString( ) 返回对象的本地字符串表示
Object.toString( ) 定义一个对象的字符串表示
Object.valueOf( ) 指定对象的原始值

16.数组的判断?

17.window.onload和documentready的区别

window.onload 是在dom文档树加载完和所有文件加载完之后执行一个函数
document.ready原生中没有这个方法,jquery中有 $().ready(function),在dom文档树加载完之后执行一个函数(注意,这里面的文档树加载完不代表全部文件加载完)。
( d o c u m e n t ) . r e a d y w i n d o w . o n l o a d w i n d o w . o n l o a d (document).ready要比window.onload先执行 window.onload只能出来一次, (document).ready可以出现多次.

18.什么 是rpx?

rpx单位是微信小程序中css的尺寸单位,rpx可以根据屏幕宽度进行自适应。
以iphone6的物理像素750*1334为视觉稿进行设计,而在小程序中使用rpx为单位
iphone6下 1px = 1rpx = 0.5pt
使用rpx小程序会在不同分辨率的设备下自动进行转换,而px不会建议设计团队按iphone6来做设计图,因为
Iphone6 1px=1rpx
Iphone6 plus 1px=0.6rpx
Iphone6换算比较方便。
不是所有的单位都适合rpx,字体不适合rpx,会导致不同设备看不清

19.JSONP原理

1.JSONP的由来
根据浏览器同源策略,所谓同源就是ip地址、端口、协议都相同时。不同源之间是无法直接访问的,但是script标签的src属性的天然支持跨域(不同源之间请求访问)引用文件,所以JSONP利用了这个特点进行访问数据。JSONP是发送请求之后,后台包装好一段json数据,并且把数据放在一个callback(广大程序员做了一个君子约定,统一使用callback作为key)函数中,返回一个js文件。
2.JSONP有什么用
由于同源策略的限制,ajax的异步对象 new XMLHttpRequest只能请求同源的资源,为了实现跨域请求,可以通过JSONP实现跨域,从而解决数据的跨域请求句号
3.JSONP原理
3.1利用script标签src属性的天然支持跨域访问特点.
3.2利用get请求发送了一个函数的名字(callback)去服务器.
3.3服务器返回了一个函数的调用给浏览器.
3.4并且在函数的参数中传入需要返回的json数据.
这样就没有了不同源的限制.

猜你喜欢

转载自blog.csdn.net/fengtingYan/article/details/83021611