理解 javaScript
javaScript概述
什么是javaScript ?
- javaScript 是一种基于对象的脚本语言
1.2、运行环境
- 客户端 JavaScript 使用 浏览器 等工具执行
Chrome
FireFox
- 服务端 JavaScript 通过服务端的 JavaScript 引擎来运行 ( node.js )
1.3、开发工具
记事本、Eclipse 、 IDEA 等。
1.4、JavaScript 的组成
- JavaScript = ECMAScript + BOM + DOM
1.5、客户端JavaScript的使用方式
- 直接在 页面上 嵌入 JavaScript 代码
<html>
<head>
<meta charset="UTF-8" >
<title>标题</title>
<script type="text/javascript">
// 这里书写 JavaScript 代码
</script>
</head>
<body></body>
</html>
- 链接外部 JavaScript 文件
假设存在 hello.js 和 hello.html 在同一个目录中，则可以在 hello.html 的 head 区域中使用:
<script type="text/javascript" src="hello.js"></script>
2、基础语法(核心语法)
【 JavaScript 跟 Java 语言一样，英文字母严格区分大小写】
2.1、变量和常量
-
变量使用 var 关键字声明，比如 var x = 100 ;
-
常量使用 const 关键字声明，比如 const PI = 3.14 ;
var x = 100 ;
console.log( x ); // 在浏览器的终端(Console)中输出
const PI = 3.14 ;
console.log( x );
变量的特点:
来者不拒，给啥是啥
2.2、数据类型
- 原生数据类型
number 表示数字类型，包括 整数、浮点数
boolean 表示逻辑类型，其取值只有 true 和 false
undefined 表示未定义的类型，如果仅仅声明了一个变量但是没有赋值，此时其取值就是 undefined ，这个值的类型就是 undefined 类型
null 类型，只有一个取值 null
string 表示字符串类型，在 JavaScript 中不区分 字符 和 字符串，因此 使用 "" 或 '' 都可以表示字符串
注意:
当 一个变量取值为 undefined 、null 、0 、-0 、"" 、’’ 、false 时可以表示 false ; 否则就表示 true 。
- 引用类型
数组类型
对象类型
- typeof 运算符 ( typeof() 函数 )
用来获取 变量中存储的 数值的 简单类型。
因为 JavaScript 是弱类型语言，因此使用 typeof 运算符 或 typeof() 函数求 引用类型变量值 的类型时是不准确的。
弱类型语言专家建议使用 “鸭子模型” 来识别一个引用类型的具体类型。
2.3、运算符
参看 书上 125 页表格。
== 和 ===
== 仅仅用于比较两个数值是否相等，比如:
'100' == 100 返回 true
'100' == 99 返回 false
=== 需要比较 两个 数值 和 类型，比如
'100' === 100 返回 fasle
'100' === "100" 返回 true
'100' === ‘100’ 返回 true
100 === 100.0 返回 true
!= 和 !==
!= 比较两个数值是否不相等，如果不相等就返回true
'100' != 100 返回 false
'100' != 99 返回 true
!== 用于比较两个 数值 和 类型，两者只要有一个不相同就返回 true
'100' !== 100 返回 true (因为类型不一样)
'100' !== '1000' 返回 true (因为数值不一样)
1000 !== 1000 返回 false (因为类型一样、数值也一样)
2.4、流程控制
- 分支语句
if .... else if .... else
switch .... case ... default ....
- 循环语句
for
while
do .... while
break
continue
- for … in 循环
处理数组:
var a = new Array( "张三丰" , "张翠山" , "殷素素" , "张无忌" , "赵敏" );
for( var i = 0 ; i < a.length ; i++ ) {
var e = a[ i ] ;
console.log( i , e ) ;
}
for( var i in a ) {
var e = a[ i ] ;
console.log( i , e ) ;
}
// JSON : JavaScript Object Notation
var map = { "id" : 1001 , "name" : "王姨" , "gender" : "女" };
for( var key in map ) {
var value = map[ key ] ; // 相当于 Java 语言中 根据 key 取出 value ( map.get( key ) )
console.log( key , value );
}
2.5、异常处理
Error 类型 表示 异常，其中有两个常用属性:
-
name 表示异常类型
-
message 表示异常提示信息
异常处理语句
- 捕获异常 try … catch … finally
try {
} catch ( e ) {
} finally {
}
- 抛出异常
throw new Error( "message" );
常见的异常类型:
-
ReferenceError
-
TypeError
-
RangeError
-
EvalError
使用 eval 函数 可以求一个表达式的值，比如 eval( "1+250" ) 的结果就是 251
尝试执行 eval( "haha + heihei + hehe + enen" )
- SyntaxError
3、自定义函数
3.1、声明方式
function 函数名称( 参数列表 ) {
函数体
}
function hello( name ) {
console.log( "hello , " + name ) ;
}
3.2、调用方式
- 直接使用函数名调用(最常见的)
函数名称( 实参列表 ) ;
hello( "zhangsanfeng" ) ;
-
使用 call 方式调用
-
使用 apply 方式调用
3.3、参数传递
在调用函数时，可以向函数传递任意多个参数，这些参数(实参)被存放在一个名称是 arguments 的数组中，这个 数组只能在函数内部使用
3.4、返回值
如果一个函数需要返回数据，则直接在函数内部使用 return 语句即可，不需要声明返回类型
function add( a , b ) {
var c = a + b ;
return c ;
}
对于没有返回值的函数，如果使用变量接受其返回值，则该变量存储的值是 undefined
function show(){
}
var x = show(); // x 此时的取值是 undefined
如果期望某个方法立即结束，可以使用 return 语句
function div( a , b ){
if( b === 0 ) {
return ; // 仅仅让方法立即结束，不返回任何数据
}
var c = a / b ;
return c ; // 返回变量 c 中存储的数据
}
3.5、匿名函数
如果将 函数 整体作为一个 值 赋值给一个变量，则这个变量就表示这个函数，使用这个变量的名称即可调用这个函数。
var x = function add( a , b , c ) {
var d = a + b + c ;
return d ;
} ;
var r = x( 100 , 200 , 300 );
console.log( r );
此时，原来在 function 之后的函数名将不能再使用
对于上面的 add 函数来说，如果使用:
var y = add( 100 , 200 , 300 ) ;
形式调用，将会触发 ReferenceError 异常
所以，可以在 等号 之后 将 函数名省略，从而让 函数 成为 匿名函数
var x = function ( a , b , c ) {
var d = a + b + c ;
return d ;
} ;
var r = x( 1 , 2 , 3 ); // 可以执行 前面定义的函数
var haha = x ;
haha( 5 , 6 , 7 ); // 可以执行 前面定义的函数
x = null ;
x( 4 , 5 , 6 ) ; // 此时无法执行 前面定义的函数
3.6、立即执行的函数
一个函数被声明后就立即执行
使用形式:
( 函数 ) ( 实参列表 );
第一对 圆括号 内是一个 函数的引用 或 函数的声明
第二对 圆括号 内是执行该函数时传入的实际参数
比如:
var x = function( a , b ) {
return a + b ;
}
var r = ( x ) ( 1 , 2 ) ;
可以将以上代码简化为:
(
function( a , b ) {
return a + b ;
}
) ( 1 , 2 ) ;
4、“面向对象编程”
4.1、声明 “类” ( 相当于 Java 语言中的 class )
在 JavaScript 中不能直接使用 class 关键字 声明 “类”。
因此，需要借助于 function 关键字来声明 “类” 。
这里约定:
- 普通的函数名 第一个单词全部小写，如果有多个单词则从第二个单词开始首字母大写
function add( a , b ){
}
function showName(){
}
- 对于当作 “类” 来使用的 函数，应该将 所有单词首字母大写 ( 就像 Java 语言中 类的命名规范一样 )
function Student(){
}
声明一个 “类” 时，可以借助于 函数的参数 向 “类” 的构造方法传递参数
// Human 相当于 "类" 名
// Human( id , name , gender ) 相当于 Human "类" 的构造方法
// id 、name 、gender 就是 Human "类" 的构造方法 的形参
function Human( id , name , gender ) {
// 当 执行到 this.id 时 就会为 当前实例添加一个名称是 id 的属性( 它用来接受来自参数的值 )
this.id = id ;
this.name = name ;
this.gender = gender ;
}
如果创建一个 “类” 的实例并为其构造方法传入相应的参数，这些参数值应该属于当前被创建的实例
所以在 "类"内部可以使用 this 关键字 来引用当前的实例，比如 this.id = id ;
public class Human {
private Integer humanId ; // 字段(Field)
private String name ;
private char gender ;
public Human( Integer id , String name , char gender ) {
this.id = id ;
this.name = name ;
this.gender = gender ;
}
// 方法 : getId() ------> 去除get 和 () 部分 ----> Id ---> 将首字母变小写 ---> id ( 属性 ( property ) )
public Integer getId(){
return this.humanId ;
}
public void setId( Integer id ) {
this.humanId = id ;
}
// 此处省略 name 和 gender 的 getter 和 setter
}
4.2、创建 “类” 的实例 ( 相当于 Java 语言中的对象(实例: instance ) )
以之前的 Student “类” 为例，创建 Student “类” 的实例，使用以下语句:
var s = new Student();
以之前的 Human “类” 为例，创建 Human “类” 的实例，使用以下语句:
var h = new Human( 1001 , "李睿" , "女" );
4.3、访问 实例(instance) 中的 属性 和 方法
- 获取
console.log( h.id ) ;
console.log( h.name );
console.log( h.gender ) ;
扫一扫
766
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
