三七互娱前端面试

明天下午就要参加三七互娱的前端笔试了,但是心里没底,没有做过题,所以今天恶补一下。一下题目均为三七互娱前端题


一、用js写出一个冒泡排序算法。

  1. 看到这个题我是懵的,因为冒泡排序我已经忘了具体是啥了。
  2. 知识点:冒泡排序算法

首先解释一下冒泡排序算法:好比有一个水缸,现在有 N 个水泡在里面,并且杂乱无章的竖直排列。然后因为自然规律,水泡大的会先浮出来。所以算法来了,就是从水缸底部开始依次比较,如果最底部的大于它上面的那个,就往上浮动,然后小的那个就被挤下去。如此,就两两比较,直到最大的到最上面,第一轮结束。第二轮,又从最底部开始,与上相同,直到重复了 N-1 次。

其实跟以前学C语言做那种有形状的字母排序是一个道理。核心就是有一个空的地方可以存放大的,然后换位置。

let bubbleSort=array=>{
    let len=array.length
    let temp
    for(let i=0;i<len-1;i++){
        for(let j=0;j<len-1-i;j++){
            if(array[j]>array[j+1]){
                  temp=array[j];
                  array[j]=array[j+1];
                  array[j+1]=temp;
            }   
        }
    }
}
let array=[1,2,3,6,8,5,4]
console.log(bubbleSort(array)) //1234568

二 、CSS中的选择器的优先级是怎么样的?如何优化选择器?

优先级:行内样式>id>class>标签

优化:

  1. 避免使用通配符,因为css属性是可以继承的,如果说在通配符中设置了颜色,那么有时候想让某个字颜色是继承的父级元素,那么这时不会生效,而是通配符所设置的颜色。所以通配符的使用要慎重。
    2.尽量少操作标签,而是使用class。
    3.通过继承去少写一些重复的代码。
    4.尽量少使用后代选择器,因为后代选择器不仅选择子代,还会选择孙子。。。。。哈哈哈。意思就是选择的太多了!但是,还是要分情况,因为只使用子代选择器可能会造成代码量过多,所以要灵活使用

三 、使用HTML5写出一个页面,包含头部、页头、页脚、文字内容和图片

考察的是h5的语义化标签,常用的有header、footer、nav(导航栏标签,定义导航栏)、section、video、audio、article(独立的内容区域,文本类型)、aside(页面的侧边栏去使用)、details(展示详情,使用场景比如说点击展开详情)、mark(会给一个字段添加背景色,并且不能被修改)、progress(进度条,但是丑)、section(类似于平时用div去包裹一个组件使用)、datalist(模糊查询)、canvas(大名鼎鼎的画布,还没学习哈哈哈)、dialog(聊天框)等等

<header>
    <nav></nav>
</header>

<section>
    <aside></aside>
    <article>
        <!--以下省略标签符号-->
        hgroup
        p
        dialog
    </article>
</section>

<footer>
</footer>

四 、前端页面的优化方法有哪些?有什么优化工具?

优化方法:

  1. 减少http请求,特别是vue在请求http时,要将请求放在父组件中,不然每个子组件都去请求一遍就很浪费性能
  2. CSS写在顶部,JavaScript写在尾部或异步
  3. 延时加载图片
  4. 使用iconfont
  5. 使用CDN
  6. 使用缓存,在vue中可以使用keep-alive,这样重复访问一个页面时就不会重新去请求,而是从缓存中取出来直接使用。

优化工具:

  1. 真实用户浏览页面分析:OneAPM Browser Insight(统计分析网站流量,定位网站性能瓶颈)
  2. 页面结构分析工具: PageSpeed(google官方的页面载入速度检测工具)

五 、创建子类Child,使用原型和构造函数的方式继承父类People的方法,并调用say函数说出姓名和年龄

考察原型和原型链,JS三座大山自不必说

function People(){
    this.name="edison"
    this.age=22
}

People.prototype.say=function(age,name){
    console.log("my name is "+name+" and i am "+age)
}

let child=new People()
child.say(23,"bruce") //my name is bruce and i am 23
child.__proto__.say(23,"bruce") //和上面效果一样,不过时调用了__proto__

六、2016-12-12类型的日期格式校验正则表达式

考察正则,这是短板没学过,恶补一下

七 、使用ajax(可使用jQuery框架,若使用其他框架请注明)写一个跨域异步获取JSON数据方案;说说能否使用JS进行跨域异步post数据

使用post参考https://developer.mozilla.org/zh-CN/docs/Web/HTTP/Access_control_CORS

//使用vue
//
//这是在页面中请求axios,即ajax
axios.get("api/index.json")


//这是在webpack配置跨域
proxy:{
    //一旦遇到api开头的就直接转到target对应的网址
    "/api":{
        target:"http://localhost:8080",
        //使用正则,意思是一旦遇到api,就替换为mooc
        pathRewrite:{
            "^/api":"/mook"
        }
    }
}

八 、考察样式

常见的背景颜色、文字居中、边框、文字阴影、模糊等

九 、对数组testArray进行以下操作:a.从前面删除一个数字 b.从前面增加一个数字5 c.给数组从小到大进行排序 d. 反转数组 e.在数组61之后加入62、63、64

考察常见的数组操作,给定的数组为[3,4,61,8,1]

let testArray=[3,4,61,8,1]

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

推荐阅读更多精彩内容