Extjs 基础篇—— Function基础

news/2024/7/7 19:33:21

这里主要是JS的基础知识,也是深入理解Ext的基础。
1.参数可变长,注意跟Java还是有一点区别的。
例:

view source
print?
1.function getUser(name,age){
2.alert("name: "+name + " age: "+age);
3.}


调用方法:getUser(); // 可以不传参数
getUser("cat"); // 可以只传递一个参数
getUser("cat",20); // 传两个参数
getUser("cat",20,2,"dog"); // 传两个以上的参数
2.不给函数定义形参,直接在函数中使用arguments属性获取实际传递的参数数组。
例:

view source
print?
1.function getUser(){
2.var args = arguments;
3.alert(args.length);
4.alert(args[0]);
5.}


3.js函数不能重载.因为,JS函数的参数是可变长的,从代码意义上来说就没有重载。另外,JS是一种解释执行的语言,浏览器脚本引擎开始载入JS代码的时候,必须先“扫描”然后才开始解释执行。在这个过程中,有一个重要的操作就是“标识符解析”,要求同一命名空间不允许同名变量的存在,包括函数名。
例:

view source
print?
1.function getUser(){
2.alert("hello!");
3.}
4.function getUser(name){
5.alert("sorry!");
6.}
7.getUser(); // 结果永远是 sorry!


4.命名空间:Java我们用package edu.ouc.wy来定义,JS中则需要我们一层一层的定义。

view source
print?
1.var edu = {};
2.var edu.ouc = {};
3.var edu.ouc.wy = {};


5.JS支持函数嵌套
例:

view source
print?
1.function outerFn(){
2.function innerFn(){
3.alert("innerFn test..");
4.}
5.alert("outerFn test...");
6.}
7.outerFn();  // 结果弹出来两个窗口


6.既然有了函数嵌套,我们就有从outerFn外部调用innerFn函数的需求
例:

view source
print?
1.function outerFn(){
2.function innerFn(){
3.alert("innerFn test..");
4.}
5.return innerFn();
6.}
7.var cacheFn = outerFn();
8.cacheFn();


一般来说,“外层”作用域中的代码是无法访问“内层”作用域的。但是通过return一个函数的方式,可以让函数“穿越”作用域的限制,从而让外层作用域能够“触摸”到“内层”的函数和变量。
例:

view source
print?
01.var outerName = "cat";
02.function outerFn(){
03.var name = "dog";
04.function innerFn(){
05.alert("outername: "+outerName + " innername: "+name);
06.}
07.return innerFn;
08.}
09.var cacheFn = outerFn();
10.cacheFn(); // 结果为 outername: cat innername: dog


7.JS中函数既是数据
例:

view source
print?
1.function testFn(){
2.alert("test function..");
3.}
4.alert(testFn); // 显示的结果和上面这三行是一样的


例:

view source
print?
1.testFn = function(){
2.alert("test function..");
3.}
4.alert(testFn); // 效果和上一个例子是一样的


两者的不同是:前者直接声明了一个函数,在脚本引擎的解析期间,这个函数就会被创建。
而后者相当于是定义了一个变量,因此只有在脚本真正执行到这一行的时候,函数才会被构建出来。
8.函数作为对象的属性,动态的添加和删除
例:

view source
print?
1.var obj = {};
2.obj.testFn = function(){
3.alert("test func..");
4.}
5.obj.testFn(); // 括号()的目的是让testFn这个属性(函数)执行
6.delete obj.testFn;
7.obj.testFn(); // 报错


9.函数也是对象,也有自己的类:Function
例1:

view source
print?
1.var testFn = new Function('name','alert(my func...)');
2.testFn();  // 结果 my func...


Function:可以接受任意多个参数,只有最后一个参数被当做“函数体”。使用new Function()方式创建的函数,是在运行时才创建。并且他的作用域是“顶级作用域”,即window
例:

view source
print?
1.function outerFn(){
2.var name = "cat";
3.var innerFn = new Function("alert(name)");
4.return innerFn;
5.}
6.var cacheFn = outerFn();
7.cacheFn();  // 结果报错,因为在window作用域中,找不到name变量


例2:

view source
print?
1.var myFn = function(){}
2.myFn.name = "cat";
3.alert(myFn.name); // cat
4.delete myFn.name;
5.alert(myFn.name); // 空


10.三种特殊形式的函数调用:call,apply,()
例:

view source
print?
1.function myFn(){
2.alert(this.name);
3.}
4.myFn.call({name:"cat"});  // 结果为cat
5.myFn.apply({name:"dog"});  // 结果为dog


