JS-入门

主流浏览器

浏览器	内核
IE	trident
Chrome	webkit/blink
firefox	Gecko
Opera	presto
Safari	webkit

如何引入js

1. 页面内嵌js

<script type="text/javascript">
    // javascript代码
        document.write('hello world!!!')
</script>

type="text/javascript"告诉浏览器，里面写的是JavaScript代码，可以不写

2. 外部引入s文件

<script type="text/javascript" src="index.js"></script>

• src属性引入外部js文件

当两种方式一起使用时，外部的好使

js基本语法

变量

1. 变量声明

• 声明、赋值分解

var a;变量声明，向系统申请内存

a = 100;向变量赋值

• 单一var模式

var a = 10,
    b,
    c;

2. 命题规则

1.变量名必须以英文字母、_、$ 开头
2.变量名可以包括英文字母、_、$、数字
3.不可能用系统的关键字、保留字作为变量名

基本语法

数据类型

• 由值决定类型

1. 不可改变的原始值（栈数据）

Number String Boolean undefined null

数字类型
字符串类型 `var a="asd";`
布尔类型 `true false`
`undefined` 没有定义的
`null`：占位置，为空

2. 引用值（堆数据）

array Object function data RegExp

数组arr=[];
下标从0开始
arr.length：数组的长度

对象object
object={
   属性名 : 属性值,
    属性名 : 属性值
}
用" , "隔开
用" . " 取值

栈内存（stack）
特点：FILO（先进后出）
栈内存之间的赋值是拷贝值

堆内存（heap）
特点：FIFO（先进先出）
堆内存之间的赋值是拷贝地址

3. 区别

• 赋值形式不同

原始值：赋值时申请一块内存，将值存进去，给变量重新赋值时，再次申请一块内存，将值存进去，将变量与之前内存的联系切除，与新的内存连接起来

引用值：在栈内存中申请一块内存，是变量的内存，将值存入堆内存中的一块内存中，将它的地址赋给在栈内存中的变量，使得变量与值连接起来

js语句基本规则

1. 语句后面要用分号结束

函数function，if，for后面不用加分号

2. js语法错误会引发后续代码终止，但不会影响其它js代码块

错误分两种

1. 低级错误（语法解析错误）
   无法执行，报错
2. 逻辑错误（标准错误，情有可原）
   引发后续代码终止

3. 书写格式要规范，"= + / -"两边都应该有空格

运算符

运算操作符

• “+”

1. 数学运算、字符串连接
2. 任何数据类型加字符串都等于字符串

• “-”、"*"、"/"、"%"、"="、"()"

NaN（Not a Number）数字类型
Infinity：正无穷，1 / 0 数字类型

• 优先级"=“最弱，”()"优先级较高

• “++”、"–"、"+="、"-="、"/="、"*="、"%="

比较运算符

比较结果为布尔Boolean值

• “>”、"<"、"=="、">="、"<="、"!="

NaN != NaN

逻辑运算符

运算结果为真实的值

• “&&”、"||"、"!"

布尔值被认定为false的值
undefined、null、NaN、""、0、false

1. &&

先看第一个表达式转换为布尔值的结果，
如果为假，返回第一个表达式的值，
如果为真，那么它会看第二个表达式转换为布尔值的结果，
如果只有两个表达式，当看到第二个表达式，就会返回该表达式的值

• 短路语句
  表达式 && 语句;

var data = ...;
data && 要用到data的语句;

2. ||

先看第一个表达式转换为布尔值的结果，
如果为真，返回第一个表达式的值，
如果为假，那么它会看第二个表达式转换为布尔值的结果，
如果只有两个表达式，当看到第二个表达式，就会返回该表达式的值

3. ！

取反

	!!：将值转换为布尔值

条件语句

1. if、if else if

   if <–> && 转换

2. for( ; ; ){ }

3. while(){ }

4. do{ }while();

5. switch case

break：终止循环
不可写到循环外面

continue：终止本次循环，进行下一次循环

• 输入：

var n = parseInt(window.prompt('input')) ;

• 输出

document.write();//向页面内输出文档流
console.log();//在控制台输出

typeof：返回数据类型，用于区分数据类型

两种写法：typeof();/typeof 123;

有六个值：number string Boolean object undefined function

引用值返回object，null返回object，NaN返回number

typeof(undefined)返回字符串"undefined"

类型转换

1. 显式类型转换

• Number(mix) 转换为数字，看起来不是数字的，无法转换成数字，会返回NaN
• parseInt(string,radix) 把数字转换成整型，直接去小数点后的数字
  radix：基底，进制（2-36），以radix为基底将数转换成十进制以数字位开始，到非数字位截止，输出
• parseFloat(string) 把数字转换成浮点数 从数字位开始，到除了" . "以外的非数字位截止
• toString(radix) num = demo.toString();
  undefined、null不可用 radix：目标进制，将十进制的数转换成目标进制的数
• String(mix) 把数据转换成字符串
• Boolean() 把数据转换成布尔值
• toFixed()：科学计数法，保留几位有效数字，四舍五入
  num = demo.toFixed(3);保留三位有效数字

2. 隐式类型转换

• isNaN()
  Number(“abc”)–> NaN ：将数字用Number()转换，在跟NaN进行比较

• ++/-- +/- (一元正负)
  调用Number()函数

• “+”
  当 + 两边有一个是字符串时，会调用String()

• -*/%
  Number

• && || !
  Boolean

• < > <= >=

• == !=
  NaN != NaN

不发生类型转换

=== !== 绝对等于、绝对不等于

变量未定义只有一种情况不报错：

`console.log(typeof(a));` --> undefined

• typeof(undefined)返回字符串"undefined"

console.log(typeof(typeof(undefined))); --> string

类型转换练习题

-true --- -1
+undefined --- NaN 

(window.foo || (window.foo = 'bar'));
//window.foo --- 'bar' 

函数

高内聚，弱偶合

定义

1. 函数声明

function 函数名()
{

}

2. 函数表达式

• 命名函数表达式

var test = function abc() {

}

abc无用

函数名test.name = abc

• 匿名函数表达式 —> 函数表达式

var demo = function () {

}

函数名demo.name = demo

组成形式

1. 函数名称

2. 参数

形参和实参的个数可以不相等，不报错。
若实参多，多出的不用，若形参多，未赋值的为undefined

arguments：实参列表，类数组

实参长度：arguments.length
形参长度：test.length

• arguments和形参不是同一个变量，由系统内部的映射规则绑到一块

当形参和实参相等时，映射关系成立，实参少时，arguments为实参的个数，此时对多出的形参当作一个变量，对其改变值不改变arguments中的值

function sum(a,b){
    b = 3;
    console.log(arguments[1]);
}
sum(1,2);

输出：3

function sum(a,b){
    b = 2;
    console.log(arguments[1]);
}
sum(1);

输出：undefined

3. 返回值

return：终止函数，返回值

作用域

1. 作用域定义：变量（，变量作用域又称上下文）和函数生效（能被访问）的区域

2. 全局、局部变量
   函数里的是局部变量，外面的是全局变量
   函数内部可以使用函数外面的变量

3. 作用域的访问顺序