前端学习—— JS基础

1 JavaScript 简介

JavaScript 是运行在客户端的脚本语言。脚本语言是指不需要编译，边翻译边执行。

1.1 作用

• 表单动态校验（密码强度检测）
• 网页特效
• 服务端开发（Node.js）
• 桌面程序
• APP
• 控制硬件-物联网Ruff
• 游戏开发

1.2 JS 的组成

JavaScript 分为JavaScript 语法、页面文档对象模型（DOM）、浏览器对象模型（BOM）

1.3 JS的书写方式

1）行内式 JS 

<!-- 行内式的JS 直接写到元素内部 -->
<input type="button" value="唐伯虎" onclick="alert('秋香姐')">

• 可以将少量的JS代码写在HTML标签的事件属性中，以on 为开头，如：onclick
• JS 中推荐使用单引号
• 特殊情况下使用

2）内嵌式 JS 

<!-- 内嵌式的JS 类似CSS的style一样 -->
    <script>
        alert(
            '沙漠骆驼'
        )
    </script>

• 可以将多行 JS 代码写到<script>标签中
• 内嵌JS 是学习时常用到的方式

3）外部JS 文件

<script src="myscript.js"></script>

• 利于HTML代码结构化，把大段的JS代码独立到HTML页面之外
• 引用JS文件的script标签中间不可以写代码
• 适用于JS代码量比较大的情况

1.4 JS 注释

1）单行注释 //

快捷键 ctrl + /

2）多行注释/**/

快捷键 shift  + alt + a 。也可以在VS中修改，修改成 ctrl + shift + / 。已修改~

1.5 JS 输入输出语句

1. alert(msg)：浏览器弹出警示框
2. console.log(msg)：浏览器控制台打印输出信息
3. prompt(info)：浏览器弹出输入框，用户可以输入

2 变量

2.1 变量使用

2.1.1 变量的初始化

//变量的声明
var age;

//变量赋值
age = 19;

//变量的声明
var myname = '维也纳'

2.1.2 变量的使用

var myname = prompt('请输入您的姓名');
alert(myname);

2.2 变量语法扩展

2.2.1 更新变量

变量被重新赋值后，原有值会被覆盖，变量值以最后一次赋值为准。

2.2.2 同时声明多个变量

声明多个变量时，中间用逗号隔开，最后以分号结尾。JS在声明变量的时候不区分数据类型，所有变量都是var。

var age = 19,
    address = '火影村'，
    sex = '女';

2.2.3 声明变量的特殊情况

• 变量只声明，未定义，结果是undefined；
• 变量不声明，不定义，直接使用变量，会报错；
• 不声明变量，直接赋值，可以使用，但是不提倡。

2.3 变量命名规范

和其他高级语言的命名规范相似。

• 由字母、数字、下划线_和美元符号$组成
• 严格区分大小写
• 不能以数字开头，下划线和美元符号都可以开头
• 不能是关键字、保留字。如：var、for、while
• 变量名必须有意义
• 遵守驼峰命名法，首字母小写，后面单词的首字母需大写。myFirstName
• 推荐翻译网站：有道、爱词霸

注：name尽量不使用，有些浏览器默认name有含义的，所以尽量不使用。

3 数据类型

JS是一种弱类型或者说动态语言，不用提前声明变量的类型，在程序运行的过程中，类型会根据变量值自动确定。JS拥有动态类型，即在运行过程中，相同的变量可以用作不同的类型。

3.1 简单数据类型（基本数据类型）

数据类型	说明	默认值
Number	数字型，包括整型值和浮点值	0
Boolean	布尔值	false
String	字符串型，字符串都带引号。如“张三”	“”
Undefined	变量只声明，未赋值时，变量为Undefined	Undefined
Null	空值	null

3.1.1 数字型 Number

1）进制

常见的进制有二进制、八进制、十进制、十六进制。八进制以0开头，十六进制以0x开头。

// 八进制书写方法 对应十进制的10
var num1 = 012;

