!DOCTYPE HTML>
<html>
<head>
<meta name="content-type" content="text/html; charset=utf-8">
<title> 基础视频 </title>
<script type="text/javascript" language="javascript">

window.onload=function()
{
var oTxt1=document.getElementByID('txt1');
var oTxt2=document.getElementByID('txt2');
var oBtn=document.getElementByID('btn1');

oBtn.onclick=function()

{
alert(parseInt(oTxt1.value)+parseInt(oTxt2.value));
}
}
var a=12;
alert(typeof a);
</script>
</head>
<body>
我们是好朋友

<input id="txt1" type="text" />
<input id="txt2" type="text" />
<input id="btn1" type="button" value="求和" />

</body>

</html>

居然调试不过。专心找问题ING。。。。

1.javascript的组成部分
  • ECMAscript----主要用来浏览器解析,例如,定义一个变量,函数----浏览器几乎都兼容
  • BOM(browser object model)----浏览器对象模型,针对浏览器的操作,例如弹出窗口,移动浏览器的位置,打印等等----几乎不兼容,不过用的也比较少。
  • DOM(document object model)----文档对象模型,操作页面的功能,例如获取文档的div,class,添加元素等----大部分都兼容

2.变量类型

  • number
  • string
  • boolean
  • object
  • function
  • undefined
  • 建议:一个变量只存储一个类型的数据

3.对象(js里一切都是对象)

基本类型:number,string,boolean,undefined他们都很单纯,都简简单单的(这些不是对象)

复合类型:object,数组array,日期对象date,复合类型由一些基本类型复合而成,包括了一些杂七杂八的东西。

4.数据类型转换----显示转换/隐式转换

 1 <script>
2 window.onload=function ()
3 {
4 var oTxt1=document.getElementById('txt1');
5 var oTxt2=document.getElementById('txt2');
6 var oBtn=document.getElementById('btn1');
7
8 oBtn.onclick=function ()
9 {
10 alert(parseInt(oTxt1.value)+parseInt(oTxt2.value));
11 };
12 };
13 </script>
14 </head>
15
16 <body>
17 <input id="txt1" type="text" />
18 <input id="txt2" type="text" />
19 <input id="btn1" type="button" value="求和" />
20 </body>

优化后,如果输入的不是数值,会提示。

 1 <script>
2 window.onload=function ()
3 {
4 var oTxt1=document.getElementById('txt1');
5 var oTxt2=document.getElementById('txt2');
6 var oBtn=document.getElementById('btn1');
7
8 oBtn.onclick=function ()
9 {
10 var num=parseInt(oTxt1.value)+parseInt(oTxt2.value);
11
12 if(isNaN(num))
13 {
14 alert('您输入的有误');
15 }
16 else
17 {
18 alert(num);
19 }
20 };
21 };
22 </script>

如果在文本框输入不同的两个数字,例如2和3,那么按钮的单击事件会弹出23,而不是5,因为文本框里面的东西默认的就是字符串而不是数值型的数据。这里使用parseInt函数可以转化字符串的类型。

1 <script>
2 var a='13ab';
3 alert(parseInt(a));
4 </script>

准确的说,parseInt函数是提取前面的数字,如果遇到字符串就不会继续往后面去值了。

1 <script>
2 var a='ab';
3 alert(parseInt(a));
4 </script>

如果是这样的话,会出现NaN (not a number),也就是不是一个数字的意思。

1 <script>
2 var a='12.6';
3 alert(parseInt(a));
4 </script>

如果是这样的话,会弹出12这个数字,后面的小数点直接省略了。

1 <script>
2 var a='12.6';
3 alert(parseFloat(a));
4 </script>

parseInt的兄弟parseFloat函数。

NaN(这是个神奇的东西,他和自己也不相等,可能在某种程度上有区别吧)

JavaScript 以 NaN 的形式输出 Number.NaN。请注意,NaN 与其他数值进行比较的结果总是不相等的,包括它自身在内。因此,不能与 Number.NaN 比较来检测一个值是不是数字,而只能调用 isNaN() 来比较。

1 <script>
2 var a=parseInt('ab');
3 var b=parseInt('ab');
4 alert(a==b);
5 </script>
1 <script>
2 var a=parseInt('ab');
3 var b=parseInt('ab');
4 alert(a==b);
5 </script>

这两个的结果都是flase.以上都是属于显示转换。

隐式转换:

1 <script>
2 var a='2';
3 var b=2;
4 alert(a==b);
5 </script>

运行结果是true。这就是一个隐式转换的例子,他会把两边的数据类型进行比较然后相加。

1 <script>
2 var a='2';
3 var b='2';
4 alert(a-b);
5 </script>

如果是减号那么结果是0,如果是加号结果就是22;你懂得应该。只有加法不能转化,乘除减法都可以。

关于===

全等就是不仅要内容相等,而且类型也要相等。

5.变量作用域

  • 全局变量---是魔鬼==!
  • 全局变量的存在主要有以下一些原因:
    1,使用全局变量会占用更多的内存(因为其生命期长),不过在计算机配置很高的今天,这个不成为什么问题,除非使用的是巨大对象的全局变量,能避免就一定要避免。
    2,使用全局变量程序运行时速度更快一些(因为内存不需要再分配),同样现在也快不了多少。
    3,对于局部变量的名字空间污染,这个在不使用太多变量时是可以避免的。
    4,当全局变量与局部变量重名的时候,起作用的是局部变量,全局变量被屏蔽掉。
    总之,全局变量可以使用,但是全局变量使用时应注意的是尽可能使其名字易于理解,而且不能太短,避免名字空间的污染;避免使用巨大对象的全局变量。(这一段摘自百度百科)
  • 局部变量---闭包

