JavaScript初级面试题（一）

86 阅读 0 评论 57 点赞

我是靠谱客的博主要减肥皮皮虾，最近开发中收集的这篇文章主要介绍JavaScript初级面试题（一），觉得挺不错的，现在分享给大家，希望可以做个参考。

概述

一、关于字符串

1、如何截取字符串“http://www.iamhuangxiquan.com”中的www.i?
方一：substr方法；其语法是stringObject.substr(startIndex,length)，即第一个参数是目标字符串中第一项在原字符串中索引位置，第二个参数是目标字符串的长度。

   var str =" http://www.iamhuangxiquan.com";
   var newStrA = str.substr(7,5);

方二：substring方法；其语法是stringObject.substring(startIndex,endIndex)，即第一个参数是目标字符串中第一项在原字符串中索引位置，第二个参数是目标字符串中最后一项后面一项在字符串中索引位置。

    var newStrB = str.substring(7,12);
    console.log(newStrB);

方三：slice方法；该方法用法同substring方法

    var newStrC = str.slice(7,12);
    console.log(newStrC);

2、判断字符串是否是这样组成的，第一个必须是字母，后面可以是字母、数字、下划线，总长度为5~20；
才用正则的匹配方法，正则详细见https://mp.csdn.net/mdeditor/83903254#

var pattern = /^[a-zA-Z]{1}w{4,19}/

3、编写一个方法，求一个字符串的长度

 var str =" http://www.iamhuangxiquan.com";
 function strLength(s) {
       return s.length;
   }
   strLength(str);

4、如何实现一个删除字符串左边空白字符的方法？

 function leftTrim(a){
      return a.replace(/^s*/g,"")
  }

5、JavaScript的typeof都返回哪些数据类型？
undefined、null、string、number、object、boolean、function

6、写出下列每项的运算结果
A. typeof(null)——”object“
B. typeof(undefined)——”undefined“
C. typeof(NaN)——“number”
D. typeof(NaN==undefined)——“boolean”

7、”2“+1的结果是什么？为什么？
解析：结果是21，”2“是一个字符串，”+“起的是连接的作用，不是相加。

8、自定义一个函数，实现字符串反转。

 function revStr(str){
       var tmpStr = "";
       for(var i = str.length-1;i>=0;i--){
           tmpStr+=str.charAt(i);
       }
       return tmpStr;
   }
   var str ="abcd";
   console.log(revStr(str));

9、字符串操作主要有哪些？

求字符串长
字符串赋值
连接字符串操作
求子串
字符串比较
子串定位
字符串插入
字符串删除
字符串替换

二、关于变量

10、JavaScript中变量声明有var和没var的区别。
JavaScript中变量声明的作用域是以函数为单位的，在函数内部有var声明和没var声明的变量是不一样的。有var声明的变量是局部变量，没var声明的是全局变量。
在全局作用域内声明变量时，有var和没var是没有区别的。使用var重复声明语句是合法且无公害的。如果重复声明且带有赋值，那么就和一般的赋值语句没什么差别。如果尝试读取没有声明过的变量，JavaScript会报错。

11、JavaScript中如何检测一个变量是一个string类型？请写出函数实现。

var str = "hello world";
  function isString(s){
      if(typeof s == "string"||s.constructor == String){
          return true
      }
      else {
          return false;
      }
  }

12、计算下面的变量值。

    var a = Math.PI++;
    var b = Math.PI++;
    console.log(a);//3.141592653589793
    console.log(b);//3.141592653589793

解析：Math.PI是圆周率数值。输出结果没有改变。说明系统对象的属性是只读的。

13、有一个字符串abcd-ef-ghi，请用JavaScript将它处理成ghi&ef&abcd。

    var str = "abcd-gh-efi";
    var strA = str.split("-");
    var strB = strA.reverse().join("&");
    console.log(strB);

14、"undefined"变量和”undeclared“变量分别指什么？
解析：根本的区别在于，undefined是JavaScript语言数据类型，而undeclared却是一种JavaScript语法错误。
在JavaScript中，有两个表示”空“的值：undefined和null,其中比较有用的是undefined。undefined是一个值为undefined的类型。JavaScript语言也定义了一个全局变量，它的值是undefined,这个变量也被称为undefined,但是这个变量不是一个常量，也不是一个关键字。这意味着它的值可以轻易被覆盖。
undeclared则是一种语法错误，起始访问undeclared的变量并非会中断浏览器的执行。在浏览器运行山下文中，undeclared出来的变量简单可以认为没有var a这样定义变量。JavaScript引擎执行的时候，由于无法找到其对应的上下文（scope）,所以会简单的认为该变量是全局变量，就会把该变量定义到window中去。

15、JavaScript的两种变量范围有什么不同？
解析:
全局变量：当前页面内有效
区部变量：方法内有效

三、关于数据类型

