zoukankan      html  css  js  c++  java
  • js封装 与 js高级用法 问题集合

    1. 什么是自执行的匿名函数?
       它是指形如这样的函数: (function {// code})();
    2. 疑问 为什么(function {// code})();可以被执行, 而function {// code}();却会报错?
    3. 分析
    (1). 首先, 要清楚两者的区别: (function {// code})是表达式, function {// code}是函数声明.
    (2). 其次, js"预编译"的特点: js在"预编译"阶段, 会解释函数声明, 但却会忽略表式.
    (3). 当js执行到function() {//code}();时, 由于function() {//code}在"预编译"阶段已经被解释过, js会跳过function(){//code}, 试图去执行();, 故会报错;
    当js执行到(function {// code})();时, 由于(function {// code})是表达式, js会去对它求解得到返回值, 由于返回值是一 个函数, 故而遇到();时, 便会被执行.

    另外, 函数转换为表达式的方法并不一定要靠分组操作符(),我们还可以用void操作符,~操作符,!操作符……

    例如:
    bootstrap 框架中的插件写法:
    !function($){
      //do something;
    }(jQuery);


    (function($){
      //do something;
    })(jQuery); 是一回事。

    匿名函数最大的用途是创建闭包(这是JavaScript语言的特性之一),并且还可以构建命名空间,以减少全局变量的使用。
    例如:
    var a=1;
    (function()(){
        var a=100;
      })();
    alert(a); //弹出 1
    更多 闭包和匿名函数 可查看 Javascript的匿名函数与自执行 这篇文章。

    <摘自:http://www.cnblogs.com/joey0210/p/3408349.html>

     举一反三:

    不难发现,如下代码也是可以的:

    <script>
        var str = function(){
            var s1 = "a";  
            var s2 = "b"; 
            return s1+s2;
        }();
        alert(str);
    </script>

    执行结果:弹出"ab"。

    2.  js中this指代的对象

    js 中this指代的是当前的上下文对象,即离他最近的一个function对象(也就是js中的类)。

    <script type = "text/javascript"> 
    (function() {
    
        var data = {
            movePage: function() {
                this.arg = 1;
                this.dowhat = {
                    method1: function() {
                        alert("1当前对象的arg属性值:" + this.arg);
                    },
                    method2: function() {
                        alert("2当前对象的arg属性值:" + this.arg);
                    }
                };
            }
        };
    
        var test = new data.movePage();
        // 我们通常的调用函数的形式。alert的值为undefined
        test.dowhat.method1();
        // 改变this对象指代的当前上下文。
        // 也就是说:这句代码会执行method1方法,并且将this指代的当前上下文指到test对象,即movePage函数。
        // 而movePage函数中arg的值为1,那么alert后的值为1
        test.dowhat.method1.call(test);
    
    })();
    </script>

     执行结果:第一次弹出:undefined  第二次弹出:1

     小技巧:

      我们可以通过使用alert(xxx);来看一个对象是什么类型的。我们可以得到类似于下面的alert框
             

    通过上面的描述和例子,我们就不难发现:

    例1:

    1. $("#textbox").hover(   
    2.       function() {   
    3.            this.title = "Test";   // 也可以通过$(this)拿到jquery对象,然后使用$(this).attr("title", "Test");来达到目的
    4.       }
    5. );

    上面的例子中this对象指向的是js中原生的js对象,所以this也就是js中原生的dom对象。

    例2:

    jquery插件编写里总是会用到如下的代码:

    (function( $ ) {
        $.fn.myPlugin = function() {
            // Do your awesome plugin stuff here
        return this.each(function(){.......});//主要为了能够链式调用,将jqery对象return }; })( jQuery );
    这里的this指向的是myPlugin对象,也就是jquery对象,所以它可以直接使用jquery的each方法


  • 相关阅读:
    2015腾讯暑期实习笔试题目
    二叉树的优点和缺点
    pandas对象保存到mysql出错提示“BLOB/TEXT column used in key specification without a key length”解决办法
    事务的隔离机制
    Flink Sink定制开发
    Presto实现定时从配置文件读取配置
    LDAP与Sentry API使用
    Presto压测报告
    PrestoSPI安全扩展
    项目重构总结
  • 原文地址:https://www.cnblogs.com/kevin-yuan/p/3723283.html
Copyright © 2011-2022 走看看