js09--函数 call apply

简介:
复制代码
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>Untitled Document</title>
        <script type=text/javascript charset=utf-8>
        var k = 10 ; 
        function test(){
            this.k = 20;
        }
        alert(window.k);//10
        alert(k);//10
        test();//window.test()
        alert(test.k);// undefined
        alert(window.k);//20
        alert(k);//20
        
        var t = new test();
        alert(t.k);//20
        // this:this对象是指在运行时期基于执行环境所绑定的
        // this总是指向调用者,也就是说 谁调用了我 我就指向谁
        </script>
    </head>
    <body>
    </body>
</html>
复制代码
复制代码
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>Untitled Document</title>
        <script type=text/javascript charset=utf-8>
        function sum(x , y){
            return x+y;
        }
        function call1(num1 , num2){
            return sum(num1 , num2);//函数可以嵌套调用
        }
        console.log(call1(1,2));
/* 每一个函数都包含两个非继承而来的方法:call、apply。把方法动态加在对象上,给对象加一个已有的新方法,代码的复用。语句执行完对象就没有这个方法了。
使用call()、aplly()来扩充作用域的最大好处就是对象不需要与方法有任何耦合关系。 */
        //call apply  把方法动态加在对象上,给对象加一个已有的新方法,代码的复用。简单的用法:绑定一些函数 用于传递参数 调用 
        function sum(x , y){
            return x+y;
        }
        function call1(num1 , num2){
            return sum.call(this , num1 , num2);//调用的方法-call-(对象,参数)
        }
        function apply1(num1 , num2){
            return sum.apply(this , [num1,num2]);
        }
        alert(call1(10 , 20));
        alert(apply1(20,40));

        window.color = 'red';
        var obj = {color:'blue'};
        var obj2 = {color:'yellow'};
        function showColor(){
            alert(this.color);
        }
        showColor.call(window);
        showColor.call(obj);//把方法加在对象上,给对象加一个已有的新方法。
        
        // call方法的简单模拟与实现
        //function 方法
        function test1(a , b){
            return a+b;
        }
        // 函数名字大写,表示是类,(规范)
        function Obj(x, y){
            this.x = x ; 
            this.y = y ;
            return x*y;
        }
        var o = new Obj(10 , 20);//return对o没影响
        o.method = test1 ;
        alert(o.method(o.x , o.y));
        delete o.method;//o不是{}格式,也可以删除方法属性,语句执行完对象就没有这个方法了
        
        alert(test1.call(o,o.x ,o.y));//语句执行完对象就没有这个方法了
        
        ===============================================================
        function Obj(x, y){
            this.x = x ; 
            this.y = y ;
            this.say = function(){alert(123);}
            return x*y;
        }
        function test1(a , b){
            return a+b;
        }
        var o = new Obj(10 , 20);//return对o没影响

        alert(o.x);
        delete o.x;
        alert(o.x);//undefined

        o.say();//123
        delete o.say;
        o.say();//o.say is not a function

        o.method = test1 ;
        alert(o.method(o.x , o.y));//30
        delete o.method;//语句执行完对象就没有这个方法了
        alert(o.method(o.x , o.y));//o.method is not a function
        </script>
    </head>
    <body>
    </body>
</html>
复制代码

 



本文转自农夫山泉别墅博客园博客,原文链接:http://www.cnblogs.com/yaowen/p/6864527.html,如需转载请自行联系原作者
相关文章
|
3月前
|
机器学习/深度学习 JavaScript 前端开发
JS进阶教程:递归函数原理与篇例解析
通过对这些代码示例的学习,我们已经了解了递归的原理以及递归在JS中的应用方法。递归虽然有着理论升华,但弄清它的核心思想并不难。举个随手可见的例子,火影鸣人做的影分身,你看到的都是同一个鸣人,但他们的行为却能在全局产生影响,这不就是递归吗?雾里看花,透过其间你或许已经深入了递归的魅力之中。
135 19
|
5月前
|
JavaScript
JS实现多条件搜索函数
JS封装的多条件搜索
|
7月前
|
JavaScript 前端开发
JavaWeb JavaScript ③ JS的流程控制和函数
通过本文的详细介绍,您可以深入理解JavaScript的流程控制和函数的使用,进而编写出高效、可维护的代码。
157 32
|
6月前
|
JavaScript 前端开发 Java
详解js柯里化原理及用法,探究柯里化在Redux Selector 的场景模拟、构建复杂的数据流管道、优化深度嵌套函数中的精妙应用
柯里化是一种强大的函数式编程技术,它通过将函数分解为单参数形式,实现了灵活性与可复用性的统一。无论是参数复用、延迟执行,还是函数组合,柯里化都为现代编程提供了极大的便利。 从 Redux 的选择器优化到复杂的数据流处理,再到深度嵌套的函数优化,柯里化在实际开发中展现出了非凡的价值。如果你希望编写更简洁、更优雅的代码,柯里化无疑是一个值得深入学习和实践的工具。从简单的实现到复杂的应用,希望这篇博客能为你揭开柯里化的奥秘,助力你的开发之旅! 只有锻炼思维才能可持续地解决问题,只有思维才是真正值得学习和分享的核心要素。如果这篇博客能给您带来一点帮助,麻烦您点个赞支持一
|
10月前
|
JavaScript 前端开发
js中的bind,call,apply方法的区别以及用法
JavaScript中,`bind`、`call`和`apply`均可改变函数的`this`指向并传递参数。其中,`bind`返回一个新函数,不立即执行;`call`和`apply`则立即执行,且`apply`的参数以数组形式传递。三者在改变`this`指向及传参上功能相似,但在执行时机和参数传递方式上有所区别。
152 1
|
10月前
|
前端开发 JavaScript 开发者
除了 Generator 函数,还有哪些 JavaScript 异步编程解决方案?
【10月更文挑战第30天】开发者可以根据具体的项目情况选择合适的方式来处理异步操作,以实现高效、可读和易于维护的代码。
|
JavaScript 前端开发
JavaScript中call()与apply()的作用与区别?
JavaScript中call()与apply()的作用与区别?
|
JavaScript 前端开发
JavaScript call、apply 和 bind 的区别
JavaScript call、apply 和 bind 的区别
200 0
|
前端开发 JavaScript
【Web 前端】 js中call、apply、bind有什么区别?
【4月更文挑战第22天】【Web 前端】 js中call、apply、bind有什么区别?
【Web 前端】 js中call、apply、bind有什么区别?
|
JavaScript 前端开发 开发者
【JavaScript】JavaScript中call、apply与bind的区别:进阶特性与应用场景
【JavaScript】JavaScript中call、apply与bind的区别:进阶特性与应用场景
231 0