简介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 相关文章推荐
小议javascript 设计模式 推荐
Oct 28 Javascript
JavaScript操纵窗口的方法小结
Jun 28 Javascript
JS使用eval解析JSON的注意事项分析
Nov 14 Javascript
只需五句话搞定JavaScript作用域(经典)
Jul 26 Javascript
从零开始学习Node.js系列教程之SQLite3和MongoDB用法分析
Apr 13 Javascript
vue实现验证码输入框组件
Dec 14 Javascript
vue + element-ui的分页问题实现
Dec 17 Javascript
详解VUE里子组件如何获取父组件动态变化的值
Dec 26 Javascript
jQuery实现的点击显示隐藏下拉菜单功能完整示例
May 17 jQuery
JS在Array数组中按指定位置删除或添加元素对象方法示例
Nov 19 Javascript
纯JS实现五子棋游戏
May 28 Javascript
vue浏览器返回监听的具体步骤
Feb 03 Vue.js
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写出自己的BLOG系统 2
2010/04/12 PHP
php使用websocket示例详解
2014/03/12 PHP
php查询操作实现投票功能
2016/05/09 PHP
php 实现一个字符串加密解密的函数实例代码
2016/11/01 PHP
PHP串行化与反串行化实例分析
2016/12/27 PHP
AutoSave/自动存储功能实现
2007/03/24 Javascript
JS 面向对象的5钟写法
2009/07/31 Javascript
通过Jquery遍历Json的两种数据结构的实现代码
2011/01/19 Javascript
原生JS实现表单checkbook获取已选择的值
2013/07/21 Javascript
javascript函数重载解决方案分享
2014/02/19 Javascript
javascript制作的滑动图片菜单
2015/05/15 Javascript
JS实现仿雅虎首页快捷登录入口及导航模块效果
2015/09/19 Javascript
JavaScript调用传递变量参数的相关问题及解决办法
2015/11/01 Javascript
浅析AngularJS中的指令
2016/03/20 Javascript
Bootstrap弹出框modal上层的输入框不能获得焦点问题的解决方法
2016/12/13 Javascript
详解支持Angular 2的表格控件
2017/01/19 Javascript
bootstrap常用组件之头部导航实现代码
2017/04/20 Javascript
基于Bootstrap实现城市三级联动
2017/11/23 Javascript
JS实现仿微信支付弹窗功能
2018/06/25 Javascript
vue+Element-ui实现登录注册表单
2020/11/17 Javascript
使用Python的Tornado框架实现一个一对一聊天的程序
2015/04/25 Python
Python设计模式编程中Adapter适配器模式的使用实例
2016/03/02 Python
Python 字符串转换为整形和浮点类型的方法
2018/07/17 Python
PyCharm配置mongo插件的方法
2018/11/30 Python
python中将两组数据放在一起按照某一固定顺序shuffle的实例
2019/07/15 Python
Python3 filecmp模块测试比较文件原理解析
2020/03/23 Python
python numpy库np.percentile用法说明
2020/06/08 Python
pycharm软件实现设置自动保存操作
2020/06/08 Python
纯CSS3实现带动画效果导航菜单无需js
2013/09/27 HTML / CSS
电子狗项圈:eDog Australia
2019/12/04 全球购物
Lucene推荐的分页方式是什么?
2015/12/07 面试题
教师专业理论水平的自我评价分享
2013/11/09 职场文书
大学生先进事迹材料
2014/02/16 职场文书
2014年学校国庆主题活动方案
2014/09/16 职场文书
学校端午节活动总结
2015/02/11 职场文书
2015年学校团委工作总结
2015/05/26 职场文书