1000字范文,内容丰富有趣,学习的好帮手!
1000字范文 > Web前端开发JavaScript基础(3)

Web前端开发JavaScript基础(3)

时间:2019-04-06 21:14:35

相关推荐

Web前端开发JavaScript基础(3)

JavaScript 一种直译式脚本语言,是一种动态类型、弱类型、基于原型的语言,内置支持类型,它的解释器被称为JavaScript引擎,是浏览器的一部分,并且是被广泛用于客户端的脚本语言,JavaScript最早是在HTML网页上使用,它是属于网络的脚本语言,现在已经被广泛用于Web应用开发,常用来为网页添加各式各样的动态功能,为用户提供更流畅美观的浏览效果,通常JavaScript脚本是通过嵌入在HTML中来实现自身的功能的,现在随着node.js引擎的出现,使得JavaScript逐步成为了一种全栈开发语言了.

JavaScript 代码引入

JS通常有两种引入方式,理论上引入命令在body和head中都可以,但是推荐放在body代码块底部,因为Html代码是从上到下执行,如果Head中的js代码耗时严重,就会导致用户长时间无法看到页面,如果放置在body代码块底部,那么即使js代码耗时严重,也不会影响用户看到页面效果,只是js实现特效慢而已,规范化我们就直接将JS代码统统放在body的最底部.

引入方式(1):第一种引入方式就是在body标签的区域内直接使用<script></script>方式来引用代码.

<body><script type="text/javascript">alert("hello lyshark")</script></body>

引入方式(2):这是第二种引入方式,也就是在需要使用的地方直接引入一个外部js文件,通常写在<head>标签里.

<head><meta charset="UTF-8"><script src="test.js" type="text/javascript"></script><script src="/js/test.js" type="text/javascript"></script><script src="///test.js" type="text/javascript"></script></head>

JavaScript 定义变量

变量是程序设计语言里最重要、最基本的概念,与强类型语言不同的是 JavaScript 是弱类型语言,同一个变量可以一会存储数值,一会存储字符串,变量声明有两种方式,即显式声明和隐式声明,根据变量定义的范围不同,变量有全局变量和局部变量之分,直接定义的变量是全局变量,全局变量可以被所有的脚本访问,在函数里定义的变量称为局部变量,局部变量只在函数内有效.如果全局变量和局部变量使用相同的变量名,则局部变量将覆盖全局变量.

定义局部变量:如下函数内局部变量必须以var开头,如果在函数内未使用var,系统默认也是定义局部变量.

