JavaScript基本语法续

文章目录

• JavaScript基本语法续
• • 一、Javascript组成
  • 二、字符串处理方法
  • • 1、字符串合并操作：“ + ”
    • 2、parseInt() 将数字字符串转化为整数
    • 3、parseFloat() 将数字字符串转化为小数
    • 4、split() 把一个字符串分隔成字符串组成的数组
    • 5、charAt() 获取字符串中的某一个字符
    • 6、indexOf() 查找字符串是否含有某字符
    • 7、substring() 截取字符串 用法： substring(start,end)（不包括end）
    • 8、toUpperCase() 字符串转大写
    • 9、toLowerCase() 字符串转小写
    • 10、字符串反转
  • 三、类型转换
  • • 1、直接转换 parseInt() 与 parseFloat()
    • 2、隐式转换 “==” 和 “-”
    • 3、NaN 和 isNaN
  • 四、定时器
  • • 1.定时器在javascript中的作用
    • 2.定时器类型及语法
    • 3.定时器制作时钟
    • 4、定时器制作倒计时
  • 五、变量作用域
  • 六、封闭函数
  • 七、常用内置对象
  • • 1、document
    • 2、location
    • 3、Math

一、Javascript组成

• 1、ECMAscript javascript的语法（变量、函数、循环语句等语法）
• 2、DOM 文档对象模型 操作html和css的方法
• 3、BOM 浏览器对象模型 操作浏览器的一些方法

二、字符串处理方法

1、字符串合并操作：“ + ”

var iNum01 = 12; var iNum02 = 24; var sNum03 = '12'; var sTr = 'abc'; alert(iNum01+iNum02); //弹出36 alert(iNum01+sNum03); //弹出1212 数字和字符串相加等同于字符串相加 alert(sNum03+sTr); // 弹出12abc

2、parseInt() 将数字字符串转化为整数

var sNum01 = '12'; var sNum02 = '24'; var sNum03 = '12.32'; alert(sNum01+sNum02); //弹出1224 alert(parseInt(sNum01)+parseInt(sNum02)) //弹出36 alert(sNum03) //弹出数字12 将字符串小数转化为数字整数

3、parseFloat() 将数字字符串转化为小数

var sNum03 = '12.32' alert(parseFloat(sNum03)); //弹出 12.32 将字符串小数转化为数字小数

4、split() 把一个字符串分隔成字符串组成的数组

var sTr = '2017-4-22'; var aRr = sTr.split("-"); var aRr2= sTr.split("");alert(aRr); //弹出['2017','4','2'] alert(aRr2); //弹出['2','0','1','7','-','4','-','2','2']

5、charAt() 获取字符串中的某一个字符

var sId = "#div1"; var sTr = sId.charAt(0); alert(sTr); //弹出 #

6、indexOf() 查找字符串是否含有某字符

var sTr = "abcdefgh"; var iNum = sTr.indexOf("c"); alert(iNum); //弹出2

7、substring() 截取字符串 用法： substring(start,end)（不包括end）

var sTr = "abcdefghijkl"; var sTr2 = sTr.substring(3,5); var sTr3 = sTr.substring(1);alert(sTr2); //弹出 de alert(sTr3); //弹出 bcdefghijkl

8、toUpperCase() 字符串转大写

var sTr = "abcdef"; var sTr2 = sTr.toUpperCase(); alert(sTr2); //弹出ABCDEF

9、toLowerCase() 字符串转小写

var sTr = "ABCDEF"; var sTr2 = sTr.toLowerCase(); alert(sTr2); //弹出abcdef

10、字符串反转

var str = 'asdfj12jlsdkf098'; var str2 = str.split('').reverse().join('');alert(str2);

三、类型转换

1、直接转换 parseInt() 与 parseFloat()

alert('12'+7); //弹出127 alert( parseInt('12') + 7 ); //弹出19 alert( parseInt(5.6)); // 弹出5 alert('5.6'+2.3); // 弹出5.62.3 alert(parseFloat('5.6')+2.3); // 弹出7.8999999999999995 alert(0.1+0.2); //弹出 0.3000000000000004 alert((0.1*100+0.2*100)/100); //弹出0.3 alert((parseFloat('5.6')*100+2.3*100)/100); //弹出7.9

2、隐式转换 “==” 和 “-”

if('3'==3) {alert('相等'); }// 弹出'相等' alert('10'-3); // 弹出7

