《爱创课堂零基础入门学js.ppt》由会员分享，可在线阅读，更多相关《爱创课堂零基础入门学js.ppt（26页珍藏版）》请在金锄头文库上搜索。
1、JavaScript零基础入门学爱创课堂前端爱创课堂前端p培训培训爱创课堂爱创课堂什么是javascript?Javascipt是一种脚本语言，由web浏览器进行解释和执行。ECMAScriptDOMBOMJavaScriptECMAScript : 核心DOM : DOM : 文档对象模型文档对象模型BOM : BOM : 浏览器对象模型浏览器对象模型爱创课堂前端爱创课堂前端p培训培训爱创课堂爱创课堂怎样将Javascript应用到网页中？方法一：将javascript代码插入html文档部分的标签中 例：/javascript 代码alert(hello world);爱创课堂前端爱创课堂
2、前端p培训培训爱创课堂爱创课堂方法二：将javascript代码存放在一个独立的文件。用.js作为文件的扩展名，再利用 标签的src属性指向该文件。例：test.jsalert(hello wordld);Alert(金团网欢迎您 ！http:/);test.html爱创课堂前端爱创课堂前端p培训培训爱创课堂爱创课堂JavaScript 语法一、变量1.变量由 var 运算符加变量名定义。var age = 25;var mood = happy;2.变量名命名规则：第一个字符必须是字母、下划线(_)、或美元符号 ($);变量名中不能包含空格或标点符号（$ 除外);变量名区分大小写;不能使用保
3、留字;为了让变量名有更好的可读性，可以在变量名中适当的插入下划线分隔，如：var my_mood = happy;爱创课堂前端爱创课堂前端p培训培训爱创课堂爱创课堂二、数据类型1.字符串(String)字符串由零个或多个字符构成，字符包括字母，数字，标点符号和空格;字符串必须放在引号里（单引号或双引号）;var mood = “happy”;var mood = happy;2.数值(number)var age = 25;var price = 33.25;爱创课堂前端爱创课堂前端p培训培训爱创课堂爱创课堂3.布尔类型 (boolean)布尔型数据只能有两种种值 true 和 false;v
4、ar married = true;var married = false; 与字符串不同，不要把布尔值用引号括起来。布尔值 false 与 字符串 “false”是两回事。爱创课堂前端爱创课堂前端p培训培训爱创课堂爱创课堂4.查看数据类型 typeofvar mood = “happy”;alert(typeof mood);alert(typeof 95);5.转换成字符串var married = false;alert(married.toString();/ outputs “false”var age = 25;alert(age.toString(); /outputs “25”
5、爱创课堂前端爱创课堂前端p培训培训爱创课堂爱创课堂6.转换成数字parseInt()转换成整数parseFloat()转换成浮点数例：var test = parseInt(“blue”);/returns NaNvar test = parseInt(“1234blue”);/returns 1234var test = parseInt(“22.5”);/returns 22var test = parseFloat(“1234blue”);/returns 1234.0var test = parseFloat(“22.5”);/returns 22.5爱创课堂前端爱创课堂前端p培训培训
6、爱创课堂爱创课堂运算符1.算术运算符 + - * / %var total = (1 + 4) * 5;var i = 100;var temp = (i 20) / 2; alert(“10”+ 20)/return 1020;alert(10 + 20)/return 30; 2. 后增量/后减量运算符 + ,-var i = 10;var a = i+;/ i = i + 1;alert(a); 爱创课堂前端爱创课堂前端p培训培训爱创课堂爱创课堂3. 比较运算符 , =, 5 );/outputs true var i = 100;var n = 100;alert(i = n);/ou
7、tputs true;alert(i != n);/outputs false;4.逻辑运算符& ： 逻辑与| : 逻辑或！：逻辑非var i = 8;alert ( i5 & i 100 | i 5);/outputs false 爱创课堂前端爱创课堂前端p培训培训爱创课堂爱创课堂注释/单行注释/* */多行注释爱创课堂前端爱创课堂前端p培训培训爱创课堂爱创课堂程序流程控制一、条件语句if(condition) statements1 else statement2例： if(10 5) alert(“hello world”); var i = 90;if(i 100) alert(i +
8、 “大于100”);else if(i 80) alert(i + “大于80”); else alert(i + “小于100”); 爱创课堂前端爱创课堂前端p培训培训爱创课堂爱创课堂二、循环语句1.Whilewhile (exp) /statements; 例：var count = 1;while(count 11)alert(count);count+;爱创课堂前端爱创课堂前端p培训培训爱创课堂爱创课堂2. Dowhiledo /statements;while (condition);例：var count = 1;do alert(count);count+;while(count
9、 11);爱创课堂前端爱创课堂前端p培训培训爱创课堂爱创课堂3.for 循环语句for(initial; expression; post-loop-expression)/statement;例： for(var count = 1; count 11; count+)alert(count);爱创课堂前端爱创课堂前端p培训培训爱创课堂爱创课堂4. break 语句和 continue 语句break 语句可以立即退出循环;continue 语句只是退出当前循环;例：var n = 0;for(var i = 1; i 5) continue;n+;alert(n);爱创课堂前端爱创课堂前端
10、p培训培训爱创课堂爱创课堂例：var n = 0;for(var i=1; i 5) continue;n+;alert(n);爱创课堂前端爱创课堂前端p培训培训爱创课堂爱创课堂5. Switch 语句switch (expression)case value:/statementbreak;case value:/statementbreak;default:/statement例：var i = 25;switch(i)case 25:case 100:alert(100);break;default:alert(other);爱创课堂前端爱创课堂前端p培训培训爱创课堂爱创课堂函数函数就是
11、完成某个功能的一组语句，函数由关键字 function 函数名加一组参数定义;函数在定义后可以被重复调用，通常将常用的功能写成一个函数，利用函数可以使代码的组织结构更多清晰。基本语法：function funName (arg0, arg1, argN)/statements例1：function say_hello (name, msg)alert(“hello”+ name + “:”+ msg);say_hello(“david”, “how are you today?”);爱创课堂前端爱创课堂前端p培训培训爱创课堂爱创课堂使用 return 语句从函数返回值例2：function s
12、um (num1, num2)return num1 + num2;var s = sum(1, 2); document.write(s);alert(s);爱创课堂前端爱创课堂前端p培训培训爱创课堂爱创课堂变量的作用域变量既可以是全局，也可以是局部的。全局变量：可以在脚本中的任何位置被引用，一旦你在某个脚本里声明了全局变量，你就可以在这个脚本的任何位置（包括函数内部）引用它，全局变量的作用域是整个脚本;局部变量：只存在于对它做出声明的函数内部，在函数的外部无法相用它，局部变量的作用域仅限于函数内部;例：function square(num)var total;total = num *
13、num;return total;var total = 50;/全局变量alert(total);var number = square(20);alert(total);/函数内部声明的变量，就是局部变量；其他情况都是属于全局变量爱创课堂前端爱创课堂前端p培训培训爱创课堂爱创课堂练习：编写一个函数求N的阶乘; 3! = 3 * 2 * 110! = 10 * (10 -1)n! = n* (n-1)!function svm(mm)svm=mm*(mm-1)return svm;alert(svm(4);/4!的值爱创课堂前端爱创课堂前端p培训培训爱创课堂爱创课堂JavaScript 内部
14、函数在javascript中有一些功能是很常用的，它们以全局函数的形式提供给用户，这些函数称为内部函数。1.eval() Eval 接受一个字符串类型的参数，将这个字符串作为代码在上下文环境中执行，并返回执行的结果;例：var i = 1;eval(“i = i + 1”);eval(“alert(i);”);Eval(“alert(金团网http:/)”);/eval的用法 结果弹出对话框 金团网网址2.parseInt 和 parseFloat 将字符串转换为数字爱创课堂前端爱创课堂前端p培训培训爱创课堂爱创课堂3. escape 和 unescape 进行URL编码和解码 例：var url = “http:/ = escape(url);alert(url);var es = escape(“金团网);alert(es);/加密alert(unescape(es);/解密爱创课堂前端爱创课堂前端p培训培训爱创课堂爱创课堂*谢谢您的查阅！爱创课堂前端爱创课堂前端p培训培训爱创课堂爱创课堂