// 十六进制书写方法 对应十进制的10
var num2 = 0xa；

2）数字的范围

alert(Number.MAX_VALUE);    //查询数字型的最大值
alert(Number.MIN_VALUE);    //查询数字型的最小值

3）特殊值

• Infinity        无穷大
• -Infinity       无穷小
• NAN           Not a number ，代表一个非数值

4）isNaN()

判断内容是否为非数字，如果是数字，返回false；如果不是数字，返回true。

3.1.2 字符串型 String

字符串可以是引号中的任意文本，语法为双引号“”和单引号''。提倡使用单引号''。

1）引号的嵌套

JS中如果要用到引号的嵌套，可以使用外双内单，或者外单内双。

2）字符串转义字符

转义字符以\开头，和其他高级语言一致。

转义符	解释说明
\n	换行符， n 是 newline 的意思
\\	斜杠 \
\'	单引号 '
\"	双引号 "
\t	缩进tab
\b	空格，b 是 blank 的意思

3）字符串长度

使用 length属性 获取整个字符串的长度。例如“str.length”

4）字符串拼接

多个字符串之间可以使用+进行拼接。字符串+任何类型=拼接后的新字符串

加号口诀：数值相加，字符相连。

var age = 24;
console.log('维也纳' + age + '岁');

//可以使用引引加加的方法加快书写速度
//    console.log('维也纳18岁');
//    console.log('维也纳'++'岁');
//    console.log('维也纳' + age + '岁');

3.1.3 布尔型 boolean

布尔型就两个值：true 和 false。当布尔型和数字相加时，true的值为1，false的值为0。

3.1.4 Undefined 和 null

• 变量声明未赋值，因为JS的变量类型是运行时才确定的，所以未赋值时，变量为undefined
• undefined / null和字符相加，可以拼接成新字符，变成'undefinedstr’和‘nullstr’
• undefined和数字相加，会显示NaN
• null和数字相加，会显示1

3.2 获取变量数据类型

3.2.1 typeof

typeof 获取变量的数据类型。使用时后面直接跟变量。例如：typeof age

注意：prompt 取到的值都是字符型的

3.2.2 通过控制台的字体颜色

不同的数据类型，控制台输出时，颜色不一样。字符串是黑色的，数字型是蓝色的。

3.3 字面量

字面量是源代码中一个固定值的表示法，通俗来说，就是字面量表示如何表达这个值。

• 数字字面量：8,9,10
• 字符串字面量：'黑马程序媛'、'前端'
• 布尔字面量：true、false

3.4 数据类型的转换

3.4.1 转换为字符串型

1. toString()。用法：变量.toString()
2. String()。用法：String(变量)
3. 加号拼接字符串。和字符串拼接的结果都是字符串。也成为隐式转换。

3.4.2 转换为数字型

1）parseInt(变量)函数。

将String类型转换成整数数值型。

对于小数会自动取整，省略小数部分；对于有单位的内容，会自动去掉单位，例如：parseInt(120px)，结果为120。

2）parseFloat(变量)函数。

将String类型转换成浮点数数值型。对于浮点数，可以取到浮点数；对于有单位的内容，可以去掉单位。

3）Number(变量)

强制转换函数。将String类型转换为数值型。

4）js隐式转换( - * / )。

利用算术运算隐式转换为数值型。例如：'12'-0、'123'-'120'

3.4.3 转换为布尔型

Boolean()函数。

• 代表空、否定的值会被转换成false，如：''、0、NaN、null、undefined
• 其余会被转换成true

4 运算符

4.1 算数运算符

• 加        +
• 减        -
• 乘        *
• 除        /
• 取余数        %

注：浮点数进行算数运算时，可能会出错，要小心！

4.2 递增/递减运算符

++age;        //先加1，后返回值

age++;        // 先使用，后加1 

4.3 比较运算符

>        <        >=        <=        !==        ==        ===(全等)        !==(不全等)

注意：

• == 等号，只判断两侧的数值是否相等，会默认转换数字类型，例如18 == '18' ，结果是true
• === 全等，要求两侧数值和数据类型完全一致。例如18 == '18' ，结果是false

