面试题1

说出页面传值的方式?

1. 使用window.open与opener  实现子父窗口的传值;
2. url地址传值  http://baidu.com?uanme=abc&&upwd=abc123
3. session页面之间传递值
4. sql也能实现页面之间传值,a页面插入数据库,b页面去读数据

HTMLCollection和NodeList的共同

都是类数组对象，都有length属性
都有共同的方法：item，可以通过item(index)或者item(id)来访问返回结果中的元素
都是实时变动的（live），document上的更改会反映到相关对象上
（例外：document.querySelectorAll返回的NodeList不是实时的）

HTMLCollection和NodeList的区别

NodeList可以包含任何节点类型，HTMLCollection只包含元素节点（elementNode），
elementNode就是HTML中的标签
HTMLCollection比NodeList多一项方法：namedItem，可以通过传递id或name属性来获取节点信息


document.getElementsByName 返回 NodeList
document.getElementsByTagName 返回HTMLCollection

NodeList 是一个历史遗留问题,当初为xml而设计;

总结get和post区别—面试用

get参数通过url传递，post放在request body中。
get请求在url中传递的参数是有长度限制的，而post没有。
get比post更不安全，因为参数直接暴露在url中，所以不能用来传递敏感信息。
get请求只能进行url编码，而post支持多种编码方式
get请求会浏览器主动cache，而post支持多种编码方式。

get请求参数会被完整保留在浏览历史记录里，而post中的参数不会被保留。

GET和POST本质上就是TCP链接，并无差别。但是由于HTTP的规定和浏览器/服务器的限制，导致他们在应用过程中体现出一些不同。
GET产生一个TCP数据包；POST产生两个TCP数据包。
长的说：

对于GET方式的请求，浏览器会把http header和data一并发送出去，服务器响应200（返回数据）；

而对于POST，浏览器先发送header，服务器响应100 continue，浏览器再发送data，服务器响应200 ok（返回数据）。

（据研究，在网络环境好的情况下，发一次包的时间和发两次包的时间差别基本可以无视。而在网络环境差的情况下，两次包的TCP在验证数据包完整性上，有非常大的优点。）

ajax的同步与异步

1.浏览器软件 本身多进程,多线程
2. 但是单个页面是 单线程,只能是从往下执行
3. 同步会在页面中造成阻塞,等当做步骤执行完成后,才能执行下一个步骤;

异步:可以解决并发,多个任务一起执行.无需等待结果.(回调函数,Promise,async await)

请说说 bind和call,apply的区别?

 都是this的指向更改方法.
 
 bind(): 作用改变函数的 this,但是bind不会立即执行
        它是在函数名称的后面+ bind(改变的对象)a

 call(): 作用也是改变函数的this,立即执行.
        call函数里的参数,第一个就是要改变的this对象,后面就是对应参数

apply(): 作用也是改变函数的this,立即执行.与call一样
       apply 只有2个参数,第一个参数修改this的指向
       第二参数,是一个数组;

定义模式

    PubSub = {
        // 有一个斗鱼平台
        douYu : {},
        //某粉丝fn 关注了某主播key
        addLiten : function(key, fn){
            //判断斗鱼有没有某某主播
            if(!this.douYu[key]){
                  this.douYu[key] = [];// 新主播key ,新粉丝团 [] 
            }
            
            this.douYu[key].push(fn);

        },
        //上线通知. 某某主播,通知某某主播的粉丝
        trigger : function(key){
            var list = this.douYu[key];//得到某主播的 粉丝团
            for(var i = 0; i < list.length; i++){
                list[i].call();
            }
        },
        
        //取消 ,某粉丝取消某某主播的关注
        off : function(key, fn){
            if(arguments.length==1){
                delete(this.douYu[key])
            }
            if(this.douYu[key]){

                for(var i = 0; i < this.douYu[key].length; i++){
                    if(this.douYu[key][i] == fn){
                        //delete(this.douYu[key][i])
                        this.douYu[key].splice(i, 1);
                    }
                }
            }
        }
    }
    
    // 关注 ftm 冯提莫
     function fs1(){
         console.log("周杰伦");
     }
    PubSub.addLiten("冯提莫",fs1)

    //粉丝2号
    function fs2(){
        console.log("陆超..真好");
    }
    PubSub.addLiten("冯提莫",fs2);

    //粉丝3号
    function fs3(){
        console.log("陆灯..真好");
    }
    PubSub.addLiten("冯提莫",fs3);
    
    //粉丝4号
    function fs4(){
        console.log("B超..真好");
    }
    PubSub.addLiten("冯提莫",fs4);

    //取消关注
    PubSub.off("冯提莫",fs3);

    //冯提莫上线
    PubSub.trigger("冯提莫");

jQuery.extend 和jQuery.fn 有什么区别?

 jQuery.extend全局方法(为扩展工具而诞生 $.each,$.ajax)
 jQuery.fn.extend 为扩展插件而诞生

 jQuery.extend ==jQuery.fn.extend
 jQuery.fn = jQuery.prototype
 jQuery.prototype.extend

 都是往jQuery的原型添加方法