Javascript 基础篇
来源：互联网 发布：mac pycharm设置 编辑：程序博客网 时间：2024/06/15 17:21
第一章 在html中使用
向HTML页面插入javascript的方法就是使用< script>元素。
脚本可被放置在 HTML 页面的 < body> 和 < head> 部分中。
< body> 中的 JavaScript:
<!DOCTYPE html><html><body>... <script> document.write("该部分即向html页面插入的javascript脚本代码"); </script>...</body></html>< head> 中的 JavaScript ：
<!DOCTYPE html><html><head> <script> function myFunction() { document.getElementById("demo").innerHTML="我的第一个 JavaScript 函数"; } </script></head><body> <button type="button" onclick="myFunction()">该按钮被点击后会调用myFuntion()函数</button></body></html>外部的 JavaScript：
<!DOCTYPE html><html><body> <script src="myScript.js"></script></body></html>第二章 javascript简单语法
JavaScript 字面量（一种表示值的记法）
1.数字（Number）字面量
可为整数/小数（3.14 1001 123e5）
2.字符串（String）字面量
可使用单引号或双引号（“Hi” ‘Hi’）
3.表达式字面量
用于计算 (5+6 6*5)
4.数组（Array）字面量
定义一个数组
[40, 100, 1, 5, 25, 10]
5.对象（Object）字面量
定义一个对象
{firstName:”John”, lastName:”Doe”, age:50, eyeColor:”blue”}
6.函数（Function）字面量
定义一个函数
function myFunction(a, b) { return a * b;}
javascript变量
变量用于存储信息的“容器”。
JavaScript 使用关键字 var 来定义变量， 使用等号来为变量赋值：
var length;length = 6;变量可以通过变量名访问。在指令式语言中，变量通常是可变的。字面量是一个恒定的值。
注意：
变量必须以字母开头
变量也能以 $ 和 _ 符号开头（不过我们不推荐这么做）
变量名称对大小写敏感（y 和 Y 是不同的变量）
JavaScript 关键字
JavaScript 关键字用于标识要执行的操作。
JavaScript 关键字必须以字母、下划线（_）或美元符（$）开始。
后续的字符可以是字母、数字、下划线或美元符（数字是不允许作为首字符出现的，以便 JavaScript 可以轻易区分开关键字和数字）。
以下是 JavaScript 中最重要的保留字：
JavaScript 注释
单行注释 //
多行注释 /**/
JavaScript 语句标识符
JavaScript 语句通常以一个 语句标识符 为开始，并执行该语句。
语句标识符是保留关键字不能作为变量名使用。
Javascript语句标识符（关键字）：
第三章 javascript运算符
算数运算符
＋ - * / % ++ –
赋值运算符
= += -= *= /= %=
补充：
+ 运算符用于把文本值或字符串变量加起来（连接起来）。（txt=”what”+”?”;）
如果把数字与字符串相加，结果将成为字符串！
比较运算符
== 等于
=== 绝对等于（值和类型均相等）
!= 不等于
!== 不绝对等于（值和类型有一个不相等，或两个都不相等）
大于
< 小于
= 大于或等于
<= 小于或等于
逻辑运算符
&& and (x < 10 && y > 1) 为 true
|| or (x==5 || y==5) 为 false
! not !(x==y) 为 true
条件运算符
variablename=(condition)?value1:value2
如：var a = (100>50)?”yes”:”no” //a为”yes”
第四章 javascript数据类型
五种简单数据类型（基本数据类型）
字符串（String）
数字(Number)
布尔(Boolean)
空（Null）
未定义（Undefined）。
一种复杂数据类型
对象(Object)
JavaScript 拥有动态类型，即相同的变量可用作不同的类型
var x; // x 为 undefined var x = 5; // 现在 x 为数字 var x = "hi"; // 现在 x 为字符串1.JavaScript 字符串
字符串可以为引号的任意文本，可用单引号或双引号
var a=" hello ";var b=" my name is 'Lee XX' ";var c=' your name is "KangKang" ';2.JavaScript 数字
JavaScript 只有一种数字类型。数字可以带小数点，也可以不带：
var x1=34.00; //使用小数点来写var x2=34; //不使用小数点来写//极大或极小的数字可通过科学（指数）计数法写var y=123e5; //12300000var z=123e-5; //0.001233.JavaScript 布尔
布尔（逻辑）只能有两个值：true 或 false。
多用于条件测试
var x=true;var y=false;补充：用！！可实现boolean转型
4.Undefined 和 Null
Undefined 这个值表示变量不含有值。
可以通过将变量的值设置为 null 来清空变量。
//undefinedvar cars;alert(cars == "undefined"); //truealert(message) //报错alert(typeof cars) //"undefined"alert(typeof message) //"undefined"//nullvar cars = null;alert(typeof cars) //"object"alert(null == undefined) //true,undefined派生自null5.JavaScript 对象
对象由花括号分隔。
在括号内部，对象的属性以名称和值对的形式 (name : value) 来定义。属性由逗号分隔：
var person={firstname : "John",lastname : "Doe",id : 5566};声明变量类型
当您声明新变量时，可以使用关键词 “new” 来声明其类型：
var carname=new String;var x= new Number;var y= new Boolean;var person= new Object;第五章 javascript对象
javascript 对象是 拥有属性和方法 的数据
对象定义：
var person = { firstName:"John", lastName:"Doe", age:50, eyeColor:"blue"};访问对象属性
//方式1：person.lastName;//方式2：person["lastName"];访问对象方法
objectName.methodName()第六章 javascript函数
JavaScript 函数语法
//无参function functionname(){执行代码}//带参function myFunction(var1,var2){代码}//带有返回值function myFunction(){ var x=5; return x;}声明方式：
//1.普通的函数声明function box(num1,num2){ return num1+num2;}//2.使用变量初始化函数var box = function(num1,num2){ return num1+num2;}//3.使用Function构造函数,不推荐，导致解析两次代码var box=new Function('num1','num2','return num1+num2');函数内部属性：
1.arguments：一个类数组对象，包含着传入函数的所有参数。
2.callee：一个指针，指向拥有这个arguments对象的函数。
function box(num){ if(num<=1){ return 1; }else { return num*box(num-1); }}//上述递归函数内部会调用自身，如果函数名不该变则没有问题，若函数名改变，内部的自身调用则需要逐一改变，解决该问题：function box(num){ if(num<=1){ return 1; }else { return num*argumens.callee(num-1);//使用callee调用自身 }}函数的属性和方法：
length：函数希望接收的命名参数的个数
prototype：另行介绍
prototype属性下的两个方法：通过冒充改变作用域
apply()
call()
function box (num1,num2) { return num1+num2;}function sayBox1(num1,num2){ return box.apply(this,[num1,num2]);//this为作用域，这里即window,[]表示box需要的参数 //或 return box.apply(this,arguments);}function sayBox2(num1,num2){ return box.call(this,num1,num2);//call与apply仅传参不同}alert(sayBox1(10,10));//20alert(sayBox2(10,10));//20局部 JavaScript 变量
在 JavaScript 函数内部声明的变量（使用 var）是局部变量，所以只能在函数内部访问它。
可以在不同的函数中使用名称相同的局部变量，因为只有声明过该变量的函数才能识别出该变量。
只要函数运行完毕，本地变量就会被删除。
全局 JavaScript 变量
在函数外声明的变量是全局变量，网页上的所有脚本和函数都能访问它。
var carName = " Volvo";// 此处可调用 carName 变量function myFunction() { // 函数内可调用 carName 变量 }JavaScript 变量的生存期
JavaScript 变量的生命期从它们被声明的时间开始。
局部变量会在函数运行以后被删除。
全局变量会在页面关闭后被删除
向未声明的 JavaScript 变量分配值
把值赋给尚未声明的变量，该变量将被自动作为全局变量声明。
// 此处可调用 carName 变量function myFunction() { carName = "Volvo"; // 此处可调用 carName 变量}第七章 javascript字符串
字符串长度
可以使用内置属性 length 来计算字符串的长度：
var txt = "ABCDEFG";alert(txt.length); //7特殊字符
字符串卸载单引号或双引号中，但以下实例
var str = “We are the so-called "Vikings" from the north."无法解析，解决方法：
//方式1：反斜杠(\)转义 var str = "We are the so-called \"Vikings\" from the north."//方式2：改成" '' " 或 ' "" 'var str = "We are the so-called 'Vikings' from the north."字符串可以是对象
var x = "John"; //typeof->String var y = new String("John");// typeof->Object alert(x === y) // 结果为truealert(x === y) // 结果为 false，因为 x 是字符串，y 是对象补充说明： === 为绝对相等，数据类型与值都必须相等
字符串属性和方法
字符串属性:
属性 描述constructor 返回创建字符串属性的函数length 返回字符串的长度prototype 允许您向对象添加属性和方法常见字符串方法：（更多参见：JavaScript String 对象。）
方法 描述charAt() 返回指定索引位置的字符charCodeAt() 返回指定索引位置字符的 Unicode 值concat() 连接两个或多个字符串，返回连接后的字符串fromCharCode() 将 Unicode 转换为字符串indexOf() 返回字符串中检索指定字符第一次出现的位置lastIndexOf() 返回字符串中检索指定字符最后一次出现的位置localeCompare() 用本地特定的顺序来比较两个字符串match() 找到一个或多个正则表达式的匹配replace() 替换与正则表达式匹配的子串search() 检索与正则表达式相匹配的值slice() 提取字符串的片断，并在新的字符串中返回被提取的部分split() 把字符串分割为子字符串数组substr() 从起始索引号提取字符串中指定数目的字符 substring() 提取字符串中两个指定的索引号之间的字符toLocaleLowerCase() 根据主机的语言环境把字符串转换为小写，只有几种语言（如土耳其语）具有地方特有的大小写映射toLocaleUpperCase() 根据主机的语言环境把字符串转换为大写，只有几种语言（如土耳其语）具有地方特有的大小写映射toLowerCase() 把字符串转换为小写toString() 返回字符串对象值toUpperCase() 把字符串转换为大写trim() 移除字符串首尾空白valueOf() 返回某个字符串对象的原始值第八章 javascript语句
IF ELSE 语句:
if (condition1){ 当条件 1 为 true 时执行的代码}else if (condition2){ 当条件 2 为 true 时执行的代码}else{ 当条件 1 和 条件 2 都不为 true 时执行的代码}switch语句
switch(n){ case 1: 执行代码块 1 break; case 2: 执行代码块 2 break; default: 与 case 1 和 case 2 不同时执行的代码}for 循环
//方式1：for (语句 1; 语句 2; 语句 3){ 被执行的代码块}//方式2：for/invar person={fname:"John",lname:"Doe",age:25}; for (x in person){ txt=txt + person[x];}while循环
while (条件){ 需要执行的代码}//或do{ 需要执行的代码}while (条件);break continue 语句
break 语句可用于跳出循环。
continue 语句跳出循环后，会继续执行该循环之后的代码
//breakfor (i=0;i<10;i++){ if (i==3) break; x=x + "The number is " + i + "<br>";}//i==3后跳出循环体，即for循环不再执行//continuefor (i=0;i<10;i++){ if (i==3) continue; x=x + "The number is " + i + "<br>";}//跳过i==3,循环体继续执行实现label 标签跳出循环
label标签可是任意名称（非关键字保留字）
bk:for(var i=0;i<4;i++){ for(varj=0;j<4;j++){ if(i===1&&j===1)break bk; else console.log("i:"+i+"--j:"+j); } }运行结果：
1 i:0--j:02 i:0--j:13 i:0--j:24 i:0--j:35 i:1--j:0//成功跳出外层循环typeof操作符
用于检测变量的数据类型
typeof "John" // 返回 string typeof 3.14 // 返回 numbertypeof false // 返回 booleantypeof [1,2,3,4] // 返回 object，数组是一种特殊的对象类型typeof {name:'John', age:34} // 返回 objectNull
null是一个只有一个值的特殊类型。表示一个空对象引用，用 typeof 检测 null 返回是object。
（可以用null和undefined来清空对象）
Undefined
undefined 是一个没有设置值的变量。
typeof 一个没有值的变量会返回 undefined。
二者区别：
typeof undefined // undefinedtypeof null // objectnull === undefined // falsenull == undefined // true第九章 javascript类型转换
5 种不同的数据类型：
string number boolean object function
3 种对象类型：
Object Date Array
2 个不包含任何值的数据类型：
null undefined
typeof "John" // 返回 string typeof 3.14 // 返回 numbertypeof NaN // 返回 numbertypeof false // 返回 booleantypeof [1,2,3,4] // 返回 objecttypeof {name:'John', age:34} // 返回 objecttypeof new Date() // 返回 objecttypeof function () {} // 返回 functiontypeof myCar // 返回 undefined (如果 myCar 没有声明)typeof null // 返回 object/*NaN 的数据类型是 number数组(Array)的数据类型是 object日期(Date)的数据类型为 objectnull 的数据类型是 object未定义变量的数据类型为undefined*/自动转换类型
当 JavaScript 尝试操作一个 “错误” 的数据类型时，会自动转换为 “正确” 的数据类型。
5 + null // 返回 5 , null 转换为 0"5" + null // 返回"5null" null 转换为 "null""5" + 1 // 返回 "51" , 1 转换为 "1" "5" - 1 // 返回 4 , "5" 转换为 5当你尝试输出一个对象或一个变量时 JavaScript 会自动调用变量的 toString() 方法：
document.getElementById("demo").innerHTML = myVar;// if myVar = {name:"Fjohn"} // toString 转换为 "[object Object]"// if myVar = [1,2,3,4] // toString 转换为 "1,2,3,4"// if myVar = new Date() // toString 转换为 "Fri Jul 18 2014 09:08:55 GMT+0200"数字转换为字符串
//方式1 全局方法String()：可用于任何类型的数字，字母 ，变量，表达式String(x) String(123) String(100 + 23) //方式2 Number的toString()x.toString()(123).toString()(100 + 23).toString()将布尔值转换为字符串
//方式1：全局方法String()String(false) // 返回 "false"String(true) // 返回 "true"//方式2：Boolean的toString()false.toString() // 返回 "false"true.toString() // 返回 "true"将日期转换为字符串
//方式1：全局方法String()String(Date()) // 返回 Thu Jul 17 2014 15:38:19 GMT+0200 (W. Europe Daylight Time)//方式2：Date 方法 toString()Date().toString() // 返回 Thu Jul 17 2014 15:38:19 GMT+0200 (W. Europe Daylight Time)将字符串转换为数字
//方式1 ：全局方法 Number() Number("3.14") // 返回 3.14//方式2 ：parseFloat() 解析一个字符串，并返回一个浮点数。alert(typeof parseFloat("123.00"));//number//parseInt() 解析一个字符串，并返回一个整数。alert(typeof parseInt("123"));//number//方式3：Operator + 可用于将变量转换为数字：var y = "5"; //y为字符串var x = + y; //x为数字将布尔值转换为数字
//全局方法Number()Number(false) // 返回 0将日期转换为数字
//方式1：全局方法Number()Number(new Date()) // 返回 1404568027739//方式2：日期方法 getTime() new Date().getTime()// 返回 1404568027739第十章 javascript错误
try:
允许我们定义在执行时进行错误测试的代码块
catch：
语句允许我们定义当 try 代码块发生错误时，所执行的代码块。
trycatch 语句在javascript中是成对出现的
throw：
JavaScript 将抛出一个错误。（当错误发生时，当事情出问题时，JavaScript 引擎通常会停止，并生成一个错误消息）
function myFunction(){ try { var x=document.getElementById("demo").value; if(x=="") throw "值为空"; if(isNaN(x)) throw "不是数字"; if(x > 10) throw "太大"; if(x < 5) throw "太小"; } catch(err) { var y=document.getElementById("mess"); y.innerHTML="错误：" + err + "。"; }}- javascript基础篇 1
- JavaScript基础篇
- javascript学习基础篇
- Javascript基础篇
- JavaScript之基础篇
- 史上最全、JavaScript基础篇
- 史上最全、JavaScript基础篇
- Javascript基础篇小结
- Javascript 基础篇
- JavaScript变量 基础篇
- javascript基础篇
- javascript 面试题 基础篇
- javascript 学习笔记 --- 基础篇
- JavaScript的基础学习篇
- JavaScript基础篇，Object类型
- JavaScript程序设计基础篇:函数
- JavaScript程序设计基础篇:数组
- JavaScript表单之基础篇
- StringBuffer探索
- [bzoj1087][SCOI2005]互不侵犯King题解
- CUDA并行编程较有用的总结
- zookeeper的工作原理
- 摄影无忌
- Javascript 基础篇
- python基础内容重新理解之函数
- 深入Java之线程池
- 深度学习论文笔记
- TP框架中D方法与M方法的区别
- 2016 蓝桥杯省赛C语言B组 第六题 方格填数
- angular 2.0 关于新版angular-cli的应用
- poj 2488
- python 的日志logging模块学习