4.4 逻辑运算符

&&(与)        || (或)         ！(非) 

• && 两侧为真，则为真
• || 一侧为真，则为真；两侧为假，则为假
• ！ 取反

逻辑运算符具有短路效应，即逻辑中断。

4.4.1 表达式1 && 表达式2

• 表达式1的值为真，则返回表达式2
• 表达式1的值为假，则返回表达式1

4.4.2 表达式1 || 表达式2

• 表达式1 为真，则返回表达式1
• 表达式1 为假，则返回表达式2

4.5 赋值运算符

=        +=        -=        *=        /=        %=

4.6 运算符优先级

5 分支结构

根据不同的条件，执行不同的路径代码，从而得到不同的结果。

5.1 if 语句

5.1.1 语法结构

1）单分支结构

if(条件表达式){
    语句；
    //执行语句；
}

2）双分支结构

if(条件表达式){
    语句1；
    //执行语句1；
} else {
    语句2;
     //执行语句2；
}

3）多分支语句

if(条件表达式1){
    语句1；
} else if(条件表达式2) {
    语句2;
} else if(条件表达式3) {
    语句3;
} else if(条件表达式4) {
    语句4;
} else {
    //上述语句均不成立时，执行的语句
    语句5；
}

5.2  三元表达式

由三元运算符组成的式子，我们称为三元表达式。

语法：条件表达式?表达式1：表达式2

• 如果条件表达式的值为1，返回表达式1的值
• 如果条件表达式的值为0，返回表达式2的值

5.3 switch 语句

switch(表达式){
    case value1:
        语句1；
        break;
    case value2:
        语句2；
        break;
    case value3:
        语句3；
        break;
    case value4:
        语句4；
        break;
    case value5:
        语句5；
        break;
    default:
        最后的语句；
}

注意

• 经常把表达式写作一个变量
• 表达式和case里的value匹配时，必须是全等于

5.4 switch和if else if语句的区别 

1. 一般情况下，两个语句可以相互替换。
2. switch通常用于处理case比较确定的情况，而if...else...语句更加灵活，常用语范围判断。
3. switch效率更高
4. 当分支较少时，if..else 的效率比 switch 语句的效率高；分支比较多时，switch的执行效率更高，结构更清晰

6 循环结构

6.1 for 循环

for (初始化变量;条件表达式;操作表达式){
    循环体;
}

• 初始化变量就是用var声明的一个普通变量，用作计数器；
• 条件表达式决定终止条件；
• 操作表达式是每次循环最后执行的代码，经常用于更新计数器变量，递增或递减。

应用：

一行打印5个星星，可以用字符串追加的方式。

6.2 双层 for 循环

for(外层初始化变量; 外层条件表达式; 外层操作表达式){
    for(里层初始化变量; 里层条件表达式;里层操作表达式){
        循环体;
    }
}

应用：

打印5行，每行5个星星。

6.3 while循环

while(条件表达式){
    循环体；
    计数器更新;
}

适合条件判断比较复杂的情况。

6.4 do...while 循环

do {
    循环语句；
    计数器更新;
} while(条件表达式)

do...while 循环至少执行一次。

6.5 退出循环

6.5.1 continue

跳出本次循环，继续下一次循环；

6.5.2 break

退出整个循环；

6.6 命名规范

6.6.1 标识符

• 变量、函数的命名必须有意义
• 变量的名称一般用名词
• 函数的名称一般用动词

6.6.2 操作符

• 操作符的左右两侧保留空格

6.6.3 单行注释

• 当行注释后面保留一个空格再写注释

7 数组

7.1 创建数组

7.1.1 利用new 创建数组

var 数组名 = new Array();    // 创建一个新的空数组

7.1.2 利用数组字面量创建数组

var arr = [];    // 创建了一个空的数组

• 数组里面可以放任意的数据类型；
• 数组里面的多个数据用逗号分隔；

7.2 数组元素

