前端面试题

1.正则表达式构造函数 var reg = new RegExp('xxx')与正则表达字面量 var reg = // 有什么不同?

使用正则表达字面量的效率更高解析:下面的示例代码演示了两种可用于创建正则表达式以匹配反斜杠的方法:

//正则表达字面量

var re = /\\/gm;

//正则构造函数

var reg = new RegExp("\\\\", "gm");

var foo = "abc\\123"; // foo的值为"abc\123"
console.log(re.test(foo)); //true
console.log(reg.test(foo)); //true

如上面的代码中可以看到,使用正则表达式字面量表示法时式子显得更加简短,而且不用按照类似类(class-like)的构造函数方式思考。

其次,在当使用构造函数的时候,在这里要使用四个反斜杠才能匹配单个反斜杠。这使得正则表达式模式显得更长,更加难以阅读和修改。
正确来说,当使用 RegExp()构造函数的时候,不仅需要转义引号(即"表示"),并且通常还需要双反斜杠(即\表示一个\)。
使用 new RegExp()的原因之一在于,某些场景中无法事先确定模式,而只能在运行时以字符串方式创建。

2.异步加载 js 的方法

方案一:‹script›标签的 async="async"属性
点评:HTML5 中新增的属性,Chrome、FF、IE9&IE9+均支持(IE6~8 不支持)。此外,这种方法不能保证脚本按顺序执行。

方案二:‹script›标签的 defer="defer"属性
点评:兼容所有浏览器。此外,这种方法可以确保所有设置 defer 属性的脚本按顺序执行。

方案三:动态创建‹script›标签
示例:

‹!DOCTYPE html›
‹html›
  ‹head›
    ‹script type="text/javascript"›
      (function() {
        var s = document.createElement_x("script");
        s.type = "text/javascript";
        s.src = "http://code.jquery.com/jquery-1.7.2.min.js";
        var tmp = document.getElementsByTagName_r("script")[0];
        tmp.parentNode.insertBefore(s, tmp);
      })();
    ‹/script›
  ‹/head›
  ‹body›
    ‹img src="http://xybtv.com/uploads/allimg/100601/48-100601162913.jpg" /›
  ‹/body›
‹/html›

点评:兼容所有浏览器。

方案四:AJAX eval(使用 AJAX 得到脚本内容,然后通过 eval_r(xmlhttp.responseText)来运行脚本)
点评:兼容所有浏览器。

方案五:iframe 方式(这里可以参照:iframe 异步加载技术及性能 中关于 Meboo 的部分)
点评:兼容所有浏览器。

3.去除数组重复成员的方法

方法 1 扩展运算符和 Set 结构相结合,就可以去除数组的重复成员
// 去除数组的重复成员

[...new Set([1, 2, 2, 3, 4, 5, 5])];
// [1, 2, 3, 4, 5]

方法 2

function dedupe(array) {
  return Array.from(new Set(array));
}
dedupe([1, 1, 2, 3]); // [1, 2, 3]

方法 3(ES5)

function unique(arry) {
  const temp = [];
  arry.forEach(e =› {
    if (temp.indexOf(e) == -1) {
      temp.push(e);
    }
  });

  return temp;
}

4.去除字符串里面的重复字符

最简单的方式[...new Set("ababbc")].join(""); // "abc"

5求数组的最大值

Math.max.apply(null, 数组)var a = [1, 2, 3, 5];
alert(Math.max.apply(null, a)); //最大值
alert(Math.min.apply(null, a)); //最小值

6. 你是如何将一个 HTML 元素添加到 DOM 树中的?

你可以用 jQuery 方法 appendTo() 将一个 HTML 元素添加到 DOM 树中。这是 jQuery 提供的众多操控 DOM 的方法中的一个。你可以通过 appendTo() 方法在指定的 DOM 元素末尾添加一个现存的元素或者一个新的 HTML 元素。

7. 你能用 jQuery 代码选择所有在段落内部的超链接吗?

这是另一个关于选择器的 jQuery 面试题。就像其他问题那样,只需一行 jQuery 代码就能搞定。你可以使用下面这个 jQuery 代码片段来选择所有嵌套在段落(‹p›标签)内部的超链接(‹a›标签)

8. $(this) 和 this 关键字在 jQuery 中有何不同?

这对于很多 jQuery 初学者来说是一个棘手的问题,其实是个简单的问题。(this) 返回一个 jQuery 对象,你可以对它调用多个 jQuery 方法,比如用 text() 获取文本,用val() 获取值等等。而 this 代表当前元素,它是 JavaScript 关键词中的一个,表示上下文中的当前 DOM 元素。你不能对它调用 jQuery 方法,直到它被 () 函数包裹,例如(this)。

9. 你如何使用jQuery来提取一个HTML 标记的属性 例如. 链接的href?

attr() 方法被用来提取任意一个HTML元素的一个属性的值. 你首先需要利用jQuery选择及选取到所有的链接或者一个特定的链接,然后你可以应用attr()方法来获得他们的href属性的值。下面的代码会找到页面中所有的链接并返回href值:

$('a').each(function(){
   alert($(this).attr('href'));
});

10. 你如何使用jQuery设置一个属性值?

前面这个问题之后额外的一个后续问题是,attr()方法和jQuery中的其它方法一样,能力不止一样. 如果你在调用attr()的同时带上一个值 例如. attr(name, value), 这里name是属性的名称,value是属性的新值。

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 199,902评论 5 468
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 84,037评论 2 377
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 146,978评论 0 332
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 53,867评论 1 272
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 62,763评论 5 360
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,104评论 1 277
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 37,565评论 3 390
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,236评论 0 254
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,379评论 1 294
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,313评论 2 317
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,363评论 1 329
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,034评论 3 315
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,637评论 3 303
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,719评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 30,952评论 1 255
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 42,371评论 2 346
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 41,948评论 2 341

推荐阅读更多精彩内容

  • 本篇收录了一些面试中经常会遇到的经典面试题以及自己面试过程中遇到的一些问题,并且都给出了我在网上收集的答案。马上就...
    菲菲菲菲妞阅读 903评论 0 3
  • 一、理论基础知识部分 1.1、讲讲输入完网址按下回车,到看到网页这个过程中发生了什么 a. 域名解析 b. 发起T...
    我家媳妇蠢蠢哒阅读 3,108评论 2 106
  • HTML、CSS部分 要点:对Web标准的理解、浏览器差异、CSS基本功:布局、盒子模型、选择器优先级及使用、HT...
    王钰峰阅读 210评论 0 0
  • 数组去重indexOf() 方法可返回某个指定的字符串值在字符串中首次出现的位置。新建一新数组,遍历传入数组,值不...
    LJQ21阅读 716评论 0 7
  • 数组去重 indexOf()方法可返回某个指定的字符串值在字符串中首次出现的位置。 新建一新数组,遍历传入数组,值...
    LJQ21阅读 300评论 0 1