结果很奇怪:两次this.name居然不一样。这就是JS是动态语言的意义所在,不要被Java思想所束缚。对于JS来说,函数中的this并不一定指向特定的对象,它是可变的。(这句很重要)
call和apply都能执行函数并给this传递参数。两者相同点:他们都可以接受两个参数,第一个参数为函数中this需要绑定的对象。不同点:call的第二个参数是可变长参数,apply的第二个参数是数组。
例:

view source
print?
1.function myFn(a,b){
2.return a+b;
3.}
4.myFn.call({},1,2);
5.myFn.apply({},[1,2]);
6.例:(function(){
7.alert("my func..");
8.})();


结果这个函数自己就执行了。
11.我们知道了函数也是对象。也用过了arguments这个原生属性。JS为函数对象提供了很多原生的属性,包括arguments,callee,caller,length,prototype等
例1:

view source
print?
01.function myFn(){
02.var s = "";
03.var len = arguments.length;
04.for(var i=0; i<len; i++){
05.s += arguments[i]; // 注意arguments不是数组,而是对象
06.}
07.alert(s);
08.}
09.myFn(1,2,3,4,5);


例2:

view source
print?
1.function fact(n){ // n的阶乘
2.if(n==1){
3.return 1;
4.}else{
5.return n * arguments.callee(n-1);
6.}
7.}


callee在arguments属性中定义,并且它指向函数自己,可以用于递归调用。
例3:

view source
print?
1.function worker(){
2.alert(worker.caller); // 将会输出boss函数的代码,因为没有给他加(),
3.// 否则将报错too much recursion
4.}
5.function boss(){
6.worker();
7.}
8.boss();
原文链接:http://extjs.org.cn/node/585

http://lihuaxi.xjx100.cn/news/237138.html

相关文章

这个美国议员候选人想发币,联邦选举委员会还答应了

链客&#xff0c;专为开发者而生&#xff0c;有问必答&#xff01; 此文章来自区块链技术社区&#xff0c;未经允许拒绝转载。 佛罗里达州的一名国会候选人想给竞选志愿者发放基于以太坊的代币&#xff0c;以激励他们的工作&#xff0c;这是一项实验性的举措&#xff0c;而联邦…

如何有效使用每一点脑力总结_如何更有效地节省脑力和编码

如何有效使用每一点脑力总结如果您知道这些工具的存在&#xff0c;那么您现在可能会使用它们。 (If you knew these tools existed, youd probably be using them by now.) This article isn’t going to tell you about saving your neck with a Roost stand, or your wrists …

北京智能计算产业研究院落户顺义,中科睿芯联手计算所、顺义区打造“产业园2.0”...

作为具有重大发展潜力的高技术产业方向&#xff0c;智能计算在我国方兴未艾。 12月6日&#xff0c;由中科院计算所孵化的智能计算领域创业公司“中科睿芯”牵头发起、联袂中科院计算所和中关村顺义园管委会共同打造的“北京智能计算产业研究院”&#xff08;下简称“研究院”&…

Java面试题(一)部分题目

博主马上要面对几家公司的面试&#xff0c;故自己准备了点面试题&#xff0c;仅供参考&#xff01; 1&#xff0c;线程的创建的方式&#xff1a;答&#xff1a;1,继承Thread(注意&#xff0c;此类其实也是实现了Runnable接口的)&#xff0c;2,实现Runnable接口2&#xff0c;1. …

JavaScript创建对象–如何在JS中定义对象

Objects are the main unit of encapsulation in Object-Oriented Programming. In this article, I will describe several ways to build objects in JavaScript. They are:对象是面向对象编程中封装的主要单元。 在本文中&#xff0c;我将介绍几种使用JavaScript构建对象的方…

解读Go语言的2018:怎么就在中国火成这样了?

链客&#xff0c;专为开发者而生&#xff0c;有问必答&#xff01; 此文章来自区块链技术社区&#xff0c;未经允许拒绝转载。 本篇文章是 Go 语言 2018 年终盘点&#xff0c;力求客观、深入分析 2018 年 Go 语言的技术发展现状&#xff0c;同时对明年可能的发展情况进行预测…

近期Freecodecamp问题总结

最近没什么事&#xff0c;刷了freecodecamp的算法题&#xff0c;发现了自己基础的薄弱 1 where are thou 写一个 function&#xff0c;它遍历一个对象数组&#xff08;第一个参数&#xff09;并返回一个包含相匹配的属性-值对&#xff08;第二个参数&#xff09;的所有对象的数…

作为JavaScript开发人员,这些必备的VS Code插件你都用过吗

本文翻译自&#xff1a;https://www.sitepoint.com/vs-code-extensions-java-developers/转载请注明出处&#xff1a;葡萄城官网&#xff0c;葡萄城为开发者提供专业的开发工具、解决方案和服务&#xff0c;赋能开发者。如今&#xff0c;Visual Studio Code无疑是最流行的轻量级…