<body><script type="text/javascript">function func() {names = "lyshark";//函数内部默认转成局部变量var age = 21; //定义局部变量标准写法gender = "Man"; //默认局部变量alert("姓名:" + names);alert("年龄:" + age);alert("性别:" + gender);}func() //调用函数,不掉用则不执行</script></body>

定义全局变量:如果我们想要定义全局变量,只需要在函数体外部定义,解释器默认将外部变量当成全局变量.

<body><script type="text/javascript">var func_names = "lyshark"//定义全局变量func_novar = "hello" //定义全局变量function func() {alert("打印全局变量:" + func_names)alert("打印全局变量:" + func_novar)}func() //调用函数,不掉用则不执行</script></body>

JavaScript 数据类型

JavaScript 是弱类型脚本语言,声明变量时无需指定变量的数据类型, JavaScript 变量的数据类型是解释时动态决定的,但 JavaScript 的值保存在了内容中,也是有数据类型的 JavaScript 的基本数据类型有以下5种:

● 数值类型: 数值类型包含整数和浮点数

● 布尔类型: 布尔类型包括True和False

● 数组类型: 数组是一系列数据的集合

● 字符串类型: 字符串类型必须以双引号引起来

● undefined: 用来确定一个已经创建但没有初始值的变量

● null: 用于表明某个变量的值为空

◆数值类型◆

与强类型语言,如C,JAVA,C++不同 JavaScript 的数值类型不仅包括所有的整型变量,也包括所有的浮点型变量, JavaScript 语言中的数值都以 IEEE754一1985 双精度浮点数格式保存. JavaScript 中的数值形式非常丰富,完全支持用科学计数法表示.

整数变量:使用显式方式声明三个变量,num1=1024,num2=5E2,num3=1.23e-3.

<body><script type="text/javascript">var num1 = 1024;var num2 = 0x1A;var num3 = 10;var num4 = 20;document.write("两个数相加:" + (num3 + num4 ))</script></body>

浮点数变量:分别声明四个浮点数变量,其中表示方式可以有以下四种形式.

<body><script type="text/javascript">var num1 = 3.5659;var num2 = -8.1E12;var num3 = .1e12;var num4 = 32E-12;document.write("输出一个浮点数:" + num2)</script></body>

特殊的数值:除了上面的数值表示类型外,JS默认定义了一些常量用来表示更多的类型值.

<body><script type="text/javascript">document.write("表示无穷大的特殊值:" + Infinity)document.write("特殊的非数字值:" + NaN)document.write("表示最大值:" + Number.MAX_VALUE)document.write("表示最小值:" + Number.MIN_VALUE)document.write("特殊的非数字值:" + Number.NaN)document.write("表示正无穷大的特殊值:" + Number.POSITIVE_INFINITY)document.write("表示负无穷大的特殊值:" + Number.NEGATIVE_INFINITY)</script></body>

数字转换:parseInt(..)方法,可以实现将一个字符串转换成整数,如果不成功则返回NaN.

<body><script type="text/javascript">str = "1024";console.log(typeof str) //输出字符串格式num = parseInt(str) //将字符串转成数值,赋值给numconsole.log(num) //打印这个数值</script></body>

转浮点数转换:parseFloat(..)方法,可以实现将一个字符串转换成浮点数,如果不成功则返回NaN.

<body><script type="text/javascript">str = "1024";console.log(typeof str) //输出字符串格式num = parseFloat(str)//将字符串转成浮点数,赋值给numconsole.log(num) //打印这个数值</script></body>

常用数值函数:这里举三个例子,分别代表判断有限值,保留小数点,和保留小数点后几位.

<body><script type="text/javascript">var num1 = 1024;var num2 = 3.16159;var num3 = 100;document.write("判断是否为有限值: " + isFinite(num1) + "<br>")document.write("指定要保留的小数点位数: " + num2.toFixed(2) + "<br>")document.write("保留小数点后2位: " + num3.toFixed(2))</script></body>

◆字符串型◆

字符串是 JavaScript 中最常用的数据类型,几乎每个程序都会用到字符串,字符串是由字符组成的数组,但在 JavaScript 中字符串是不可变的,可以访问字符串任意位置的文本,但是JavaScript并未提供修改已知字符串内容的方法,JS中有丰富的对字符串的操作函数,常用的包括连接,查找替换,大小写转换等操作,如下是常用的操作格式:

obj.length 获取字符串长度obj.toString() 将数组转换成字串obj.trim() 移除字符串中空白obj.trimLeft() 移除字符串中左边空白obj.trimRight() 移除字符串中右边空白obj.charAt(n) 返回字符串中的第n个字符obj.concat(value, ...)两个或者多个字符串拼接obj.indexOf(substring,start) 返回指定字符串在字符串中首次出现的位置obj.lastIndexOf(substring,start)返回该元素在字符串中最后一次出现的位置obj.substring(from,to)提取字符串中介于两个指定下标之间的字符obj.slice(start,end) 从已有字符串数组中返回选定的元素,切片obj.split(delimiter,limit) 用于把一个字符串分割成字符串数组,分割obj.toLowerCase()将小写字符串转换成大写obj.toUpperCase()将大写字符串转换成小写obj.search(regexp) 从头开始匹配,返回匹配成功的第一个字符串位置,g无效obj.match(regexp)全局搜索,如果正则中有g表示找到全部,否则只找到第一个obj.replace(regexp,replacement)正则替换,正则中有g则替换所有,否则只替换第一个匹配项$数字:匹配的第n个组内容$&:当前匹配的内容$`:位于匹配子串左侧的文本$':位于匹配子串右侧的文本$$:直接量$符号

统计字串长度:使用length方法获取字符串的长度,并返回,可以直接返回,也可以赋值给变量.

<body><script type="text/javascript">var string = " hello lyshark 欢迎来到中国!";var num = string.length;document.write("统计字符串长度: " + string.length + "<br>")document.write("另一种统计长度的方法: " + num)</script></body>

移除字串空格:通过使用trim()移除字符串两边空格,trimLeft(),trimRight()可以分别移除左边和右边空格.

<body><script type="text/javascript">var obj = " lyshark";document.write("统计字符串大小: " + obj.length + "<br>")document.write("去除两边的空格: " + obj.trim() + "<br>")document.write("统计字符串大小: " + obj.length + "<br>")</script></body>

字符串拼接:使用concat(,)将两个或者多个字符串拼接在一起形成一个新的字符串.

<body><script type="text/javascript">var string1 = "hello ";var string2 = "lyshark";var string3 = "welcome";document.write("拼接一个字串: " + string1.concat(string2) + "<br>")document.write("拼接多个字串: " + string1.concat(string2,string3) + "<br>")</script></body>

字符串提取:使用indexOf定位首次出现的位置,lastIndexOf定位最后出现的位置,substring实现提取任意字符串.

<body><script type="text/javascript">var str = "Hello World!";document.write("Hello 首次出现的位置: " + str.indexOf("Hello") + "<br/>")document.write("World 首次出现的位置: " + str.indexOf("World") + "<br/>")document.write("如果没有出现过默认-1: " + str.indexOf("world"))</script></body><body><script type="text/javascript">var str = "Hello World! Hello lyshark!";document.write("Hello 最后出现的位置: " + str.lastIndexOf("Hello") + "<br/>")document.write("World 最后出现的位置: " + str.lastIndexOf("World") + "<br/>")document.write("如果没有出现过默认-1: " + str.lastIndexOf("world"))</script></body><body><script type="text/javascript">var str = "Hello World!";document.write("从0偏移取数据,向后取5个: " + str.substring(0,5) + "<br>")document.write("从0偏移取数据,向后取11个: " + str.substring(0,11) + "<br>")document.write("从3偏移取数据,向后取7个: " + str.substring(3,7))</script></body>

切片与分割:通过使用slice()方法切割数组,split()方法用来切割字符串转换成数组.

<body><script type="text/javascript">var array = new Array(5)array[0] = "LyShark";array[1] = "Admin";array[2] = "John";array[3] = "Adrew";document.write("返回整个数组: " + array + "<br>")document.write("返回[1]-[2]元素: " + array.slice(1,3) + "<br>")</script></body><body><script type="text/javascript">var str = "hello world my names lyshark !";var test = "a:b:c:d:e:f:g:h"document.write("以空格作为分隔符分割字串: " + str.split(" ") + "<br>")document.write("将每个字母单独变成一个数组: " + str.split("") + "<br>")document.write("以空格分隔,只分割前三个单词: " + str.split(" ",3) + "<br>")document.write("以冒号作为分隔符,分割元素: " + test.split(":"))</script></body>

字符串查找:查找字符串并返回所在位置,search() 和 match()方法作用基本一致,查找时支持正则匹配.

<body><script type="text/javascript">var string = "hello world my names lyshark my world !";document.write("精确查找字符串: " + string.search("lyshark") + "<br>")document.write("精确检索字符串: " + string.search(/my/) + "<br>")document.write("忽略大小写检索: " + string.search(/world/i) + "<br>")</script></body><body><script type="text/javascript">var string = "hello world my names lyshark my world 123 456 !";document.write("精确查找字符串: " + string.match("lyshark") + "<br>")document.write("全局匹配\d数字: " + string.match(/\d+/g) + "<br>")</script></body>

字符串替换:查找并替换字符串,可以使用replace()方法,该方法也支持正则表达式.

<body><script type="text/javascript">var string = "hello world welcome to hello lyshark HELLO mkdirs!";document.write("查找welcome替换成xxxx: " + string.replace(/welcome/,"xxxx") + "<br>")document.write("全局查找替换hello并替换: " + string.replace(/hello/g,"oooo") + "<br>")document.write("匹配替换并区分大小写: " + string.replace(/HELLO/,"gggg") + "<br>")</script></body>

◆数组类型◆

任何编程语言中都存在数组,数组是一系列变量的集合,与其他强类型语言不同的是 JavaScript 中的数组元素的类型可以不相同,这也是动态语言的好处 JavaScript 语言本身只支持一维数组,但是也可以将两个一维数组合起来变成一个二维数组使用,首先看一下常用的数组操作方法:

obj.length 获取数组的大小obj.push(ele) 给数组尾部追加元素obj.pop() 从尾部获取一个元素obj.unshift(ele) 在数组头部插入元素obj.shift(ele) 在数组头部移除元素obj.slice()数组元素的切片obj.concat(val,..) 多个数组相连接obj.join(sep) 将数组连接起来变成字符串obj.sort() 对数组元素进行排序obj.reverse() 反转数组中的元素obj.splice(n,0,val) 在数组指定位置插入元素obj.splice(n,1,val) 在数组指定位置替换元素obj.splice(n,1) 在数组指定位置删除元素

定义一维数组:以下案例定义了3个数组,并且分别给数组赋值,然后打印结果.

<body><script type="text/javascript">var array = [1,2,3,4,5]; //创建数组,并有5个元素var array1 = [];//创建空数组var array2 = new Array() //同样创建空数组array1[0] = "hello";array1[2] = "world";array2[0] = null;document.write("数组array大小: " + array.length + "<br>")document.write("数组array1大小: " + array1.length + "<br>")document.write("数组array2大小: " + array2.length)</script></body>

定义二维数组:以下案例定义了3个数组,并且分别给数组赋值,然后通过循环语句打印数组值.

<body><script type="text/javascript">var value = [[1,2,3],[4,5,6],[7,8,9,10]];//创建二维数组document.write("数组value大小: " + value.length + "<br>")//打印数组大小document.write("数组value[2]大小: " + value[2].length + "<br>") //打印数组大小for(var i=0;i<3;i++) //循环输出数组元素{for(j in value[i]) //输出每个数组元素的值{document.write(" " + value[i][j]);}document.write("<br>")}</script></body>

插入修改与删除:通过使用splice()方法,实现对元素的插入,增加,修改,删除.

<body><script type="text/javascript">var array = new Array(5)array[0] = "admin";array[1] = "guest";array[2] = "lyshark";array[3] = "wall";document.write("当前列表: " + array + "<br>")array.splice(2,1,"替换成我")//把第2个元素提换,替换1次document.write("替换列表: " + array + "<br>")array.splice(5,1,"插入元素") //在第5个位置上插入新元素document.write("插入列表: " + array + "<br>")array.splice(1,3,"删除元素") //删除第2个位置以后2个元素document.write("删除列表: " + array + "<br>")</script></body>

PUSH/POP操作元素:通过该命令可实现在数组结尾追加新元素,也可从结尾删除元素.

<body><script type="text/javascript">var list = [1,2,3,4,5];document.write("数组元素: " + list + " 总大小:" + list.length + "<br>")list.push(6)list.push(7)//在结尾添加新元素document.write("数组元素: " + list + " 总大小:" + list.length + "<br>")list.pop()list.pop()//在结尾删除元素document.write("数组元素: " + list + " 总大小:" + list.length + "<br>")</script></body>

Shift/Unshift:该命令可以实现在数组元素的头部添加元素,或者是删除头部的元素.

<body><script type="text/javascript">var list = [4,5,6];document.write("数组元素: " + list + " 总大小:" + list.length + "<br>")list.unshift(3)list.unshift(2)list.unshift(1)//在开头添加元素document.write("数组元素: " + list + " 总大小:" + list.length + "<br>")list.shift()list.shift() //从开头删除一个元素document.write("数组元素: " + list + " 总大小:" + list.length + "<br>")</script></body>

切片与连接:使用slice()方法实现数组的切片,concat()实现数组连接,join()数组转成字符串.

< ----------------------------[数组切片]---------------------------- ><body><script type="text/javascript">var array = new Array()array[0] = "admin";array[1] = "lyshark";array[2] = "Thomas";array[3] = "John";array[4] = "George";document.write("数组切片(从1号索引开始显示元素): " + array.slice(1) + "<br>")document.write("数组切片(从3号索引开始显示元素): " + array.slice(3) + "<br>")document.write("数组切片(只显示1-2号元素切片): " + array.slice(1,3) + "<br>")</script></body>< ----------------------------[数组连接]---------------------------- ><body><script type="text/javascript">var array = new Array();var a = [1,2,3,4,5];var b = [7,8,9,10];document.write("将数组连接: " + array.concat(a,b) + "<br>")document.write("直接连接并打印: " + a.concat(b) + "<br>")</script></body>< ----------------------------[数组转换]---------------------------- ><body><script type="text/javascript">var array = new Array(3);array[0] = "admin";array[1] = "guest";array[2] = "lyshark";document.write("直接连接成字符串: " + array.join() + "<br>")document.write("连接成字符串并添加一个分隔符: " + array.join("*") + "<br>")</script></body>

数组元素排序:使用sort()方法实现数组的正向排列,reverse()则实现数组的反向排列.

<body><script type="text/javascript">var array = [12,65,77,89,32,-19,54,33,78]document.write("未排序前: " + array + "<br>")document.write("正向排序: " + array.sort() + "<br>")document.write("反向排序: " + array.reverse() + "<br>")</script></body>

◆布尔类型◆

在前面的案例中我们看了数值类型和字符串类型,该类型数据都有无穷大的数值,但是布尔行数据类型只有两个取值,通常情况下布尔类型直接表示方式有两个,True/False这两个表示方式,分别代表真和假,它主要用于描述一种状态或者标志,通常用来比较所得到的结果.

相等于不相等:使用==双等于号判断两数字是否相等,使用!=不等于号判断两数字是否不相等.

<body><script type="text/javascript">num1 = 1;num2 = 0;if(num1 == num2){document.write("两数相等...")}else if(num1 != num2){document.write("两数不相等...")}</script></body>

与运算与或运算:使用||或运算符实现或运算,使用&&与运算符实现与运算.

<body><script type="text/javascript">num1 = "true";num2 = "false";num3 = "ok";if(num1 == num2 || num2 == num2){document.write("或运算的比较结果...")}if(num1 == num1 && num2 == num2){document.write("与运算的比较结果...")}</script></body>

◆类型转换◆

JS是一种松散类型的程序设计语言,并没有严格地规定变最的数据类型,己经定义数据类型的变量可以在表达式中自动转换数据类型,或通过相应的方法来转换数据类型,自动类型转换有一定的规则,如果按照 JS的类型转换规则,没有转换或者转换的类型不对,就需要通过相应的方法来进行转换.

基本类型转换:基本类型转换String:将字数字转成字符串,Number:将其他类型转为整数,Boolean:其他类型转成布尔类型.

<body><script type="text/javascript">document.write("其他类型转换为字符串: " + String(1024) + "<br>");document.write("其他类型转换为数值:" + Number("hello") + "<br>");document.write("其他类型转换为布尔:" + Boolean(1) + "<br>");</script></body>

字符串转成整数:字符串之间的数据转换,与进制转换实例.

<body><script type="text/javascript">document.write("将a转换成整数: " + parseInt("a") + "<br>");document.write("将a转换成8进制,整数: " + parseInt("a",8) + "<br>");document.write("将a转换成2进制,整数: " + parseInt("a",2) + "<br>");document.write("将a转换成浮点数: " + parseFloat("a") + "<br>");</script></body>

eval()计算:EVAL用于计算字符串表达式或语句的值.

<body><script type="text/javascript">var num = 10;var str = "1024";document.write("eval连接字符串: " + eval(str+num) + "<br>");</script></body>

JavaScript 流程控制

所谓流程就是程序代码所执行的顺序,在任何一种语言中,程序控制流程是必须的,他能够是整个程序减少混乱,使之顺利的按照一定得方式执行工作,在 JavaScript 中常用的程序流程有三种,顺序结构,选择结构,和循环结构,下面将依次演示他们的使用技巧.

if-else:判断if(num1>num2)如果条件满足则执行,否则判断if(num2>num3),满足执行否则执行else里面的代码.

<body><script type="text/javascript">var num1 = 100;var num2 = 200;var num3 = 10;if(num1 > num2){var temp = num1 - num2;document.write("num1 大于 num2" + "比num2多出:" + temp)}else if(num2 > num3){var temp = num2 - num3document.write("num2 大于 num3" + "比num2多出:" + temp)}else{document.write("没有合适的结果..")}</script></body>

switch:switch通常用于选择结构,以下代码用户输入一个数值,进入选择结构根据输入数值执行相应代码片段.

<body><script type="text/javascript">var temp;temp = prompt("请选择输入(1,2,*):","");switch(temp){case "1":document.write("你选择了1号");break;case "2":document.write("你选择了2号");break;default:document.write("你选择了其他选项");break;}</script></body>

while:循环执行结构,while会一直循环下去,直到满足(num <=100)的条件则跳出循环,语句语法结构如下.

<body><script type="text/javascript">var num = 0;var sum = 0;while(num <=100){sum = sum +num;num = num +1;document.write("当前循环: "+ num + " 当前累加: " + sum);document.write("<br>")}document.write("从1+100...结果是:" + sum)</script></body>

for:以下案例,通过for循环遍历names列表,每次循环i++递增,直到满足(i<names.length)则退出循环.

<body><script type="text/javascript">var names = ["admin","guest","lyshark","alex"]for(var i=0;i<names.length;i++){document.write("当前位置: "+ i +"元素值: " + names[i])document.write("<br>")}</script></body>

for in:这是一种类似python的语法格式,使用效果和python中的循环语句并无差异.

<body><script type="text/javascript">var names = ["admin","guest","lyshark","alex"]for(var index in names){document.write("当前位置: "+ index +"元素值: " + names[index])document.write("<br>")}</script></body>

try..catch:异常处理,当try里面代码出现问题的时候自动执行catch抛出异常,最后无论是否异常都会执行finally.

<body><script type="text/javascript">try {// 这段代码从上往下运行,其中任何一个语句抛出异常该代码块就结束运行}catch(e){// 如果try代码块中抛出了异常,catch代码块中的代码就会被执行// e是一个局部变量,用来指向Error对象或者其他抛出的对象}finally{// 无论try中代码是否有异常抛出(甚至是try代码块中有return语句),finally代码块中始终会被执行}</script></body>

JavaScript 关于函数

函数为编程者提供了在整个程序中重复使用一个单元结构的能力,在这个单元中封装了完成指定任务或者功能的程序代码,为了使用函数,需要知道如何定义函数,如何将变量传递给函数,以及如何返问函数计算出的结果,另外 JavaScript 以其灵活性的特点,我们可以将一些开发环境中常用到的模块进行封装,然后再使用时直接调用即可,节约了开发周期.

◆函数的定义◆

JavaScript 中函数基本上可以分为三类,普通函数,匿名函数,自执行函数,此外需要注意的是对于 JavaScript中 函数参数,实际参数的个数可能小于形式参数的个数,函数内的特殊值arguments中封装了所有实际参数.

普通无参函数:以下代码,通过使用关键字function声明了func()无参数的函数.

<body><script type="text/javascript">function func(){document.write("这个无参数函数被执行了..." + "<br>");return "ok";}var ret = func() //调用函数,并将返回值赋值给ret变量document.write("函数的返回值是: " + ret);</script></body>

普通有参函数:以下代码,通过使用关键字function声明了func()有参数的函数,其中形式参数有name,age,sex.

<body><script type="text/javascript">function func(name,age,sex){document.write("姓名: " + name + "年龄:" + age + "性别: " + sex + "<br>");return 0;}var ret = func("lyshark","22","Man")//调用函数document.write("函数的返回值是: " + ret);</script></body>

传递数组地址:我们不仅仅可以传递单个的参数,还可以将一个预定义好的数组传递到函数体内部.

<body><script type="text/javascript">function show(temp){for(i in temp)document.write(temp[i] + " ");document.write("<br>");}var array = new Array(1,2,3,4,5,6,7,8,9,10);show(array) //传递一个数组到函数体,并执行</script></body>

定义匿名函数:匿名函数,就是没有名字的函数,需要我们手动进行调用,一般情况不会使用.

<body><script type="text/javascript">var func = function(x,y){document.write("参数1= " + x + "参数2= " + y);}func(10,20)//调用匿名函数</script></body>

自执行函数:自执行函数,也就是说无论我们是否调用它,它都会被执行,适合做初始化工作.

<body><script type="text/javascript">(function(name,url){document.write("姓名: " + name + "URL: " + url);})("lyshark","")</script></body>

arguments:使用特殊对象arguments,开发者无需明确指出参数名,就能访问数据的内部元素.

<body><script type="text/javascript">function func() {document.write("当前参数长度: " + arguments.length + "<br>");}func(1,2,3,4,5);</script></body>

◆嵌套与递归◆

函数嵌套与递归式很多编程语言的通用属性,同样的 JavaScript 虽然是脚本语言,但是也支持嵌套和递归函数的实现,函数嵌套是语言特性,递归调用是逻辑思想,这两者有关但并不互斥,一个递归过程可以包含函数嵌套,同样一个递归函数也可当做是自身嵌套函数,一般情况下不会使用这些特性.

函数的嵌套:函数的嵌套是指在函数体的内部再次嵌套一层函数体,并依次返回执行结果,就是嵌套函数.

<body><script type="text/javascript">function ext_func(){function func(){document.write("内部函数执行结果...." + "<br>")return 1024;}ret = func()return ret}ret = ext_func()document.write("内部函数返回值: " + ret)</script></body>

函数的递归:函数的递归是指函数不停地调用自身,直到满足一定得条件才会自动的跳出循环体.

<body><script type="text/javascript">function func(temp){if(temp == 1){return 1;}else{return func(temp-1)+2;}}ret = func(5)document.write("内部函数返回值: " + ret)</script></body>

函数的闭包:通常情况下,我们想调用一个函数内部的嵌套方法,我们可以使用闭包的形式来实现.

<body><script type="text/javascript">function func1(){var array = [1,2,3,4,5];function func2() {return array;}return func2;}temp = func1()//调用语句返回函数func2对象document.write("函数返回对象: " + temp + "<br>");ret = temp() //调用这个对象,最终得到结果document.write("最终返回值: " + ret);</script></body>

◆常用内置函数◆

除了可以在 JavaScript 中自己定义函数以外 JavaScript 自身也提供了一些内部函数,也称为内部方法,程序可以直接调用这些函数来完成某些功能,下面是 JavaScript 中的一些内部函数的介绍.

encodeURI:返回一个对URI字符串编码后的结果,URI表示的范围比URL要大.

<body><script type="text/javascript">var urlstr = encodeURI("/index.html country=中国")document.write("URI中的转义字符: " + urlstr + "<br>")var urlstr = encodeURIComponent("/index.html country=中国")document.write("转义URI组件中的字符: " + urlstr)</script></body>

decodeURI:对一个编码后的URI字符串进行解释,翻译成一个正常格式.

<body><script type="text/javascript">var urlstr = decodeURI("/index.html%20country=%E4%B8%AD%E5%9B%BD")document.write("URI翻译: " + urlstr + "<br>")var urlstr = decodeURIComponent("%2Findex.html%20country%3D%E4%B8%AD%E5%9B%BD")document.write("URI组件翻译: " + urlstr)</script></body>

字符串转换:使用escape()方法对字符串进行转义处理,unescape()则负责将代码解码.

<body><script type="text/javascript">var encode = escape("中国")document.write("字符串转换: " + encode + "<br>")var decode = unescape("%u4E2D%u56FD")document.write("字符串解码: " + decode)</script></body>

JSON序列化:使用JSON方法将数组序列化存储,方便数据传输.

<body><script type="text/javascript">array = [1,2,3,4,5]ret = JSON.stringify(array) //序列化,将其他类型转换成字符串document.write("序列化后的类型: " + typeof(ret) + "<br>")document.write("反序列化,加载结果: " + JSON.parse(ret))</script></body>

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。