简介alert()与console.log()的不同


Posted in Javascript onAugust 26, 2015

简单的说alert 是弹出提示而console.log是在调试工具里打日志,下面具体给大家列出alert()与console.log()的不同点,

[1]alert()

    [1.1]有阻塞作用,不点击确定,后续代码无法继续执行

    [1.2]alert()只能输出string,如果alert输出的是对象会自动调用toString()方法

        e.g. alert([1,2,3]);//'1,2,3'

    [1.3]alert不支持多个参数的写法,只能输出第一个值

        e.g. alert(1,2,3);//1

[2]console.log()

    [2.1]在打印台输出

    [2.2]可以打印任何类型的数据

        e.g. console.log([1,2,3]);//[1,2,3]

    [2.3]支持多个参数的写法

        e.g. console.log(1,2,3)// 1 2 3    

原型链中toString()方法输出alert()和console.log()得到不同的结果

<script type="text/javascript">
var a = [1,2,3];
alert(a); //1,2,3
Array.prototype.toString = function(){
  return 'str';
}
alert(a); //str
</script>

<script type="text/javascript">
var a = [1,2,3];
console.log(a); //[1,2,3]
Array.prototype.toString = function(){
  return 'str';
}
console.log(a); //[1,2,3]
</script>

上面的代码输出的结果不一样的原因如下:

console.log() 可以打印任何类型的数据。而 alert() 只能输出string,如果alert输出是对象会自动调用 toString() 方法。如果想 console.log() 输出的与alert相同,需要调用 toString() :

console.log(obj. toString() );

和自己写不写toString()完全没有关系,你自己写的那个toStrong() 只是重写了对象默认的toString()方法。

如果你没有重写toString()方法时,alert() 也会调用默认的。

还是那句话: console.log() 可以打印任何类型的数据,并会因为你自己重写了toString(),而调用。如果log() 也只能打印string的话,那么console 的这个log 方法就没有存在的必要了。

主要是俩个函数所期望的数据类型不一样。alert()期望的数据类型是string型的。这就是相当于要把对象用在string语境中,自然就会做出相应的转换。console.log()显然是可以接受任何类型的数据。那他就不用转换。也就是说不用放在string语境中。那OBJ自然是他一开始的数据类型。

以上内容列出了alert()与console.log()的不同,有不同想法的朋友,欢迎提出,分享给大家,共同学习进步。

Javascript 相关文章推荐
JQuery为textarea添加maxlength属性并且兼容IE
Apr 25 Javascript
JavaScript 模拟类机制及私有变量的方法及思路
Jul 10 Javascript
超级好用的jQuery圆角插件 Corner速成
Aug 31 Javascript
javascript数据类型示例分享
Jan 19 Javascript
全面解析JavaScript中的valueOf与toString方法(推荐)
Jun 14 Javascript
第一次接触神奇的Bootstrap菜单和导航
Aug 01 Javascript
完全深入学习Bootstrap表单
Nov 28 Javascript
vue中实现先请求数据再渲染dom分享
Mar 17 Javascript
Angular实现模版驱动表单的自定义校验功能(密码确认为例)
May 17 Javascript
vue移动端监听滚动条高度的实现方法
Sep 03 Javascript
TypeScript中的方法重载详解
Apr 12 Javascript
使用 Jest 和 Supertest 进行接口端点测试实例详解
Apr 25 Javascript
jQuery左右滚动支持图片放大缩略图图片轮播代码分享
Aug 26 #Javascript
JS根据key值获取URL中的参数值及把URL的参数转换成json对象
Aug 26 #Javascript
jquery实现的横向二级导航效果代码
Aug 26 #Javascript
jQuery三级下拉列表导航菜单代码分享
Apr 15 #Javascript
jquery用ajax方式从后台获取json数据后如何将内容填充到下拉列表
Aug 26 #Javascript
js钢琴按钮波浪式图片排列效果代码分享
Aug 26 #Javascript
javascript中alert()与console.log()的区别
Aug 26 #Javascript
You might like
用PHP读取超大文件的实例代码
2012/04/01 PHP
关于Sphinx创建全文检索的索引介绍
2013/06/25 PHP
PHP查询网站的PR值
2013/10/30 PHP
PHP正则表达式入门教程(推荐)
2016/05/18 PHP
PHP怎样用正则抓取页面中的网址
2016/08/09 PHP
微信 getAccessToken方法详解及实例
2016/11/23 PHP
Extjs表单常见验证小结
2014/03/07 Javascript
jquery动态添加删除(tr/td)
2015/02/09 Javascript
Node.js抓取中文网页乱码问题和解决方法
2015/02/10 Javascript
基于jQuery实现收缩展开功能
2016/03/18 Javascript
js实现为a标签添加事件的方法(使用闭包循环)
2016/08/02 Javascript
JavaScript 函数模式详解及示例
2016/09/07 Javascript
JavaScript 实现的checkbox经典实例分享
2016/10/16 Javascript
微信小程序 选择器(时间,日期,地区)实例详解
2016/11/16 Javascript
JS+HTML5实现上传图片预览效果完整实例【测试可用】
2017/04/20 Javascript
基于JS对象创建常用方式及原理分析
2017/06/28 Javascript
使用vue构建一个上传图片表单
2017/07/04 Javascript
postman+json+springmvc测试批量添加实例
2018/03/31 Javascript
jQuery内容过滤选择器与子元素过滤选择器用法实例分析
2019/02/20 jQuery
layui动态绑定事件的方法
2019/09/20 Javascript
python中dir()与__dict__属性的区别浅析
2018/12/10 Python
django将网络中的图片,保存成model中的ImageField的实例
2019/08/07 Python
IntelliJ 中配置 Anaconda的过程图解
2020/06/01 Python
PyCharm Ctrl+Shift+F 失灵的简单有效解决操作
2021/01/15 Python
HTML5页面中尝试调起APP功能
2017/09/12 HTML / CSS
印尼最大的在线购物网站:MatahariMall.com
2016/08/26 全球购物
Homestay中文官网:全球寄宿家庭
2018/10/18 全球购物
婚礼证婚人证婚词
2014/01/08 职场文书
写演讲稿所需要注意的4个条件
2014/01/09 职场文书
葬礼司仪主持词
2014/03/31 职场文书
有关环保的标语
2014/06/13 职场文书
小学教师个人工作总结2015
2015/04/20 职场文书
2015年乡镇统计工作总结
2015/04/22 职场文书
导游词之南迦巴瓦峰
2019/11/19 职场文书
k8s部署redis cluster集群的实现
2021/06/24 Redis
Golang map映射的用法
2022/04/22 Golang