16、列举JavaScript的数据类型。
解析：1）、Undefined类型：该类型只有一个值，就是undefined。当声明变量未初始化时，该变量默认就是undefined。如果函数没有返回值，也会显示undefined。
2）、Null类型：该类型只有一个值，就是null。undefined实际上是从null派生过来的，所以显示true。
3）、Boolean类型：布尔值，有两种值，true和false。非0即真，0可以看成false。
4）、String类型：理论上String可以无限制存放Unicode字符。赋值时单引号和双引号都一样。
5）、Number类型：Number类型中所有值都在最大值和最小值之间。非数字（not a number）是一个特殊的值。判断是否是数字用isNaN()方法。
6）、复合数据类型：function函数类型。object对象类型，object本质上是是一组无序的名值对组成的。array数组类型（它是一种特殊的object对象类型）

17、JavaScript中基本的数据类型有哪些？与primitive数据类型有哪些不同？
解析：
在JavaScript中有4中基本数据类型：数值（整数和实数）、字符串型（用单引号或双引号表示）、布尔型（用true和false表示）和空值。在JavaScript中的基本数据类型中的数据可以是常量也可以是变量。
primitive数据类型有：byte（字节）、short(短整型)、int（整型）、long(长整型)、float(浮点型)、double(双精度)、char(字符串)。

18、false==0的结果是什么？
解析：
因为逻辑值真（true）和假（false）被当作数值运算时其值为1和0。
所以结果是true。

四、window的属性和方法

19、如何实现alert中的换行？
解析：
实现换行的是n。代码如下

<script language="JavaScript" type="text/javascript">
    alert("hellonworld");
</script>

20、document.write和innerHTML的区别。
解析：
write是document的一个方法，是在页面里写内容，他会覆盖页面内容，是写死的。innerHTML是DOM(Document Object Model)元素对象的一个属性，用于设置内容。

21、有如下代码，在不改写已有body部分代码的情况下，编写JavaScript函数来实现单击id为text列表中的li时，获取其内容，比如点第一个li时，alert出“第一行”。

<body>
  <ul id="text">
    <li>第一行</li>
    <li>第二行</li>
    <li>第三行</li>
  </ul>
</body>

解析：

<script language="JavaScript" type="text/javascript">
    var li = document.getElementsByTagName("li");
    for(var i = 0;i < li.length;i++){
       li[i].onclick=function(){
           alert(this.innerHTML);
       }
    }
</script>

22、JavaScript中的三种弹出式消息提醒，分别为alert、confirm、prompt,请简要阐述。
解析：
alert——弹出警告框。在文本里面加入n就可以换行。
confirm——弹出确认框。会返回布尔值，通过这个值可以判断单击时是“确认”还是“取消”。true表示单击了“确认”，false表示单击了“取消”。
prompt——弹出输入框。单击“确认”会返回输入框中的值，单击“取消”返回null。

23、请实现鼠标单击页面中的任意标签，alert该标签的名称（注意兼容性）。

<script language="JavaScript" type="text/JavaScript">
   document.onclick=function(e){
       e = e || window.event;//e对象存在时返回e，window.event存在时返回event。区分ff和ie浏览器
       var o = e.srcElement || e.target;//ie下支持e.srcElement;ff下支持e.target。
       /*target事件属性可返回事件的目标节点（触发该事件的节点），如生成的元素、文档或窗口*/
       alert(o.tagName);
   }
</script>

补充：参数e是事件执行参数，上面代码中是鼠标点击事件，当点击时就会出现e，e有很多的属性。如若不理解，可以在上面代码中console.log(e),会出现如下图所示：
在这里插入图片描述
23、下面的JavaScript代码中，alert的结果是多少？

 var a = 21;
  function f(){
      alert(a);
      var a = 22;
  }
  f();

解析：undefined。自我理解是在在函数作用域重新定义变量a时，外面的全局变量就不会在影响到函数作用域里的a，因为新的a已将它给覆盖掉。但是变量定义是会被提前的，赋值却不会被提前，所以答案是undefined。

24、结合<span id="outer"><span id="inner">我是小可爱</span></span>这段结构，谈谈InnerHTML和outerHTML之间的区别。
解析：

innerHTML：是设置或获取位于对象起始和结束标签内的HTML
outerHTML：是设置或获取对象标签及其里面的HTML
补充：自己通过下面代码来理解上面答案

  var outer = document.getElementById("outer");
  console.log(outer.innerHTML);//<span id="inner">我是小可爱</span>
  console.log(outer.outerHTML);//<span id="outer"><span id="inner">我是小可爱</span></span>

25、单击一个按钮，如何刷新整个页面？
解析：
先介绍下两个方法的语法：
（1）reload方法强迫浏览器刷新当前页面。
语法：location.reload([bForceGet]);
参数：bForceGet,可选参数，默认为false，从客户端缓存里取当前页。如果为true,则以GET方式从服务端取到最新的页面，相当于客户端单击“F5”（刷新）。
（2）replace方法通过指定URL来替换当前缓存在历史里（客户端）的项目。
因此当使用replace方法之后，不能通过“前进”和“后退”来访问已经被替换的URL。
语法：location.replace(URL);
在实际应用中，当重新刷新页面时，我们通常使用location.reload()或者是history.go(0)。因为这种做法就像是在客户端单击“F5”刷新页面，所以页面的method="post"的时候，会出现“网页过期”的提示。那是因为Session的安全保护机制。