1. 数组索引：用来访问数组元素的序号，数组元素下标从0开始；数组下标越界时，会显示undefined。
2. 获取数组元素格式：数组名[索引号]。
3. 遍历数组：用循环的方式遍历整个数组。
4. 数组长度：数组名.length 动态检测数组长度。

7.3 新增元素

7.3.1 改变 length 长度

通过直接改变length可以增大数组长度，但是扩大部分的数组元素为undefined；

7.3.2 新增数组元素

var arr = ['red','green','blue'];
arr[3] = 'pink';    // 追加数组元素
arr[0] = 'yellow';    // 替换原来的元素

// 不要直接个数组名赋值！数组名不等于第一个元素！
arr = '有点意思';    // 重新定义变量arr为字符串。

7.4 冒泡排序

var arr = [...]
// 外层循环管趟数，5个数的数组，有4个数需要一趟趟的比较
for (var i = 0; i < arr.length; i++) {

    // 里层循环管比较次数，第0个数，比较4次；第1个数，比较3次，第i个数，比较arr.length-i-1次；
    for (var j = 0; j < arr.length - i; j++) {
        // 交换语句；
        // 根据由大到小排列，或由小到达排列决定；
    }    
}

8 函数

8.1 函数声明

function 函数名(形参1,形参2,...){
    // 函数体；
}    

//调用函数
函数名(实参1，实参2);

• function 是声明函数的关键字
• 函数名一般是动词
• 调用函数时，一定要加()。

8.2 函数参数

8.2.1 函数实参形参不匹配问题

1. 若实参个数和形参个数相等，正常输出结果；
2. 若实参个数多于形参个数，会取到形参的个数，多于的实参舍弃；
3. 若实参个数少于形参个数，多于的形参定义为 undefined ，函数结果为NaN。

8.3 函数返回值 return

1. 函数只是实现某种功能，最终用return 语句，将返回值返回给函数调用者。
2. return 具有终止函数的作用，之后的语句不会被执行。
3. return 只能返回一个值，若写多个值，会返回最后一个值。
4. 若想返回多个值，可以把多个值写成数组的形式。
5. 若函数有return，返回return后面的值；若函数没有return，则返回undefined。

8.4 arguments

当我们不确定有多少参数传递的时候，可以用arguments来获取。argument是函数的一个内置对象，存储了传递的所有实参。

argument展示形式是一个伪数组，具有如下特点：

• 具有length 属性；
• 按照索引的方式进行存储的；
• 没有真正数组的一些方法，如：pop(),push()等

8.5 函数的两种声明方式

8.5.1 利用关键字 function 自定义函数

也称为命名函数。

8.5.2 利用函数表达式声明函数

var 变量名 = function(){};

// 例如：
var fun = function(){
    console.log('我是函数表达式');
}

// 调用
fun()；

也称为匿名函数。

• 变量名不是函数名；
• 函数表达式跟声明变量差不多，只不多变量里存的是函数；
• 函数表达式也可以传递参数；

9 作用域

作用域就是变量在某个范围内起作用和效果。目的：提高程序的可靠性，减少命名冲突。

9.1 JS 作用域(es6之前)

1. 全局作用域：整个script标签内，或者一个单独的JS 文件
2. 局部作用域：函数内部

9.2 变量作用域

1. 全局变量：在全局作用域下的变量，全局都可以使用；在函数内部，没有声明直接赋值的变量，也是全局变量。
2. 局部变量：在局部作用域下的变量，函数内部的变量就是局部变量；函数的形参也是局部变量

从执行效率来看

1. 全局变量：只有浏览器关闭的时候才会销毁，比较占内存资源；
2. 局部变量：程序执行完毕就会销毁；

9.3 作用域链

内部函数访问外部函数的变量，采取的是练市查找的方式来决定取哪个值，这种结构，我们称为作用域链。可以看作“就近原则”。

10 预解析

JS解释器运行JS代码分为两步：预解析和代码执行。预解析分为变量预解析（变量提升）和函数预解析（函数提升）。

