var与this,{}与function 小记

JavaScript var是用来定义一个变量,this常用来定义或调用一个属性或方法。但是在全局范围内,this和var定义变量是等价的。

window

 console.log(‘window:‘, name);
 var name = ‘stone‘;
 this.name = ‘niqiu‘;
 console.log(‘var:‘,name);
 console.log(‘this:‘,this.name);

window对象有name属性,初始值为空,但第一个console的时候怎么获取值了呢。 发现这个window记录的是上次的值。重新打开页面,只执行 console.log(‘window:‘, name); 输出为空。

  console.log(‘window:‘, name);
  var name = ‘stone‘;

刷新两次后输出stone. 所以window对象在刷新的时候并没有重新创建。window是的{}对象。没有构造函数,不能new。

function与{}

在函数内部,var定义的是局部变量,而this定义的是属性。这两者没有覆盖。但新创建的对象是无法获取到局部变量的。

     var Fool = function () {
            var name = ‘stone‘;
            var nikename = ‘stoneniqiu‘;
            this.name = ‘niqiu‘;
            this.getName = function () {
                console.log(‘var‘, name);
                console.log(‘this‘, this.name);
            };
            this.getNickname = function() {
                return nikename;
            };
        };
    console.log(f.name); //niqiu
    console.log(f.nikename);//undefined
    console.log(f.getNickname());//stoneniqiu

但是如果使用{}定义对象,内部变量等于全部都是属性。

  var block = {
            name: ‘stone‘,
            nickname:‘stoneniqiu‘,
            getName: function () {
                // return this.name;//stone
                return name; //‘windows name‘;
            },
            getNickname:function() {
                return this.nickname;
            },
            printAllName:function() {
                console.log(this.getNickname());
                console.log(this.getName());
            }

        };

       console.log(block.name);//stone
       console.log(block.getName()); //windows name

像window对象一样,{}创建的对象不能new,因为没有构造函数。

所以如果对象复用,比较大,还是用function的形式比较好,分开私有变量和公共属性或方法,function的内部模块可以用{}的形式。

通过this可取得它们所属的上下文的方法称为公共方法。this到对象的绑定发生在调用的时候,这个“超级”延迟绑定使得函数可以对this高度复用。

this指的是当前执行的对象,为避免this发生变化。常用一个变量暂存一下this。

var self=this 

神奇的回调

下面看个例子,对象的参数中定义了回调方法,但我们传入Fool自身的一个方法,居然执行了。

 var Fool = function (config) {
           var parmas = {
               callback: function() {
                   console.log(‘raw callback‘);
               }
           };
           parmas = $.extend(parmas, config);

           var name = ‘stone‘;
           var nikename = ‘stoneniqiu‘;
           this.name = ‘niqiu‘;
           this.getName = function () {
               console.log(‘var‘, name);
               console.log(‘this‘, this.name);
           };
           this.getNickname = function () {
               return nikename;
           };
           this.doSomething = function () {
               parmas.callback();
           };
       };
       var f = new Fool({callback:function() {
           $("#bt").click(function() {
               f.getName()
           });
       }});

       f.doSomething();

运行无误,点击button 触发getName方法。但如果直接下面这样写,就会报错了,这错的很符合常理。

 var f = new Fool({callback:f.getName()});

再修改下,用匿名函数包起来,也能跑。

var f = new Fool({callback:function() {
             (function() {
               f.getName();
            })();
       }});
       f.doSomething();

Why?

时间: 2024-10-21 14:45:35

var与this,{}与function 小记的相关文章

从var func=function 和 function func()区别谈Javascript的预解析机制

var func=function 和 function func()在意义上没有任何不同,但其解释优先级不同:后者会先于同一语句级的其他语句. 即: { var k = xx(); function xx(){return 5;} } 不会出错,而 { var k = xx(); var xx = function(){return 5;} } 则会出错. 为什么会这样呢?这就要引出javascript中的预解析机制来解释了. JavaScript解析过程分为两个阶段,一个是编译阶段,另外一个

函数声明之function与var