3、NaN 和 isNaN

alert( parseInt('123abc') ); // 弹出123 alert( parseInt('abc123') ); // 弹出NaN

四、定时器

1.定时器在javascript中的作用

• 1、制作动画
• 2、异步操作
• 3、函数缓冲与节流

2.定时器类型及语法

/*定时器：setTimeout 只执行一次的定时器 clearTimeout 关闭只执行一次的定时器setInterval 反复执行的定时器clearInterval 关闭反复执行的定时器*/ var time1 = setTimeout(myalert,2000); var time2 = setInterval(myalert,2000); /* clearTimeout(time1); clearInterval(time2); */ function myalert(){alert('ok!'); }

3.定时器制作时钟

<script type="text/javascript">window.onload = function(){ var oDiv = document.getElementById('div1');function timego(){var now = new Date();var year = now.getFullYear();var month = now.getMonth()+1;var date = now.getDate();var week = now.getDay();var hour = now.getHours();var minute = now.getMinutes();var second = now.getSeconds();var str = '当前时间是：'+ year + '年'+month+'月'+date+'日 '+toweek(week)+' '+todou(hour)+':'+todou(minute)+':'+todou(second);oDiv.innerHTML = str;}timego();setInterval(timego,1000);}function toweek(n){if(n==0){return '星期日';}else if(n==1){return '星期一';}else if(n==2){return '星期二';}else if(n==3){return '星期三';}else if(n==4){return '星期四';}else if(n==5){return '星期五';}else{return '星期六';}}function todou(n){if(n<10){return '0'+n;}else{return n;}} </script> ...... <div id="div1"></div>

4、定时器制作倒计时

<script type="text/javascript">window.onload = function(){var oDiv = document.getElementById('div1');function timeleft(){var now = new Date();var future = new Date(2016,8,12,24,0,0);var lefts = parseInt((future-now)/1000);var day = parseInt(lefts/86400);var hour = parseInt(lefts%86400/3600);var min = parseInt(lefts%86400%3600/60);var sec = lefts%60;str = '距离2016年9月12日晚24点还剩下'+day+'天'+hour+'时'+min+'分'+sec+'秒';oDiv.innerHTML = str; }timeleft();setInterval(timeleft,1000); }</script> ...... <div id="div1"></div>

五、变量作用域

变量作用域指的是变量的作用范围，javascript中的变量分为全局变量和局部变量。

• 1、全局变量：在函数之外定义的变量，为整个页面公用，函数内部外部都可以访问。
• 2、局部变量：在函数内部定义的变量，只能在定义该变量的函数内部访问，外部无法访问。

<script type="text/javascript">//全局变量var a = 12;function myalert(){//局部变量var b = 23;alert(a);alert(b);}myalert(); //弹出12和23alert(a); //弹出12 alert(b); //出错 </script>

六、封闭函数

封闭函数是javascript中匿名函数的另外一种写法，创建一个一开始就执行而不用命名的函数。

一般定义的函数和执行函数：

function myalert(){alert('hello!'); };myalert();

封闭函数：

(function myalert(){alert('hello!'); })();

还可以在函数定义前加上“~”和“!”等符号来定义匿名函数

!function myalert(){alert('hello!'); }()

封闭函数的好处
封闭函数可以创造一个独立的空间，在封闭函数内定义的变量和函数不会影响外部同名的函数和变量，可以避免命名冲突，在页面上引入多个js文件时，用这种方式添加js文件比较安全，比如：

var iNum01 = 12; function myalert(){alert('hello!'); }(function(){var iNum01 = 24;function myalert(){alert('hello!world');}alert(iNum01);myalert() })()alert(iNum01); myalert();

七、常用内置对象

1、document

• document.getElementById //通过id获取元素
• document.getElementsByTagName //通过标签名获取元素
• document.referrer //获取上一个跳转页面的地址(需要服务器环境)

2、location

• window.location.href //获取或者重定url地址
• window.location.search //获取地址参数部分
• window.location.hash //获取页面锚点或者叫哈希值

3、Math

• Math.random 获取0-1的随机数
• Math.floor 向下取整
• Math.ceil 向上取整

总结

以上是生活随笔为你收集整理的JavaScript基本语法(续)的全部内容，希望文章能够帮你解决所遇到的问题。

如果觉得生活随笔网站内容还不错，欢迎将生活随笔推荐给好友。