1. 预解析：JS解释器会把所有的变量声明 var 和函数声明 function 提升到当前作用域的最前面。
2. 代码执行：按照代码书写顺序，从上往下执行。

10.1 变量提升

把所有的变量声明提升到当前的作用域的最前面。不提升赋值操作。

console.log(num);    // 显示 undefined 
var num = 10;

// 相当于执行了以下代码
var num;
console.log(num);
num = 10;

10.2 函数提升

把所有的通过function关键字声明的函数声明提升到当前作用域的最前面，不调用函数。

10.3 预解析案例

f1();
console.log(c);
console.log(b);
console.log(a);
function f1(){
    var a = b = c = 9;    // 相当于 var a = 9; b = 9; c = 9;所以b,c为全局变量
    console.log(a);
    console.log(b);
    console.log(c);
}

// 相当于以下代码
function f1(){
    var a;
    a = b = c = 9;    
    console.log(a);    // 9
    console.log(b);    // 9
    console.log(c);    // 9
}
f1();
console.log(c);    // 9
console.log(b);    // 9
console.log(a);    // 报错，a没有被定义

11 JS 对象

对象就是一个具体的事物。对象是一组无需的相关属性和方法的集合。

11.1 创建对象 Object

11.1.1 利用字面量创建对象

对象的字面量是{}，包含事物的属性和方法。

var obj = {
    uname: '秋思维',
    age: '3',
    beLove: function(){
        console.log('又长大一岁啦~');
    }
}

• 创建对象时里面的属性或者方法，采用键值对的形式，key: value
• 多个属性或方法中间用逗号隔开
• 方法的值是一个匿名函数

11.1.2 利用new Object 创建对象

var obj = new Object();    //创建一个空对象
obj.uname = '秋思维';
obj.age = 3;
obj.beLove = function() {
    console.log('长大一岁啦~');
}

• 利用赋值的方法定义对象的属性和方法
• 每个属性或方法之间用分号结束

11.1.3 利用构造函数创建对象

前面两种创建对象的方式，一次只能创建一个对象。将对象里相同的属性和方法抽象出来，封装成构造函数。

function 函数名() {
    this.属性 = 值；
    this.方法 = function() {}
}

// 调用构造函数
var 变量名 = new 构造函数名();

• 构造函数的函数名首字母要大写。
• 构造函数不需要return就可以返回结果。
• 调用构造函数，必须使用new。
• 利用构造函数创建对象的过程，也称为对象的实例化。

11.2 使用对象

11.2.1 调用属性

1. 对象名.属性名
2. 对象名[ '属性名' ]

11.2.2 调用方法

1. 对象名.方法名()。千万别忘记添加()。

11.2.3 调用构造函数

调用构造函数必须使用new关键字。new在执行时，会做四件事：

1. 在内存中创建一个新的空对象；
2. 让this 指向这个新对象；
3. 执行构造函数里的代码，给新对象添加属性和方法；
4. 返回新对象。

11.3 遍历对象

for...in语句用来对数组或者对象的属性进行循环操作。

for( 变量 in 对象){

}

// 例如
for (var k in obj){
    console.log(k);    //输出对象的所有属性名
    console.log(obj[k]);    // obj[k]得到的是属性值，k是不加引号的
}

• for...in 语句里的变量，习惯用 k 或 key

11 内置对象

JS 中对象分为3种：自定义对象、内置对象和浏览器对象。

内置对象：JS语言自带的一些对象，提供了一些常用的或是最基本而必要的功能。

11.1 查文档

可以通过MDN/W3C来查询。

11.1.1 如何学习对象中的方法

1. 查阅该方法的功能
2. 查看里面参数的意义和类型
3. 查看返回值的意义和类型
4. 通过demo进行测试

11.2 Math对象

Math 不是一个构造对象，不需要new，可以直接使用属性和方法。

1）Math.max()最大值

2）Math.min() 最小值

3）Math.abs() 绝对值

Math.abs('-1');        // 1 隐式转换，会把字符串型的-1 转换成数字型

