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 数组操作代码集锦
Apr 28 Javascript
Javascript 获取字符串字节数的多种方法
Jun 02 Javascript
JQuery操作三大控件(下拉,单选,复选)的方法
Aug 06 Javascript
JavaScript使用循环和分割来替换和删除元素实例
Oct 13 Javascript
jQuery遍历json的方法分析
Apr 16 Javascript
jQuery grep()方法详解及实例代码
Oct 30 Javascript
JS实现iframe自适应高度的方法示例
Jan 07 Javascript
javascript基础知识之html5轮播图实例讲解(44)
Feb 17 Javascript
d3.js入门教程之数据绑定详解
Apr 28 Javascript
js案例之鼠标跟随jquery版(实例讲解)
Jul 21 jQuery
VUE简单的定时器实时刷新的实现方法
Jan 20 Javascript
如何使JavaScript休眠或等待
Apr 27 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实现多级树型菜单
2006/10/09 PHP
一些常用的php函数
2006/12/06 PHP
PHP 常用函数库和一些实用小技巧
2009/01/01 PHP
在PHP 7下安装Swoole与Yar,Yaf的方法教程
2017/06/02 PHP
PHP判断json格式是否正确的实现代码
2017/09/20 PHP
PHP工厂模式简单实现方法示例
2018/05/23 PHP
thinkPHP框架乐观锁和悲观锁实例分析
2019/10/30 PHP
JS获取IUSR_机器名和IWAM_机器名帐号的密码
2006/12/06 Javascript
csdn 博客中实现运行代码功能实现
2009/08/29 Javascript
ASP.NET中基于JQUERY的高性能的TreeView补充
2011/02/23 Javascript
js中的时间转换—毫秒转换成日期时间的示例代码
2014/01/26 Javascript
javascript的解析执行顺序在各个浏览器中的不同
2014/03/17 Javascript
jQuery动态创建html元素的常用方法汇总
2014/09/05 Javascript
node.js中的fs.rmdirSync方法使用说明
2014/12/16 Javascript
JS实现点击文字对应DIV层不停闪动效果的方法
2015/03/02 Javascript
基于MVC5和Bootstrap的jQuery TreeView树形控件(一)之数据支持json字符串、list集合
2016/08/11 Javascript
jquery把int类型转换成字符串类型的方法
2016/10/07 Javascript
原生的强大DOM选择器querySelector介绍
2016/12/21 Javascript
axios基本入门用法教程
2017/03/25 Javascript
MVVM框架下实现分页功能示例
2018/06/14 Javascript
快速解决vue2+vue-cli3项目ie兼容的问题
2020/11/17 Vue.js
Python break语句详解
2014/03/11 Python
python实现将一个数组逆序输出的方法
2018/06/25 Python
Python3实现的反转单链表算法示例
2019/03/08 Python
Python字符串对象实现原理详解
2019/07/01 Python
Jupyter notebook运行Spark+Scala教程
2020/04/10 Python
Python实现AI换脸功能
2020/04/10 Python
Django ForeignKey与数据库的FOREIGN KEY约束详解
2020/05/20 Python
Python3爬虫里关于识别微博宫格验证码的知识点详解
2020/07/30 Python
Python使用socket模块实现简单tcp通信
2020/08/18 Python
pip 20.3 新版本发布!即将抛弃 Python 2.x(推荐)
2020/12/16 Python
CSS3 优势以及网页设计师如何使用CSS3技术
2009/07/29 HTML / CSS
美国生日蛋糕店:Bake Me A Wish!
2017/02/08 全球购物
个人自荐材料
2014/05/23 职场文书
手把手教你导入Go语言第三方库
2021/08/04 Golang
Win10玩csgo闪退如何解决?Win10玩csgo闪退的解决方法
2022/07/23 数码科技