这里比较好理解就不解释了。闭包的知识细节还有很多,今天先到这吧,洗澡睡觉,晚安~

  •  1 <script>
    2 function aa(){ //父函数
    3 var a=1;
    4 function bb(){ //子函数,可以啃老。
    5 alert(a);
    6 };
    7 bb();
    8 };
    9 aa();
    10 </script>

javascript 基础篇 随课笔记的更多相关文章

  1. 一步步学习javascript基础篇(0):开篇索引

    索引: 一步步学习javascript基础篇(1):基本概念 一步步学习javascript基础篇(2):作用域和作用域链 一步步学习javascript基础篇(3):Object.Function等 ...

  2. 一步步学习javascript基础篇(3):Object、Function等引用类型

    我们在<一步步学习javascript基础篇(1):基本概念>中简单的介绍了五种基本数据类型Undefined.Null.Boolean.Number和String.今天我们主要介绍下复杂 ...

  3. JavaScript基础第05天笔记

    JavaScript基础第05天笔记 1 - 作用域 1.1 作用域概述 通常来说,一段程序代码中所用到的名字并不总是有效和可用的,而限定这个名字的可用性的代码范围就是这个名字的作用域.作用域的使用提 ...

  4. JavaScript基础第04天笔记

    JavaScript基础第04天笔记 1 - 数组 1.1 数组的概念 数组可以把一组相关的数据一起存放,并提供方便的访问(获取)方式. 数组是指一组数据的集合,其中的每个数据被称作元素,在数组中可以 ...

  5. JavaScript基础第03天笔记

    JavaScript基础第03天笔记 1 - 循环 1.1 for循环 语法结构 for(初始化变量; 条件表达式; 操作表达式 ){ //循环体 } 名称 作用 初始化变量 通常被用于初始化一个计数 ...

  6. Javascript基础篇小结

    转载请声明出处 博客原文 随手翻阅以前的学习笔记,顺便整理一下放在这里,方便自己复习,也希望你有也有帮助吧 第一课时 入门基础 知识点: 操作系统就是个应用程序 只要是应用程序都要占用物理内存 浏览器 ...

  7. JavaScript基础第02天笔记

    JavaScript基础第02天 1 - 运算符(操作符) 1.1 运算符的分类 运算符(operator)也被称为操作符,是用于实现赋值.比较和执行算数运算等功能的符号. JavaScript中常用 ...

  8. JavaScript基础第01天笔记

    JavaScript基础第01天 1 - 编程语言 1.1 编程 编程: 就是让计算机为解决某个问题而使用某种程序设计语言编写程序代码,并最终得到结果的过程. 计算机程序: 就是计算机所执行的一系列的 ...

  9. 一步步学习javascript基础篇(8):细说事件

    终于学到事件了,不知道为何听到“事件”就有一种莫名的兴奋.可能是之前的那些知识点过于枯燥无味吧,说起事件感觉顿时高大上了.今天我们就来好好分析下这个高大上的东西. 可以说,如果没有事件我们的页面就只能 ...

随机推荐

  1. 编辑距离Edit Distance 非常典型的DP类型题目

    https://leetcode.com/problems/edit-distance/?tab=Description 真的非常好,也非常典型. https://discuss.leetcode.c ...

  2. 破解者是如何篡改游戏内数值的,揭秘Android手游破解全过程

    由于Android系统的开放性,让人人都是开发者成为可能,也正因如此,手机APP遭受破解和盗版问题长期存在,且愈演愈烈.尤其是手游 行业,如刀塔传奇.植物大战僵尸.2048等知名游戏被破解的案例不胜枚 ...

  3. bzoj1050【HAOI2006】旅行comf

    1050: [HAOI2006]旅行comf Time Limit: 10 Sec  Memory Limit: 162 MB Submit: 2205  Solved: 1174 [Submit][ ...

  4. 从client(content=&quot;&lt;p&gt;&lt;/p&gt;&quot;)中检測到有潜在危急的 Request.Form 值。

    最近的站点要做一个新闻模块,站点后台须要对新闻进行管理,拿到富文本编辑器的内容,在获取的时候会报一个错误:从client(content="<p>.....</p>& ...

  5. [C++] upper_bound和lower_bound

    upper_bound 源码 template <class ForwardIterator, class T> ForwardIterator upper_bound (ForwardI ...

  6. Slimming Paint (a.k.a. Redesigning Painting and Compositing)

    Slimming Paint is a Paint team project to re-implement the Blink<->cc picture recording API to ...

  7. Ubuntu18.06 Mate桌面环境下VirtuslBox打开虚拟机“全局菜单”异常退出解决办法

    在安装完Ubuntu18.06 Mate桌面环境后在VirtuslBox里打开虚拟机会出现“全局菜单”异常退出问题. 产生上面问题的原因是你的虚拟机可能在 显示= >屏幕= >硬件加速里勾 ...

  8. Python多版本情况下四种快速进入交互式命令行的操作技巧

    因为工作需求或者学习需要等原因,部分小伙伴的电脑中同时安装了Python2和Python3,相信在Python多版本的切换中常常会遇到Python傻傻分不清楚的情况,今天小编整理了四个操作技巧,以帮助 ...

  9. JAVA-截取字符串两边指定字符

    工具类: /** * 工具类 */ public class Tool { /** * 截取两边指定的字符 * @param character * @param symbol * @return * ...

  10. Dia Diagram Editor(流程图、UML)免费开源绘图软件

    近期工作各种繁忙,导致很少分享自己喜欢和常用的一些工具,今天有点时间再次给各位喜欢开源的小伙伴介绍一个好用.免费.开源的软件Dia Diagram Editor. 首先给大家看看这个软件的主界面吧! ...