4）取整

• Math.floor() 向下取整，直接舍弃小数部分，往小取。
• Math.ceil() 向上取整，往大取。ceil 天花板的意思。
• Math.round() 四舍五入函数。其他数字都会四舍五入，但是.5  会往大取

Math.round(1.5);    // 2
Math.round(-1.5);    // -1

5）随机数方法 random()

返回一个随机小数x，0<=x<1。

11.3 日期对象

Date() 是一个日期对象，是一个构造函数，必须使用new 来调用创建我们的日期对象。

11.3.1 构造函数的参数

1. 无参数：返回构造实例化时刻的时间。
2. 数字型：new Date(2022,5,19); 这种返回的月份比实际月份小1；
3. 日期格式字符串：new Date('2022-10-27 13:58:00');

11.3.2 常用方法

1. getFullYear()：返回当前日期的年；
2. getMonth()：返回当前日期的月份，月份是0-11，所以要加1才是实际月份；
3. getDate()：返回当前日期，几号；
4. getDay()：返回当前日期是星期几。周日返回的是0。
5. getHours()：返回当前时间的小时；
6. getMinutes()：返回当前时间的分钟；
7. getSeconds()：返回当前时间的秒；

11.3.3 获取总的毫秒数（时间戳）

1. valueof()：获取总的毫秒数，距离1970年1月1号过了多少毫秒。
2. getTime()：获取总的毫秒数，距离1970年1月1号过了多少毫秒。
3. var date = +new Date(); 返回总的毫秒数。
4. Date.now()：获取总的毫秒数。H5新增的。

应用1-倒计时

1. 先把两个时间转换成时间戳的形式；
2. 用大的时间的时间戳 - 小的时间的时间戳，得到中间的时间戳，并转换成秒；
3. 将剩余时间的秒数转换成天、时、分、秒；

// 计算天数
day = parseInt(总秒数/60/60/24);
// 数字小于10时，前面加0
day = day < 10 ? '0' + day : day;

// 计算小时
hour = parseInt(总秒数/60/60%24);
hour = hour < 10 ? '0' + hour : hour;

// 计算分钟数
minutes = parseInt(总秒数/60%60);
minutes = minutes < 10 ? '0' + minutes : minutes;

// 计算秒数
seconds = parseInt(总秒数%60);
seconds = seconds < 10 ? '0' + seconds : seconds;

11.4 数组对象

11.4.1  关键字new 创建数组

var arr1 = new Array();    // 创建了一个空的数组
var arr2 = new Array(2);    // 这个2表示数组长度，里面有2个空的数组元素
var arr3 = new Array(2,3);    // 等价于[2,3]，里面两个元素，一个2，一个3

• 只有一个参数时，表示数组的长度；

11.4.2 检测是否为数组

1. instanceof 运算符。
2. Array.isArray(参数)。 H5新增的方法

var arr = new Array();
var flag = arr instanceof Array;    // true
var flag = Array.isArray(arr);    // true

11.4.3 添加删除数组元素的方法

1. push(参数1,参数2,...)。在数组的末尾添加一个或多个元素。
   1. push()的参数直接写数组元素即可。例如：push(4,5);
   2. push()的返回值为数组添加元素后的长度；
   3. 原数组也会发生变化。
2. unshift(参数1,参数2,...)。在数组的开头添加一个或多个元素。
   1. unshift()的参数直接写想添加的数组元素即可。
   2. unshift()的返回值为添加后新数组的长度；
   3. 原数组会发生变化。
3. pop()。删除数组最后一个元素。
   1. 一次只能删除一个元素；
   2. pop()没有参数；
   3. 返回值为删除的那个元素；
   4. 原数组会发生变化。
4. shift()。删除数组的第一个元素。
   1. 一次只能删除一个元素；
   2. shift()没有参数；
   3. 返回值为删除的那个元素；
   4. 原数组会发生变化。

11.4.4 翻转数组

1. reverse()：翻转数组。
2. sort()：数组排序。

