Javascript 类型转换、封闭函数及常见内置对象操作示例


Posted in Javascript onNovember 15, 2019

本文实例讲述了Javascript 类型转换、封闭函数及常见内置对象。分享给大家供大家参考,具体如下:

Javascript组成

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

类型转换

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、alert

2、console.log

3、document.title

变量作用域

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

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

<script type="text/javascript">
  //全局变量
  var a = 12;
  function myalert()
  {
    //局部变量
    var b = 23;
    alert(a);
    alert(b);
  }
  myalert(); //弹出12和23
  alert(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 向上取整

感兴趣的朋友可以使用在线HTML/CSS/JavaScript代码运行工具:http://tools.3water.com/code/HtmlJsRun测试上述代码运行效果。

更多关于JavaScript相关内容可查看本站专题:《JavaScript常用函数技巧汇总》、《javascript面向对象入门教程》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》及《JavaScript数学运算用法总结》

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
通过JS 获取Mouse Position(鼠标坐标)的代码
Sep 21 Javascript
判断用户的在线状态 onbeforeunload事件
Mar 05 Javascript
jQuery仿Excel表格编辑功能的实现代码
May 01 Javascript
Js制作简单弹出层DIV在页面居中 中间显示遮罩的具体方法
Aug 08 Javascript
JavaScript获取客户端计算机硬件及系统等信息的方法
Jan 02 Javascript
javascript实现粘贴qq截图功能(clipboardData)
May 29 Javascript
通过JS获取Request.QueryString()参数的值实现方法
Sep 27 Javascript
JavaScript常用正则函数用法示例
Jan 23 Javascript
求js数组的最大值和最小值的四种方法
Mar 03 Javascript
vue实现学生录入系统之添加删除功能
Jul 11 Javascript
JS常见构造模式实例对比分析
Aug 27 Javascript
基于Vue中使用节流Lodash throttle详解
Oct 30 Javascript
JavaScript定时器常见用法实例分析
Nov 15 #Javascript
解决Layui 表格自适应高度的问题
Nov 15 #Javascript
layui前端时间戳转化实例
Nov 15 #Javascript
JavaScript变量基本使用方法实例分析
Nov 15 #Javascript
JavaScript字符串处理常见操作方法小结
Nov 15 #Javascript
layui数据表格重载实现往后台传参
Nov 15 #Javascript
JS实现贪吃蛇游戏
Nov 15 #Javascript
You might like
php中函数的形参与实参的问题说明
2010/09/01 PHP
WordPress中用于创建以及获取侧边栏的PHP函数讲解
2015/12/29 PHP
PHP编写学校网站上新生注册登陆程序的实例分享
2016/03/21 PHP
eclipse php wamp配置教程
2016/06/30 PHP
支付宝服务窗API接口开发php版本
2016/07/20 PHP
PHP设计模式之观察者模式定义与用法示例
2018/08/04 PHP
Laravel框架中集成MongoDB和使用详解
2019/10/17 PHP
关于laravel框架中的常用目录路径函数
2019/10/23 PHP
手写的一个兼容各种浏览器的javascript getStyle函数(获取元素的样式)
2014/06/06 Javascript
浅谈Javascript 数组与字典
2015/01/29 Javascript
JavaScript_ECMA5数组新特性详解
2016/06/12 Javascript
jquery Banner轮播选项卡
2016/12/26 Javascript
Base64(二进制)图片编码解析及在各种浏览器的兼容性处理
2017/02/09 Javascript
vue2笔记 — vue-router路由懒加载的实现
2017/03/03 Javascript
深入理解Webpack 中路径的配置
2017/06/17 Javascript
详解webpack+vue-cli项目打包技巧
2017/06/17 Javascript
bootstrap fileinput实现文件上传功能
2017/08/23 Javascript
jQuery的Ajax接收java返回数据方法
2018/08/11 jQuery
解决vue2.0 element-ui中el-upload的before-upload方法返回false时submit()不生效问题
2018/08/24 Javascript
解决layui调用自定义方法提示未定义的问题
2019/09/14 Javascript
如何使用proxy实现一个简单完整的MVVM库的示例代码
2019/09/17 Javascript
js获取图片的base64编码并压缩
2020/12/05 Javascript
在Python中使用SimpleParse模块进行解析的教程
2015/04/11 Python
wxPython的安装图文教程(Windows)
2017/12/28 Python
解决python爬虫中有中文的url问题
2018/05/11 Python
Python中应该使用%还是format来格式化字符串
2018/09/25 Python
浅析Python 责任链设计模式
2020/09/11 Python
python openssl模块安装及用法
2020/12/06 Python
NYX Professional Makeup英国官网:美国平价专业彩妆品牌
2019/11/13 全球购物
2013年办公室秘书的个人自我鉴定
2013/10/24 职场文书
《翻越远方的大山》教学反思
2014/04/13 职场文书
2014年网管工作总结
2014/12/11 职场文书
酒店工程部经理岗位职责
2015/04/09 职场文书
社区党建工作总结2015
2015/05/13 职场文书
python小程序之飘落的银杏
2021/04/17 Python