简介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的淡入淡出的特效基础练习
Dec 13 Javascript
THREE.JS入门教程(6)创建自己的全景图实现步骤
Jan 25 Javascript
js解析与序列化json数据(一)json.stringify()的基本用法
Feb 01 Javascript
JavaScript中Function详解
Feb 27 Javascript
JavaScript中神奇的call()方法
Mar 12 Javascript
Javascript编写俄罗斯方块思路及实例
Jul 07 Javascript
jQuery 3.0中存在问题及解决办法
Jul 15 Javascript
angularJS 如何读写缓冲的方法(推荐)
Aug 06 Javascript
基于JS实现回到页面顶部的五种写法(从实现到增强)
Sep 03 Javascript
js/jquery控制页面动态加载数据 滑动滚动条自动加载事件的方法
Feb 08 Javascript
vue组件Prop传递数据的实现示例
Aug 17 Javascript
JS图片懒加载技术实现过程解析
Jul 27 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
javascript 小型动画组件与实现代码
2010/06/02 PHP
PHP转换文件夹下所有文件编码的实现代码
2013/06/06 PHP
php实现webservice实例
2014/11/06 PHP
Ubuntu彻底删除PHP7.0的方法
2018/07/27 PHP
jQuery简单几行代码实现tab切换
2015/03/10 Javascript
JavaScript获取表单内所有元素值的方法
2015/04/02 Javascript
js中substring和substr两者区别和使用方法
2015/11/09 Javascript
vue-cli之router基本使用方法详解
2017/10/17 Javascript
ajax请求+vue.js渲染+页面加载的示例
2018/02/11 Javascript
echarts实现地图定时切换散点与多图表级联联动详解
2018/08/07 Javascript
关于JavaScript中高阶函数的魅力详解
2018/09/07 Javascript
Node.js+Express+Mysql 实现增删改查
2019/04/03 Javascript
利用原生JavaScript实现造日历轮子实例代码
2019/05/08 Javascript
Element-ui中元素滚动时el-option超出元素区域的问题
2019/05/30 Javascript
[00:36]DOTA2风云人物相约完美“圣”典 12月17日不见不散
2016/11/30 DOTA
Python中的with语句与上下文管理器学习总结
2016/06/28 Python
python3.6+opencv3.4实现鼠标交互查看图片像素
2018/02/26 Python
python爬虫框架scrapy实现模拟登录操作示例
2018/08/02 Python
用python写测试数据文件过程解析
2019/09/25 Python
PYTHON绘制雷达图代码实例
2019/10/15 Python
屏蔽Django admin界面添加按钮的操作
2020/03/11 Python
在脚本中单独使用django的ORM模型详解
2020/04/01 Python
关于jupyter打开之后不能直接跳转到浏览器的解决方式
2020/04/13 Python
Python批量处理csv并保存过程解析
2020/05/16 Python
如何以Winsows Service方式运行JupyterLab
2020/08/30 Python
pycharm 复制代码出现空格的解决方式
2021/01/15 Python
一款利用纯css3实现的360度翻转按钮的实例教程
2014/11/05 HTML / CSS
医生实习工作总结的自我评价
2013/09/27 职场文书
村干部培训方案
2014/05/02 职场文书
数据保密承诺书
2014/06/03 职场文书
学校感恩教育活动总结
2014/07/07 职场文书
司机岗位职责说明书
2014/07/29 职场文书
学校开学标语
2014/10/06 职场文书
成绩报告单家长评语
2014/12/30 职场文书
就业证明函
2015/06/17 职场文书
创业计划书之家政服务
2019/09/18 职场文书