前端面试题之常见笔试题

一.position的默认值是什么？relative 和absolute 有什么区别？

默认值：static（没有定位） relative 相对定位 absolute 绝对定位 父相子绝

二.js判断变量为数组你能写出哪些方法？

• 1.arr instanceof Array【不能跨页面判断】
• var arr = [1,2,3]; console.log(arr instanceof Array);//true
• 2.arr.constructor === Array【不能跨页面判断】
• var arr = [1,2,3]; console.log(arr.constructor === Array);//true
• 3.Array.isArray(arr)【兼容问题】
• 4.Object.prototype.toString.call(arr) （最无懈可击 也就是最好的方法）
• var arr = [1,2,3]; console.log(Object.prototype.toString.call(arr) === '[object Array]');//true
• js有哪些创建对象的方式？

• 1. 对象字面量方式

• 对象字面量方式是创建自定义对象的首选模式，简单方便。
• var per = {
           name:'zhangsan',
           age:25,
           job:'html',
           sayName:function(){
               alert(this.name);
           }
       }
• 2、工厂模式
• 3、构造函数模式

• function Person(name,age,job){
      this.name= name;
      this.age = age;
      this.job = job;
      this.sayName = function(){
          alert(this.name);
      }
  }

  var person1 = new Person('zhang',30,'java');
  var person2 = new Person('zhao',25,'php');

• 4、原型模式

• 创建的每个函数都有一个prototype(原型)属性，这个属性是一个指针，指向一个对象，

• 三。如何判断图片加载完成？

• 1、load事件

•  img1.onload = function () {

    p1.innerHTML = 'loaded'}

• 2、readystatechange事件

• 方法一（闭包）：

• var $imgs = $('.img');//所有图片
//判断图片加载完成
for (var i = 0; i < $imgs.length; i++) {
    ($imgs[i].onload = function(i) {
        return function() {
            if(i == $imgs.length-1) {
                console.log('最后一张图片加载完成！');
            }
        }
    }(i));
}

• 方法二： 使用deferred

• var defereds =[];

• var $imgs = $('.img');//所有图片

• // 判断图片加载完成

• $imgs.each(function() {

• var dfd = $.Deferred();

• $(this).load(dfd.resolve);

• defereds.push(dfd);});

• $.when.apply(null, defereds).done(function() {

• console.log('全部加载完成!')

• });

• 4.如何将vue中data里的变量class_id拼接到一下绑定的属性href里的地址后边作为参数？

  v-bind:href="/sanjieke/text"

  v-bind:属性=“ ‘字符串’+自定义变量名”，

•  v-bind:href="['xxx/detail/'+item.Id]"