var arr1 = [13,2,43,54,63,2,34,65];
arr1.sort(
    function(a,b){
        return a-b;    //升序的顺序排列，从小到大
        // return b-a;    //降序的顺序排列，从大到小
    }
);

11.4.5 数组索引方法

1. indexOf(数组元素)：返回数组元素索引号
   1. 从前往后找，只返回第一个满足条件的索引号；
   2. 找不到元素时，返回 -1；
2. lastIndexOf(数组元素)：返回数组元素的索引号
   1. 从后往前找，只返回第一个满足条件的索引号；
   2. 找不到元素时，返回 -1；
3. 应用：数组去重案例
   1. 遍历所有旧数组，把旧数组中的元素在新数组中找；
   2. 找到了就不存，没找到indexOf()返回值为-1，就存入新数组。

11.4.6 数组转换成字符串

1. toString()。
   1. 将数组转换为字符串，默认是逗号分隔；
2. join(分隔符)。
   1. 数组转换为字符串，可以指定分隔符。

11.4.7 其他常用方法

1. 变量1.concat(变量2,变量3,变量4,...)
   1. 连接两个或多个数组；
   2. 返回值为一个新数组，不影响原数组；
2. 数组名.slice(start,end)
   1. 可以没有参数，代表截取数组所有元素；
   2. 如果只给一个参数，表示截取的开始值；
   3. (start,end)是一个前闭后开区间，包括开始值，不包括结束值；
   4. 数组元素从最后一个倒着数，索引依次为-1，-2，...；
3. 数组名.splice(开始索引号，删除元素个数，插入元素)
   1. 返回值由被删除的元素组成的一个数组。如果只删除了一个元素，则返回只包含一个元素的数组。如果没有删除元素，则返回空数组。
   2. 如果只有参数，表示从那个索引号开始，删除那个元素及之后所有元素；

11.5 字符串对象

基本包装类型：就是把简单数据类型包装成复杂数据类型，这样基本数据类型就有了属性和方法。

11.5.1 字符串具有不可变性

更改字符串时，会新开辟一个内存空间用于存储。

11.5.2 常用方法

1. indexOf( '要查找的字符'，[ 起始的位置 ])。
   1. 默认是从起始位置查找指定的字符，返回索引号；
2. charAt(index)
   1. 根据位置返回字符；
3. charCodeAt(index)
   1. 根据位置返回相应索引号的字符ASCII值；
   2. 应用：可以判断用户按下了哪个键；
4. str[index]
   1. H5 新增的方法；
   2. 获取指定位置的字符。
5. 对象[属性名]
   1. 可以判断对象是否有该属性；
   2. 应用：判断字符串中每个字符出现的次数
      1. 利用charAt()遍历整个字符串；
      2. 新建一个空对象，如果对象中没有这个属性，则设置对象.字符为1；
      3. 如果对象中有这个属性，则设置该属性+1。
6. concat(str1,str2,str3,...)
   1. 拼接字符串，相当于+
7. substr(start,length) 
   1. 截取字符串中某几个字符
   2. 第一个参数表示从第几个开始；第二个参数表示取几个字符。
8. replace('被替换的字符','替换为的字符')
   1. 替换时只会替换第一个字符，一次只能替换一个字符
9. split('分隔符')
   1. 把字符转换为数组；
   2. 和join()是相对应的。

12 数据类型

数据类型分为简单数据类型和复杂数据类型。

• 简单数据类型：又称为基本数据类型或值类型。在存储变量时存储的是值本身，string,number,boolean,undefined,null。注意null是一个对象。
• 复杂数据类型：又叫做引用类型。存储时，变量中存储的仅仅是地址；通过new关键字创建的对象，如：Object，Array，Date

12.1 堆和栈

• 栈：简单数据类型放在栈里。里面存放的是值。
• 堆：复杂数据类型，首先在栈里放地址，然后地址指向堆，数据放在堆里。

12.2 传参

• 简单数据类型传参为值传递
• 复杂数据类型传参为地址传递