AJAX

99 阅读1分钟
  • 原生方法操作真实接口
<script>
    function getUserInfo(){
        /* 需要先判断有没有token 有token 就不提示直接获取数据
        没有token 就给个提示 请先登录 获取token 不执行下面的内容 */
        if(!localStorage.token){
            alert('请先登录,获取token!!')
            return;
        }
        let xhr = new XMLHttpRequest();
        /* pagenum=1 表示取第一页的数据 */
        /* pagesize=5 表示显示5条数据 */
        let url = 'http://timemeetyou.com:8889/api/private/v1/users?pagenum=1&pagesize=6';
        xhr.open('get', url, true);
        xhr.setRequestHeader('Authorization',localStorage.token)
        xhr.send();
        xhr.onreadystatechange = function () {
            if (xhr.readyState == 4) {
                let res = JSON.parse(xhr.responseText)
                console.log(res);
            }
        }
    }

    function login() {
        let xhr = new XMLHttpRequest();
        let url = 'http://timemeetyou.com:8889/api/private/v1/login';
        xhr.open('post', url, true);
        let params = {
            username: "admin",
            password: "123456"
        }
        /* post需要添加请求头 */
        /* 请求回来的内容是json格式 */
        /* Content-type 表示请求内容的类型 */
        /* application/json 表示请求内容的类型的具体的值 */
        xhr.setRequestHeader("Content-type", "application/json")
        xhr.send(JSON.stringify(params));
        xhr.onreadystatechange = function () {
            if (xhr.readyState == 4) {
                let res = JSON.parse(xhr.responseText)
                console.log(res);
                localStorage.token = res.data.token;
                // location.href="shop.html"
            }
        }
    }

</script>
  • 面向对像
<script>
    /* console.log('1'==='1');  *//* =>true */
    /*  console.log( Symbol('1') == Symbol('1') ); */
    /*  用Symbol包裹的数据是唯一的 独一无二的 */
    /*  console.log( Symbol('1') ); */
    /* 首字母开头大写的叫 构造函数 可以new */
    //   let obj = new Object()
    //   console.log(obj);
    /* let a = new Symbol('username')  不可以new*/

    /* 两个人在同时开发一个页面 */
    /* 小A定义了对象obj */
    //    let obj = {
    //        username:"zhangsan"
    //    }
    //    /* 小B 不知道这个obj 有的key叫username
    //    把username 重新赋值了 造成了问题*/
    //    obj.username = 'lisi'

    //    console.log(obj);

    // let obj = {
    //     [Symbol('username')]: "zhangsan"
    // }
    // console.log('old',obj);
    // obj.username = 'lisi'
    // console.log('new',obj);

    // [] 如果里面的时候一个变量 可以直接写 o[user1]
    // 这里面的user1 就是一个变量
    // o['user1'] =>{user1:'zhangsan'}
    // let user1 = 'username'; 
    // let o = {}; /* => {username:'zhangsan'} */
    // o[user1] = 'zhangsan'
    

</script>
  • 基础知识
 <script>
    /* 基于Object的方式创建对象 */
    /* Object 类 */
    /* obj 实例化出来的对象 */
    //  let obj = new Object();
    //  obj.name = '涛涛';
    //  obj.age = '30';
    //  obj.playGame = function (){
    //     document.write('我nba2k 超级溜');
    //  }
    //  document.write(obj.name + '<br>');
    //  document.write(obj.age + '<br>');
    //  obj.playGame();

    /* 对象字面量 */
    /* 对象字面量
    对象定义的一种简写形式
    简化创建包含大量属性的对象的过程
    在为函数传递大量可选参数时,可考虑使用对象字面量 */


 </script>