纸上得来终觉浅,绝知此事要躬行. 软件这行业,很多东西还是要靠敲代码敲出来的,你以为看书看的很通透,例子也能做出来的东西,一需要深入混合运用顿时觉得懵逼了.关键还是在于一知半解,不够深入. 今天我就总结一下近段时间遇到并纠结过的一些知识. 老规矩,由浅入深,用发散性思维思考每个知识点. 一.声明一个函数 function与var 1.function aaa(); //先调用 function aaa(){ //后声明 //code } js是按顺序执行,但是这里却可以先调用再声明 其原因是,j

javascript精雕细琢(一):var let const function声明的区别

目录 引言 一.var 二.let 三.const 四.function 五.总结 引言 在学习javascript的过程中,变量是无时无刻不在使用的.那么相对应的,变量声明方法也如是.变量是由自己决定,但变量声明方法是早已经定义好的.那么在使用变量之前,了解变量声明方法,就变得尤为重要.在ES6推出之前,最常用的声明变量方法就是var.但是由于var自身的缺陷,ES6推出了let和const替代var.虽然修正了var的缺陷,但不能改变的,是之前已经用var写了多少年的项目,这些项目是无法随着

对IIFE中(function(window,undefined){})(window)中为什么传递undefined的理解

1.在函数中定义形参但没有传递实参就相当于定义了变量但未赋值,所以下面中的a就是undefined 1 function test(a){ 2 console.log(a)//undefined 3 }; 4 test(); 2.在IIFE中,window作为实参传递进去,避免了执行代码时,每次都到全局中寻找window从而提高了效率,但是为什么形参中还要指定一个undefined呢,上面说过在函数中定义了形参就相当于定义了但不赋值,那在这个立即执行函数中undefinde还是undefined

深入理解 JavaScript Function

1.Function Arguments JavaScript 函数的参数 类型可以是 复杂类型如  Object or Array 和简单类型 String Integer null undefined;当参数是 复杂类型的时候,将会把 复杂类型的 引用传出 函数体内,也就是传入函数内的不是 复杂类型的副本,而是其在内存中的指针.当参数是 简单类型的时候,就会直接传值进入函数体内.look the below demostrated: var obj={name:'joe'}; (functi

Function javascript

通常而言,一个函数是一个子程序,他们可以被外部代码调用(亦或被滴管函数在内部调用).和程序一样,函数是由一系列声明(被称为函数体function body)组合而成.值可以传递给函数,并且函数可以返回一个值. 在javascript中,函数是一个对象,因为她可以拥有属性和方法,就像对象一样.将函数和对象区分的是函数可以被调用,他们是函数对象(Function objects). 描述 js中的所有函数都是函数对象Function object 函数和程序不一样,函数总是返回一个值,但是程序不一定

JavaScript Function 函数深入总结

整理了JavaScript中函数Function的各种,感觉函数就是一大对象啊,各种知识点都能牵扯进来,不单单是 Function 这个本身原生的引用类型的各种用法,还包含执行环境,作用域,闭包,上下文,私有变量等知识点的深入理解. 函数中的return return 语句可以不带有任何返回值,在这种情况下( return; 或函数中不含 return 语句时),函数在停止执行后将返回 undefiend 值.这种用法一般在需要提前停止函数执行而又不需要返回值的情况下. return false

对js中Function的浅见

它到底是什么 String Array 都是系统内置对象(已经定义好,可以直接使用)当然,这货也是一样,我们之前定义的函数,其实就是一个这货的实例. 在JS中,所有的对象都是由函数实现的,函数的数据类型是object.So,我们以前定义的函数也是一个对象. 几种写法 1 function fn1(a,b){ 2 return a+b; 3 } 4 5 //前面表示参数,后面表示函数语句 6 var fn2 = new Function("a","b","r

javascript 全局变量 局部变量 var 与不加var的区别

  一.外部的为全局,内部的为局部变量.   二.加var为局部变量(在方法内),不加var为全局变量(当方法内有一次使用后) <script type="text/javascript"> var golbe="global"; test(); function test(){ var local="local"; document.write(golbe); document.write(local); } document.wr