简介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 相关文章推荐
JQuery1.4+ Ajax IE8 内存泄漏问题
Oct 15 Javascript
javascript学习笔记(十二) RegExp类型介绍
Jun 20 Javascript
浅析javascript 定时器
Dec 23 Javascript
JS实现跟随鼠标的链接文字提示框效果
Aug 06 Javascript
分享我的jquery实现下拉菜单心的
Nov 29 Javascript
谈一谈jQuery核心架构设计
Mar 28 Javascript
判断数组是否包含某个元素的js函数实现方法
May 19 Javascript
AngularJS 整理一些优化的小技巧
Aug 18 Javascript
webpack 1.x升级过程中的踩坑总结大全
Aug 09 Javascript
js input输入百分号保存数据库失败的解决方法
May 26 Javascript
vue 兄弟组件的信息传递的方法实例详解
Aug 30 Javascript
一行JavaScript代码如何实现瀑布流布局
Dec 11 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
将FCKeditor导入PHP+SMARTY的实现方法
2015/01/15 PHP
PHP实现文件上传功能实例代码
2017/05/18 PHP
php 中self,this的区别和操作方法实例分析
2019/11/04 PHP
JavaScript使用prototype定义对象类型(转)[
2006/12/22 Javascript
深入理解JavaScript系列(19):求值策略(Evaluation strategy)详解
2015/03/05 Javascript
jQuery验证插件validate使用方法详解
2020/09/13 Javascript
js只执行1次的函数示例
2016/07/20 Javascript
详解jQuery中的DOM操作
2016/12/23 Javascript
jQuery插件HighCharts绘制2D柱状图、折线图的组合双轴图效果示例【附demo源码下载】
2017/03/09 Javascript
基于Node的React图片上传组件实现实例代码
2017/05/10 Javascript
详解node.js的http模块实例演示
2018/07/12 Javascript
jquery简单实现纵向的无缝滚动代码实例
2019/04/01 jQuery
详解vuejs2.0 select 动态绑定下拉框支持多选
2019/04/25 Javascript
js+html实现周岁年龄计算器
2019/06/25 Javascript
深入探索VueJS Scoped CSS 实现原理
2019/09/23 Javascript
Vue的双向数据绑定实现原理解析
2020/02/17 Javascript
vue 图片裁剪上传组件的实现
2020/11/12 Javascript
Python UnicodeEncodeError: 'gbk' codec can't encode character 解决方法
2015/04/24 Python
Python使用Srapy框架爬虫模拟登陆并抓取知乎内容
2016/07/02 Python
Python双向循环链表实现方法分析
2018/07/30 Python
pygame游戏之旅 载入小车图片、更新窗口
2018/11/20 Python
python获取服务器响应cookie的实例
2018/12/28 Python
Python设计模式之备忘录模式原理与用法详解
2019/01/15 Python
详解爬虫被封的问题
2019/04/23 Python
一行Python代码过滤标点符号等特殊字符
2019/08/12 Python
Pytoch之torchvision.transforms图像变换实例
2019/12/30 Python
在python3中使用shuffle函数要注意的地方
2020/02/28 Python
Python脚本打包成可执行文件过程解析
2020/10/20 Python
html5表单及新增的改良元素详解
2016/06/07 HTML / CSS
中国领先的汽车保养服务平台:途虎养车
2019/10/18 全球购物
网络公司美工设计工作个人的自我评价
2013/11/03 职场文书
国庆节促销广告语2014
2014/09/19 职场文书
开学第一周值周总结
2015/07/16 职场文书
致运动员的广播稿
2015/08/19 职场文书
JavaScript 语句之常用 for 循环详解
2021/03/29 Javascript
Python 的 sum() Pythonic 的求和方法详细
2021/10/16 Python