面试题1

1、promise的api有哪些?

  promise.then:

  1. promise的异步结果,只能在完成状态时才能返回,而且我们在开发中是根据结果来选择来选择状态的,然后根据状态来选择是否执行then()。

  2. 实例化的Promise内部会立即执行,then方法中的异步回调函数会在脚本中所有同步任务完成时才会执行。因此,promise的异步回调结果最后输出。示例代码如下:

  var promise = new Promise(function(resolve, reject) {
    console.log('Promise instance');
    resolve();
  });

  promise.then(function() {
    console.log('resolved result');
  });
  for(var i=0;i<100;i++) {
  console.log(i);
  /*
  Promise instance
  1
  2
  3
  ...
  99
  100
  resolved result
  */

  promise.all:

  promise.race:

    Promise.race 的一般使用场景是给 Promise 设置一个 timeout/deadline 或者 abort 一个 Promise

  promise.reject:

  promise.resolve:

  promise.catch:

2、跨域

  跨域我们称之为非同源策略,只要有域名、协议、端口其中一个不一样,我们都称之为跨域。常用的解决跨域的办法:jsonp、cors、iframe、message、中间件、反向代理

  jsonp:

    缺点:只能发送get请求,安全性比较低,容易出现内存泄漏

jsonp是json的数据使用模式

    发送请求的方式:

   <script type="text/javascript" src="http://169.254.200.238:8080/jsonp.do"></script>

当使用这种方式的时候,虽然能请求到数据,但是浏览器会捕获到相应的错误
//通过JQuery Ajax 发起jsonp请求
(注:不是必须通过jq发起请求 , 
     例如:Vue Resource中提供 $.http.jsonp(url, [options]))
$.ajax({ // 请求方式 type: "get", // 请求地址 url: "http://169.254.200.238:8080/jsonp.do", // 标志跨域请求 dataType: "jsonp", // 跨域函数名的键值,即服务端提取函数名的钥匙(默认为callback) jsonp: "callbackparam", // 客户端与服务端约定的函数名称 jsonpCallback: "jsonpCallback", // 请求成功的回调函数,json既为我们想要获得的数据 success: function(json) { console.log(json); }, // 请求失败的回调函数 error: function(e) { alert("error"); } });

  cors:

    优点:支持get、post请求,后端指定源码,当使用*作为端口号时,是一个多源,但是其安全性也随之降低,不能携带cookie

 cors的请求方式和正常一样

    $.ajax({

      type:"";//请求方式

      url:"";

      datatype:"json";

      success:function(){

        conslog.log

        }

      })

一般而言,这两种跨域方式就可以了。

注意:

ajax发送其请求的方式有:

1、  $.ajax({

    url:"ajaxServlet1111" , // 请求路径

    type:"POST" , //请求方式 

    data:{"username":"jack","age":23},//请求参数

    success:function (data) {

       alert(data);

       },//响应成功后的回调函数

    error:function () {

      alert("出错啦...")

      },//表示如果请求响应出现错误,会执行的回调函数

    dataType:"text"//设置接受到的响应数据的格式

  });

2、 $.get():发送get请求 *

语法:

  $.get(url, [data], [callback], [type])

*参数:

  * url:请求路径

  * data:请求参数

  * callback:回调函数

  * type:响应结果的类型

3. $.post():

    语法:$.post(url, [data], [callback], [type])

* 参数: * url:请求路径 * data:请求参数 * callback:回调函数 * type:响应结果的类型

 

3、垂直居中的几种方法

  垂直居中有1、display:flex;

       2、display:table-cell(缺陷是宽高不能使用百分比)

       3、position:absolute;margin:0 auto;使用绝对定位

       4、js实现

       5、transform

  解决垂直居中的方法有以上5种,当使用绝对定位实现垂直定位时,支持浏览器IE8-IE10,宽高也可以使用百分比,但是可能会出现溢出,(需要设置over-flow:auto),还需要声明高度。在实际的开发中,我们使用display:flex比较多,但是flex不兼容IE8及以下的版本。而通过阅读一些博客,我发现display:table-cell也能实现垂直居中哦,但是宽高不能百分比。

 4、watch的选项有?computed和watch的区别

  computed:具有缓存性,依赖于其他属性值的变化而变化,只有监听到属性值发生改变之后,computed才会返回内容

  watch:只要监听到数值发生变化,watch就会执行回调函数,并且在这过程中执行复杂的逻辑操作。

  

  当我们需要对监听对象执行复杂的逻辑操作时,使用watch。当我们需要对监听的对象依赖于其他属性的值来动态获取值的时候使用computed

  

  watch的选项有:

    immediate:

    deep:当deep为true时,如果监控的对象是数组,那么对对象中的每一项进行求值,此时会将当前watcher存入到相对应的属性的依赖中去,这样数组中对象发生变化时,也会通知数组进行更新

 

5、es6和es5的区别

  es6和es5相比较,es6多了块级作用域let,const。es6多了箭头函数。

 

6、.sync的理解

  这和v-model一样是一则语法糖。但是v-model相当于@click,v-bind,意思是绑定value的值

在vue中,我们常用的是父子组件通信,父组件通过props是向子组件传递数据,数据只能在props中更新并且传递给子组件。而子组件是通过事件emit向父组件发出请求。子组件不能修改props中数据。而当我们需要在子组件内部更改数据的值并且传给父组件时,这时候就需要用.sync修饰符了

  用法是:

    <child :name.sync="name"></child>

 

7、vuex是什么?如何从vue中获取数据

  vuex是框架中的状态管理,有5个状态值:state,getter,mutation,action,modules

    state:这是管理全局的数据

    getter:getters相当于计算属性,用来重新修改state中变量的值,再返回对应的值,类似于vue的过滤器

    mutation:只支持同步执行,保存的是state的函数,唯一一个可以更改state中的值,传入两个参数,第一个参数为state,第二个参数为传入的数据,一般为一个对象

    action:功能用法和mutation一样,但是action支持异步执行。保存的是触发mutations的函数,让mutations去修改state中的值,获取数据后再通过context.commit()触发更改

    modules:当我们的state比较大的时候,我们会使用modules将其模块化

8、vue中的生命周期

  略

 

9、settimeout是什么?...是什么?

    setTimeout是延时,

    ...是展开运算符,

 

 

上一篇:8.axios,jsonp的用法


下一篇:gulp为css,js添加版本号