前者基础,前端基础之JavaScript

By admin in 4858美高梅 on 2019年4月8日

JavaScript概述

JavaScript概述

  • 1、JavaScript概述

  • 二、JavaScript引进格局

  • 3、JavaScript语言规范

  • 四、JavaScript语言基础

  • 5、JavaScript数据类型

  • 前者基础,前端基础之JavaScript。6、JavaScript运算符

  • 7、JavaScript流程控制

  • 8、JavaScript函数

  • 九、JavaScript词法分析
  • 10、JavaScript内置对象和艺术

JS介绍

1996年11月,JavaScript的创造者--Netscape公司,决定将JavaScript提交给国际标准化组织ECMA,希望这门语言能够成为国际标准。次年,ECMA发布262号标准文件(ECMA-262)的第一版,规定了浏览器脚本语言的标准,并将这种语言称为ECMAScript,这个版本就是1.0版。

该标准一开始就是针对JavaScript语言制定的,但是没有称其为JavaScript,有两个方面的原因。一是商标,JavaScript本身已被Netscape注册为商标。而是想体现这门语言的制定者是ECMA,而不是Netscape,这样有利于保证这门语言的开发性和中立性。

因此ECMAScript和JavaScript的关系是,前者是后者的规格,后者是前者的一种实现。

1、ECMAScript和JavaScript的关系

19九八年13月,JavaScript的成立者–Netscape公司,决定将JavaScript提交给国际规范协会ECMA,希望那门语言能够成为国际标准。次年,ECMA揭橥262号标准文件(ECMA-262)的首先版,规定了浏览器脚本语言的正规,并将那种语言称为ECMAScript,那些本子正是壹.0版。

该标准一初始正是本着JavaScript语言制定的,但是未有称其为JavaScript,有多少个地点的来头。一是商标,JavaScript自己已被Netscape注册为商标。而是想浮现这门语言的制定者是ECMA,而不是Netscape,那样有利于确认保障那门语言的开发性和中立性。

因而ECMAScript和JavaScript的涉及是,前者是继任者的口径,后者是前者的壹种完结。

ECMAScript和JavaScript的关系

一99七年1月,JavaScript的创制者–Netscape集团,决定将JavaScript提交给国标化协会ECMA,希望那门语言可以成为国际标准。次年,ECMA宣布26二号标准文件(ECMA-26二)的率先版,规定了浏览器脚本语言的规范,并将那种语言称为ECMAScript,那些本子就是一.0版。

该专业1开端正是针对性JavaScript语言制定的,不过从未称其为JavaScript,有八个方面包车型客车缘故。1是商标,JavaScript自己已被Netscape注册为商标。而是想展现那门语言的制定者是ECMA,而不是Netscape,那样便于保障那门语言的开发性和中立性。

因而ECMAScript和JavaScript的关联是,前者是后者的规格,后者是前者的一种完结。

一、JavaScript概述

ECMAScript的历史

年份

名称

描述

1997

ECMAScript 1

率先个本子

1998

ECMAScript 2

本子更改

1999

ECMAScript 3

添加正则表明式

添加try/catch

 

ECMAScript 4

从未有过公布

2009

ECMAScript 5

充分”strict mode”严苛格局

添加JSON支持

2011

ECMAScript 5.1

本子更改

2015

ECMAScript 6

添加类和模块

2016

ECMAScript 7

日增指数运算符(**)

增加Array.prototype.includes

注:ES6就是指ECMAScript
6。

就算 ECMAScript 是三个重大的标准,但它并不是 JavaScript
唯一的片段,当然,也不是绝无仅有被规范的一部分。实际上,二个完好的
JavaScript 达成是由以下 叁 个不一致部分组成的:

核心(ECMAScript) 
文档对象模型(DOM) Document object model (整合js,css,html)
浏览器对象模型(BOM) Broswer object model(整合js和浏览器)

简单地说,ECMAScript 描述了JavaScript语言本身的相关内容。

JavaScript 是脚本语言
JavaScript 是一种轻量级的编程语言。

JavaScript 是可插入 HTML 页面的编程代码。

JavaScript 插入 HTML 页面后,可由所有的现代浏览器执行。

贰、JavaScript引进情势

ECMAScript的历史

年份

名称

描述

1997

ECMAScript 1

首先个版本

1998

ECMAScript 2

本子更改

1999

ECMAScript 3

添加正则表明式

添加try/catch

 

ECMAScript 4

尚未公布

2009

ECMAScript 5

添加”strict mode”严苛形式

添加JSON支持

2011

ECMAScript 5.1

本子更改

2015

ECMAScript 6

添加类和模块

2016

ECMAScript 7

日增指数运算符(**)

增加Array.prototype.includes

注:ES6就是指ECMAScript 6。

即使 ECMAScript 是三个首要的专业,但它并不是 JavaScript
唯一的局地,当然,也不是唯一被规范的片段。实际上,1个完好无损的
JavaScript 达成是由以下 三 个例外部分构成的:

  • 核心(ECMAScript) 
  • 文书档案对象模型(DOM) Document object model
    (整合js,css,html)
  • 浏览器对象模型(BOM) Broswer object
    model(整合js和浏览器)

大致地说,ECMAScript
描述了JavaScript语言本人的相干内容。

JavaScript 是脚本语言
JavaScript 是一种轻量级的编制程序语言。

JavaScript 是可插入 HTML 页面包车型大巴编程代码。

JavaScript 插入 HTML 页面后,可由全部的当代浏览器执行。

JavaScript 很不难学习。

1、ECMAScript和JavaScript的关系

  一九九陆年3月,JavaScript的创制者–Netscape集团,决定将JavaScript提交给国际规范社团ECMA,希望那门语言能够成为国际标准。次年,ECMA公布26二号标准文件(ECMA-262)的第三版,规定了浏览器脚本语言的专业,并将那种语言称为ECMAScript,那么些本子就是壹.0版。

该规范1开端正是针对性JavaScript语言制定的,不过未有称其为JavaScript,有四个地方的原由。1是商标,JavaScript自个儿已被Netscape注册为商标。而是想显示那门语言的制定者是ECMA,而不是Netscape,那样便于保障那门语言的开发性和中立性。

由此ECMAScript和JavaScript的涉及是,前者是后人的标准化,后者是前者的一种达成。

JavaScript引进方式

a、Script标签内写代码

<script>
  // 在这里写你的JS代码
</script>

JavaScript引进情势

2、ECMAScript的历史

年份

名称

描述

1997

ECMAScript 1

首先个版本

1998

ECMAScript 2

本子更改

1999

ECMAScript 3

添加正则表明式

添加try/catch

 

ECMAScript 4

未曾发布

2009

ECMAScript 5

丰硕”strict mode”严刻情势

添加JSON支持

2011

ECMAScript 5.1

本子更改

2015

ECMAScript 6

添加类和模块

2016

ECMAScript 7

日增指数运算符(**)

增加Array.prototype.includes

 

注:ES6就是指ECMAScript 6。

就算 ECMAScript 是三个第3的正式,但它并不是 JavaScript
唯壹的片段,当然,也不是绝无仅有被规范的1部分。实际上,2个总体的
JavaScript 完结是由以下 3 个例外部分组成的:

  • 核心(ECMAScript) 
  • 文书档案对象模型(DOM) Document object model
    (整合js,css,html)
  • 浏览器对象模型(BOM) Broswer object
    model(整合js和浏览器)

一言以蔽之地说,ECMAScript
描述了JavaScript语言自个儿的连锁内容。

JavaScript 是脚本语言
JavaScript 是一种轻量级的编制程序语言。

JavaScript 是可插入 HTML 页面包车型大巴编制程序代码。

JavaScript 插入 HTML 页面后,可由全体的当代浏览器执行。

JavaScript 很容易学习。

Script标签内写代码

<script>
  // 在这里写你的JS代码
</script>

b、引进额外的JS文件

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

Script标签内写代码

<script>
  // 在这里写你的JS代码
</script>

2、JavaScript引入形式

引进额外的JS文件

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

叁、JavaScript语言规范

引进额外的JS文件

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

1、Script标签内写代码

<script>
  // 在这里写你的JS代码
</script>

JavaScript语言规范

a、注释(注释是代码之母)

// 这是单行注释

/*
这是
多行注释
*/

JavaScript语言规范

二、引进额外的JS文件

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

诠释(注释是代码之母)

// 这是单行注释

/*
这是
多行注释
*/

b、结束符

JavaScript中的语句要以分号(;)为终结符。

注脚(注释是代码之母)

4858美高梅 1

// 这是单行注释

/*
这是
多行注释
*/

4858美高梅 2

3、JavaScript语言规范

结束符

JavaScript中的语句要以分号(;)为了却符。

四、JavaScript语言基础

  1. JavaScript的变量名可以应用_,数字,字母,$组成,无法以数字开端。
  2. 宣示变量使用 var 变量名; 的格式来展开宣示

注意:

变量名是分别轻重缓急写的。

引入应用驼峰式命名规则。

保留字不可能用做变量名

4858美高梅 34858美高梅 4

abstract
boolean
byte
char
class
const
debugger
double
enum
export
extends
final
float
goto
implements
import
int
interface
long
native
package
private
protected
public
short
static
super
synchronized
throws
transient
volatile

保留字列表

保留字列表

结束符

JavaScript中的语句要以分号(;)为结束符。

1、注释

// 这是单行注释

/*
这是
多行注释
*/

JavaScript语言基础

五、JavaScript数据类型

JavaScript拥有动态类型

var x;  // 此时x是undefined
var x = 1;  // 此时x是数字
var x = "djb"  // 此时x是字符串

JavaScript语言基础

2、结束符

JavaScript中的语句要以分号(;)为了却符。

变量注解

  1. JavaScript的变量名能够运用_,数字,字母,$组成,无法以数字开首。
  2. 申明变量使用 var 变量名; 的格式来举办宣示

    var name = “Alex”;
    var age = 18;

注意:

变量名是分别轻重缓急写的。

推荐介绍使用驼峰式命名规则。

保留字不可能用做变量名。

补充:

ES六新增了let命令,用于注脚变量。其用法类似于var,不过所注脚的变量只在let命令所在的代码块内有效。例如:for循环的计数器就很合乎采取let命令。

for (let i=0;i<arr.length;i++){...}

ES六新增const用来声称常量。一旦评释,其值就无法更改。

const PI = 3.1415;
PI // 3.1415

PI = 3
// TypeError: "PI" is read-only

再也补充:

4858美高梅 54858美高梅 6

abstract
boolean
byte
char
class
const
debugger
double
enum
export
extends
final
float
goto
implements
import
int
interface
long
native
package
private
protected
public
short
static
super
synchronized
throws
transient
volatile

保留字列表

a、数值(Number)

JavaScript不区分整型和浮点型,就唯有一种数字类型。

var a = 12.34;
var b = 20;
var c = 123e5;  // 12300000
var d = 123e-5;  // 0.00123

再有一种NaN,表示不是一个数字(Not a Number)。

常用方法:

parseInt("123")  // 返回123
parseInt("ABC")  // 返回NaN,NaN属性是代表非数字值的特殊值。该属性用于指示某个值不是数字。
parseFloat("123.456")  // 返回123.456

变量注明

  1. JavaScript的变量名能够应用_,数字,字母,$组成,不可能以数字起始。
  2. 宣称变量使用 var 变量名; 的格式来进展宣示

    var name = “Alex”;
    var age = 18;

注意:

变量名是分别轻重缓急写的。

推荐介绍使用驼峰式命名规则。

保留字无法用做变量名。

补充:

ES六新增了let命令,用于表明变量。其用法类似于var,可是所表明的变量只在let命令所在的代码块内卓有成效。例如:for循环的计数器就很合乎利用let命令。

for (let i=0;i<arr.length;i++){...}

ES6新增const用来声称常量。壹旦注脚,其值就无法改变。

const PI = 3.1415;
PI // 3.1415

PI = 3
// TypeError: "PI" is read-only

再也补充:

4858美高梅 74858美高梅 8

abstract
boolean
byte
char
class
const
debugger
double
enum
export
extends
final
float
goto
implements
import
int
interface
long
native
package
private
protected
public
short
static
super
synchronized
throws
transient
volatile

保留字列表

 

4、JavaScript语言基础

JavaScript数据类型

JavaScript拥有动态类型

var x;  // 此时x是undefined
var x = 1;  // 此时x是数字
var x = "Alex"  // 此时x是字符串 

b、字符串(String)

var a = "Hello"
var b = "world;
var c = a + b; 
console.log(c);  // 得到Helloworld

方法

说明

.length

回去长度

.trim()

移除空白

.trimLeft()

移除左侧的空白

.trimRight()

移除右侧的空白

.charAt(n)

返回第n个字符

.concat(value, …)

拼接

.indexOf(substring, start)

子连串位置

.substring(from, to)

依照目录获取子种类

.slice(start, end)

切片

.toLowerCase()

小写

.toUpperCase()

大写

.split(delimiter, limit)

分割

拼接字符串一般接纳“+”

4858美高梅 94858美高梅 10

string.slice(start, stop)和string.substring(start, stop):

两者的相同点:
如果start等于end,返回空字符串
如果stop参数省略,则取到字符串末
如果某个参数超过string的长度,这个参数会被替换为string的长度

substirng()的特点:
如果 start > stop ,start和stop将被交换
如果参数是负数或者不是数字,将会被0替换

silce()的特点:
如果 start > stop 不会交换两者
如果start小于0,则切割从字符串末尾往前数的第abs(start)个的字符开始(包括该位置的字符)
如果stop小于0,则切割在从字符串末尾往前数的第abs(stop)个字符结束(不包含该位置字符)

slice和substring的区别

JavaScript数据类型

JavaScript拥有动态类型

var x;  // 此时x是undefined
var x = 1;  // 此时x是数字
var x = "Alex"  // 此时x是字符串 

1、变量表明

  1. JavaScript的变量名能够应用_,数字,字母,$组成,不可能以数字开端。
  2. 注脚变量使用 var 变量名; 的格式来进行宣示

    var name = “duoduo”;
    var age = 18;

注意:

变量名是分别轻重缓急写的。

推荐应用驼峰式命名规则。

保留字不可能用做变量名。

补充:

ES陆新增了let命令,用于证明变量。其用法类似于var,不过所注解的变量只在let命令所在的代码块内立竿见影。例如:for循环的计数器就很符合利用let命令。

for (let i=0;i<arr.length;i++){...}

ES陆新增const用来声称常量。壹旦评释,其值就无法改变。

const PI = 3.1415;
PI // 3.1415

PI = 3
// TypeError: "PI" is read-only

再次补充:

4858美高梅 114858美高梅 12

abstract
boolean
byte
char
class
const
debugger
double
enum
export
extends
final
float
goto
implements
import
int
interface
long
native
package
private
protected
public
short
static
super
synchronized
throws
transient
volatile

保留字列表

数值(Number)

JavaScript不区分整型和浮点型,就唯有1种数字类型。

var a = 12.34;
var b = 20;
var c = 123e5;  // 12300000
var d = 123e-5;  // 0.00123

再有1种NaN,表示不是一个数字(Not a Number)。

常用方法:

parseInt("123")  // 返回123
parseInt("ABC")  // 返回NaN,NaN属性是代表非数字值的特殊值。该属性用于指示某个值不是数字。
parseFloat("123.456")  // 返回123.456

c、布尔值(Boolean)

var a = true;
var b = false;

“”(空字符串)、0、null、undefined、NaN都以false。

 

数值(Number)

JavaScript不区分整型和浮点型,就唯有壹种数字类型。

var a = 12.34;
var b = 20;
var c = 123e5;  // 12300000
var d = 123e-5;  // 0.00123

再有一种NaN,表示不是两个数字(Not a Number)。

常用方法:

parseInt("123")  // 返回123
parseInt("ABC")  // 返回NaN,NaN属性是代表非数字值的特殊值。该属性用于指示某个值不是数字。
parseFloat("123.456")  // 返回123.456

伍、JavaScript数据类型

1、JavaScript拥有动态类型

var x;  // 此时x是undefined
var x = 1;  // 此时x是数字
var x = "duoduo"  // 此时x是字符串 

字符串(String)

var a = "Hello"
var b = "world;
var c = a + b; 
console.log(c);  // 得到Helloworld

常用方法:

方法

说明

.length

再次来到长度

.trim()

移除空白

.trimLeft()

移除右侧的空域

.trimRight()

移除右侧的空白

.charAt(n)

返回第n个字符

.concat(value, …)

拼接

.indexOf(substring, start)

子体系地方

.substring(from, to)

据书上说目录获取子种类

.slice(start, end)

切片

.toLowerCase()

小写

.toUpperCase()

大写

.split(delimiter, limit)

分割

 

拼接字符串一般选拔“+”

4858美高梅 134858美高梅 14

string.slice(start, stop)和string.substring(start, stop):

两者的相同点:
如果start等于end,返回空字符串
如果stop参数省略,则取到字符串末
如果某个参数超过string的长度,这个参数会被替换为string的长度

substirng()的特点:
如果 start > stop ,start和stop将被交换
如果参数是负数或者不是数字,将会被0替换

silce()的特点:
如果 start > stop 不会交换两者
如果start小于0,则切割从字符串末尾往前数的第abs(start)个的字符开始(包括该位置的字符)
如果stop小于0,则切割在从字符串末尾往前数的第abs(stop)个字符结束(不包含该位置字符)

slice和substring的区别

简短示例

s2 = "limengjie"
"limengjie"
s2.substring(0,-2)
"" //返回空
s2.slice(0,-2)
"limengj"

补充:

ES陆中引进了模版字符串。模板字符串(template
string)是增强版的字符串,用反引号(`)标识。它能够用作普通字符串使用,也能够用来定义多行字符串,恐怕在字符串中放到变量。

// 普通字符串
`这是普通字符串!`
// 多行文本
`这是多行的
文本`
// 字符串中嵌入变量
var name = "q1mi", time = "today";
`Hello ${name}, how are you ${time}?`

// 模板字符串示例
let s2 = `div的个数为:${divList.length}`
undefined
s2
"div的个数为:4"

 

注意:

比方模板字符串中须求利用反引号,则在其后面要用反斜杠转义。

JSHint启用ES6语法援救:/\ jshint esversion: 6 */*

d、null和undefined

  • null表示值是空,一般在须要钦赐或清空二个变量时才会使用,如
    name=null;
  • undefined表示当声澳优(Ausnutria Hyproca)个变量但未起初化时,该变量的暗许值是undefined。还有就是函数无强烈的重回值时,重回的也是undefined。

null表示变量的值是空,undefined则意味着只评释了变量,但还尚未赋值

字符串(String)

var a = "Hello"
var b = "world;
var c = a + b; 
console.log(c);  // 得到Helloworld

常用方法:

方法

说明

.length

回去长度

.trim()

移除空白

.trimLeft()

移除右边的空白

.trimRight()

移除左边的空域

.charAt(n)

返回第n个字符

.concat(value, …)

拼接

.indexOf(substring, start)

子体系地方

.substring(from, to)

基于目录获取子种类

.slice(start, end)

切片

.toLowerCase()

小写

.toUpperCase()

大写

.split(delimiter, limit)

分割

 拼接字符串1般选择“+”

4858美高梅 154858美高梅 16

string.slice(start, stop)和string.substring(start, stop):

两者的相同点:
如果start等于end,返回空字符串
如果stop参数省略,则取到字符串末
如果某个参数超过string的长度,这个参数会被替换为string的长度

substirng()的特点:
如果 start > stop ,start和stop将被交换
如果参数是负数或者不是数字,将会被0替换

silce()的特点:
如果 start > stop 不会交换两者
如果start小于0,则切割从字符串末尾往前数的第abs(start)个的字符开始(包括该位置的字符)
如果stop小于0,则切割在从字符串末尾往前数的第abs(stop)个字符结束(不包含该位置字符)

slice和substring的区别

 

补充:

ES陆中引进了模版字符串。模板字符串(template
string)是增强版的字符串,用反引号(`)标识。它能够当做普通字符串使用,也能够用来定义多行字符串,或许在字符串中放到变量。

4858美高梅 17

// 普通字符串
`这是普通字符串!`
// 多行文本
`这是多行的
文本`
// 字符串中嵌入变量
var name = "q1mi", time = "today";
`Hello ${name}, how are you ${time}?`

4858美高梅 18

注意:

要是模板字符串中须要利用反引号,则在其前方要用反斜杠转义。

JSHint启用ES陆语法援助:/\ jshint esversion: 6 */*

2、数值(Number)

JavaScript不区分整型和浮点型,就唯有壹种数字类型。

var a = 12.34;
var b = 20;
var c = 123e5;  // 12300000
var d = 123e-5;  // 0.00123

再有壹种NaN,表示不是3个数字(Not a Number)。

常用方法:

parseInt("123")  // 返回123
parseInt("ABC")  // 返回NaN,NaN属性是代表非数字值的特殊值。该属性用于指示某个值不是数字。
parseFloat("123.456")  // 返回123.456

布尔值(Boolean)

分别于Python,true和false都以小写。

var a = true;
var b = false;

“”(空字符串)、0、null、undefined、NaN都以false。

let s1 = "123";
undefined
typeof s1
"string"
let n1 = parseInt(s1)
undefined
typeof n1
"number"
let s2 = "李梦杰"
let n2 = parseInt(s2)
undefined
n2
NaN

 

e、对象(Object)

JavaScript
中的全部东西都是目的:字符串、数值、数组、函数…其它,JavaScript
允许自定义对象。

JavaScript 提供多个内建指标,比如 String、Date、Array 等等。

目标只是带有属性和艺术的异样数据类型。

数组

数组对象的成效是:使用单独的变量名来囤积壹多重的值。类似于Python中的列表

var a = [123, "ABC"];
console.log(a[1]);  // 输出"ABC"

 常用艺术:

方法

说明

.length

数组的大大小小

.push(ele)

后面部分增先令素

.pop()

赢得尾巴部分的因素

.unshift(ele)

头顶插入成分

.shift()

头顶移除成分

.slice(start, end)

切片

.reverse()

反转

.join(seq)

将数组成分连接成字符串

.concat(val, …)

一连数组

.sort()

排序

.forEach()

将数组的各种成分传递给回调函数

.splice()

删去成分,并向数组添加新因素。

.map()

回来1个数组成分调用函数处理后的值的新数组

布尔值(Boolean)

有别于于Python,true和false都以小写。

var a = true;
var b = false;

“”(空字符串)、0、null、undefined、NaN都以false。

3、字符串(String)

var a = "Hello"
var b = "world;
var c = a + b; 
console.log(c);  // 得到Helloworld

常用方法:

方法

说明

.length

归来长度

.trim()

移除空白

.trimLeft()

移除左侧的空域

.trimRight()

移除右侧的空白

.charAt(n)

返回第n个字符

.concat(value, …)

拼接

.indexOf(substring, start)

子种类地点

.substring(from, to)

依照目录获取子连串

.slice(start, end)

切片

.toLowerCase()

小写

.toUpperCase()

大写

.split(delimiter, limit)

分割

 

拼接字符串1般接纳“+”

4858美高梅 194858美高梅 20

string.slice(start, stop)和string.substring(start, stop):

两者的相同点:
如果start等于end,返回空字符串
如果stop参数省略,则取到字符串末
如果某个参数超过string的长度,这个参数会被替换为string的长度

substirng()的特点:
如果 start > stop ,start和stop将被交换
如果参数是负数或者不是数字,将会被0替换

silce()的特点:
如果 start > stop 不会交换两者
如果start小于0,则切割从字符串末尾往前数的第abs(start)个的字符开始(包括该位置的字符)
如果stop小于0,则切割在从字符串末尾往前数的第abs(stop)个字符结束(不包含该位置字符)

slice和substring的区别

补充:

ES陆中引进了模版字符串。模板字符串(template
string)是增强版的字符串,用反引号(`)标识。它能够作为普通字符串使用,也得以用来定义多行字符串,或然在字符串中置放变量。

// 普通字符串
`这是普通字符串!`
// 多行文本
`这是多行的
文本`
// 字符串中嵌入变量
var name = "duoduo", time = "today";
`Hello ${name}, how are you ${time}?`

注意:

若果模板字符串中要求选用反引号,则在其前边要用反斜杠转义。

JSHint启用ES6语法帮助:/* jshint esversion: 6 */

null和undefined

  • null表示值是空,一般在急需钦定或清空二个变量时才会选择,如
    name=null;
  • undefined代表当声美素佳儿(Friso)个变量但未起初化时,该变量的私下认可值是undefined。还有就是函数无强烈的再次来到值时,重回的也是undefined。

null表示变量的值是空,undefined则代表只注解了变量,但还未有赋值。

 

f、类型查询

typeof "abc"  // "string"
typeof null  // "object"
typeof true  // "boolean"
typeof 123 // "number"

typeof是多个1元运算符(如同++,–,!,-
等一元运算符),不是三个函数,也不是一个话语。

对变量或值调用 typeof 运算符将回来下列值之一:

  • undefined – 假若变量是 Undefined 类型的
  • boolean – 尽管变量是 Boolean 类型的
  • number – 假如变量是 Number 类型的
  • string – 假设变量是 String 类型的
  • object – 要是变量是1种引用类型或 Null 类型的

null和undefined

  • null表示值是空,一般在急需钦点或清空3个变量时才会选择,如
    name=null;
  • undefined代表当声美素佳儿个变量但未初阶化时,该变量的私下认可值是undefined。还有便是函数无显著的重临值时,重回的也是undefined。

null表示变量的值是空,undefined则表示只注明了变量,但还未曾赋值。

还不领悟,上海教室吧!

4858美高梅 214858美高梅 22

4、布尔值(Boolean)

分别于Python,true和false都以小写。

var a = true;
var b = false;

“”(空字符串)、0、null、undefined、NaN都以false。

对象(Object)

可见称为引用数据类型,类似python的list,dict

JavaScript
中的全部东西都是指标:字符串、数值、数组、函数…其它,JavaScript
允许自定义对象。

JavaScript 提供多少个内建指标,比如 String、Date、Array 等等。

对象只是带有属性和艺术的例外数据类型。

数组

数组对象的效果是:使用单独的变量名来存款和储蓄一名目繁多的值。类似于Python中的列表。

var a = [123, "ABC"];
console.log(a[1]);  // 输出"ABC"

 常用艺术:

方法

说明

.length

数组的轻重缓急

.push(ele)

尾巴部分增日成分

.pop()

获取尾巴部分的要素

.unshift(ele)

尾部插入成分

.shift()

尾部移除成分

.slice(start, end)

切片

.reverse()

反转

.join(seq)

将数组成分连接成字符串

.concat(val, …)

连年数组

.sort()

排序

.forEach()

将数组的各样成分传递给回调函数

.splice()

删除成分,并向数组添加新因素。

.map()

回去1个数组成分调用函数处理后的值的新数组

有关sort()须要小心:

倘使调用该措施时未尝采用参数,将按字母逐1对数组中的成分举办排序,说得越来越精确点,是根据字符编码的次第举行排序。要促成那点,首先应把数组的成分都转换到字符串(如有供给),以便进行相比较。

假使想按部就班别的专业开始展览排序,就须求提供比较函数,该函数要相比七个值,然后回来2个用来表明这七个值的相持顺序的数字。比较函数应该享有四个参数
a 和 b,其再次来到值如下:

若 a 小于 b,在排序后的数组中 a 应该出现在 b 此前,则赶回二个低于 0
的值。
若 a 等于 b,则返回 0。
若 a 大于 b,则赶回2个不止 0 的值。

示例:

function sortNumber(a,b){
    return a - b
}
var arr1 = [11, 100, 22, 55, 33, 44]
arr1.sort(sortNumber)

至于遍历数组中的成分,能够应用下边的艺术:

var a = [10, 20, 30, 40];
for (var i=0;i<a.length;i++) {
  console.log(i);
}

6、运算符

对象(Object)

JavaScript
中的全数东西都以目的:字符串、数值、数组、函数…其它,JavaScript
允许自定义对象。

JavaScript 提供八个内建目的,比如 String、Date、Array 等等。

指标只是带有属性和章程的奇特数据类型。

数组

数组对象的机能是:使用单独的变量名来存储一名目繁多的值。类似于Python中的列表。

var a = [123, "ABC"];
console.log(a[1]);  // 输出"ABC"

 常用艺术:

方法

说明

.length

数组的高低

.push(ele)

后面部分增比索素

.pop()

获得尾部的要素

.unshift(ele)

头顶插入元素

.shift()

头顶移除成分

.slice(start, end)

切片

.reverse()

反转

.join(seq)

将数组成分连接成字符串

.concat(val, …)

连日数组

.sort()

排序

.forEach()

将数组的各个元素传递给回调函数

.splice()

删去成分,并向数组添加新因素。

.map()

回来一个数组成分调用函数处理后的值的新数组

有关sort()必要专注:

如若调用该方式前卫未采取参数,将按字母顺序对数组中的元素进行排序,说得更加精确点,是安分守己字符编码的11进行排序。要贯彻那一点,首先应把数组的因素都转换来字符串(如有供给),以便进行相比较。

要是想奉公守法其余专业开始展览排序,就供给提供相比较函数,该函数要相比多少个值,然后回到八个用于注明那多个值的周旋顺序的数字。比较函数应该拥有七个参数
a 和 b,其重回值如下:

若 a 小于 b,在排序后的数组中 a 应该出现在 b 以前,则赶回三个低于 0
的值。
若 a 等于 b,则返回 0。
若 a 大于 b,则赶回三个超出 0 的值。

示例:

function sortNumber(a,b){
    return a - b
}
var arr1 = [11, 100, 22, 55, 33, 44]
arr1.sort(sortNumber)

关于遍历数组中的成分,可以运用下面包车型大巴不2秘诀:

var a = [10, 20, 30, 40];
for (var i=0;i<a.length;i++) {
  console.log(i);
}

5、null和undefined

  • null表示值是空,1般在急需内定或清空3个变量时才会动用,如
    name=null;
  • undefined代表当声喜宝(Beingmate)个变量但未开端化时,该变量的暗中认可值是undefined。还有就是函数无明显的再次来到值时,再次回到的也是undefined。

null表示变量的值是空,undefined则象征只评释了变量,但还不曾赋值。

forEach()

4858美高梅 23

 

语法:

forEach(function(currentValue, index, arr), thisValue)

参数:

参数 描述
function(currentValue, index, arr) 必需。 数组中每个元素需要调用的函数。
函数参数:

参数 描述
currentValue 必需。当前元素
index 可选。当前元素的索引值。
arr 可选。当前元素所属的数组对象。
thisValue 可选。传递给函数的值一般用 "this" 值。
如果这个参数为空, "undefined" 会传递给 "this" 值

a、算数运算符

+ - * / % ++ --

forEach()

语法:

forEach(function(currentValue, index, arr), thisValue)

参数:

参数 描述
function(currentValue, index, arr) 必需。 数组中每个元素需要调用的函数。
函数参数:

参数 描述
currentValue 必需。当前元素
index 可选。当前元素的索引值。
arr 可选。当前元素所属的数组对象。
thisValue 可选。传递给函数的值一般用 "this" 值。
如果这个参数为空, "undefined" 会传递给 "this" 值

6、对象(Object)

JavaScript
中的全体东西都以目的:字符串、数值、数组、函数…其它,JavaScript
允许自定义对象。

JavaScript 提供五个内建目的,比如 String、Date、Array 等等。

对象只是带有属性和方法的超过常规规数据类型。

7、数组

数组对象的作用是:使用单独的变量名来囤积一文山会海的值。类似于Python中的列表。

var a = [123, "ABC"];
console.log(a[1]);  // 输出"ABC"

 常用艺术:

方法

说明

.length

数组的轻重缓急

.push(ele)

尾巴部分增美成分

.pop()

收获尾巴部分的因素

.unshift(ele)

尾部插入元素

.shift()

尾部移除成分

.slice(start, end)

切片

.reverse()

反转

.join(seq)

将数组成分连接成字符串

.concat(val, …)

连日来数组

.sort()

排序

有关sort()须求小心:

借使调用该措施时未有动用参数,将按字母逐一对数组中的成分举行排序,说得越来越精确点,是比照字符编码的依次进行排序。要贯彻那或多或少,首先应把数组的要素都转换来字符串(如有供给),以便举行相比较。

假若想安分守纪别的标准开始展览排序,就须要提供相比函数,该函数要相比八个值,然后再次来到三个用来声明那五个值的周旋顺序的数字。比较函数应该有着多少个参数
a 和 b,其重返值如下:

若 a 小于 b,在排序后的数组中 a 应该出现在 b 之前,则赶回二个低于 0
的值。
若 a 等于 b,则返回 0。
若 a 大于 b,则赶回三个过量 0 的值。

示例:

function sortNumber(a,b){
    return a - b
}
var arr1 = [11, 100, 22, 55, 33, 44]
arr1.sort(sortNumber)

有关遍历数组中的元素,能够使用上面包车型地铁艺术:

var a = [10, 20, 30, 40];
for (var i=0;i<a.length;i++) {
  console.log(i);
}

补充:

ES陆新引进了壹种新的本来数据类型(Symbol),表示无比的值。它是JavaScript语言的第玖种数据类型。

splice()

4858美高梅 24

 

语法:

splice(index,howmany,item1,…..,itemX)

参数: 

参数 描述
index 必需。规定从何处添加/删除元素。
该参数是开始插入和(或)删除的数组元素的下标,必须是数字。
howmany 必需。规定应该删除多少元素。必须是数字,但可以是 "0"。
如果未规定此参数,则删除从 index 开始到原数组结尾的所有元素。
item1, …, itemX 可选。要添加到数组的新元素

b、相比运算符

> >= < <= != == === !==

注意:

1 == “1”  // true
1 === "1"  // false

splice()

语法:

splice(index,howmany,item1,…..,itemX)

参数: 

参数 描述
index 必需。规定从何处添加/删除元素。
该参数是开始插入和(或)删除的数组元素的下标,必须是数字。
howmany 必需。规定应该删除多少元素。必须是数字,但可以是 "0"。
如果未规定此参数,则删除从 index 开始到原数组结尾的所有元素。
item1, …, itemX 可选。要添加到数组的新元素

八、类型查询

typeof "abc"  // "string"
typeof null  // "object"
typeof true  // "boolean"
typeof 123 // "number"

typeof是八个1元运算符(就像是++,–,!,-
等1元运算符),不是贰个函数,也不是八个讲话。

对变量或值调用 typeof 运算符将重返下列值之1:

  • undefined – 假设变量是 Undefined 类型的
  • boolean – 假若变量是 Boolean 类型的
  • number – 如果变量是 Number 类型的
  • string – 假如变量是 String 类型的
  • object – 假使变量是一种引用类型或 Null 类型的

map()

4858美高梅 25

 

语法:

map(function(currentValue,index,arr), thisValue)

参数:

参数 描述
function(currentValue, index,arr) 必须。函数,数组中的每个元素都会执行这个函数
函数参数:

参数 描述
currentValue 必须。当前元素的值
index 可选。当期元素的索引值
arr 可选。当期元素属于的数组对象
thisValue 可选。对象作为该执行回调时使用,传递给函数,用作 "this" 的值。
如果省略了 thisValue ,"this" 的值为 "undefined"

补充:

ES陆新引进了壹种新的本来面目数据类型(Symbol),表示无比的值。它是JavaScript语言的第二种数据类型。

c、逻辑运算符

&& || !

map()

语法:

map(function(currentValue,index,arr), thisValue)

参数:

参数 描述
function(currentValue, index,arr) 必须。函数,数组中的每个元素都会执行这个函数
函数参数:

参数 描述
currentValue 必须。当前元素的值
index 可选。当期元素的索引值
arr 可选。当期元素属于的数组对象
thisValue 可选。对象作为该执行回调时使用,传递给函数,用作 "this" 的值。
如果省略了 thisValue ,"this" 的值为 "undefined"

补充:

ES陆新引进了壹种新的原始数据类型(Symbol),表示无比的值。它是JavaScript语言的第5种数据类型。

六、运算符

花色查询

typeof "abc"  // "string"
typeof null  // "object"
typeof true  // "boolean"
typeof 123 // "number"

typeof是二个1元运算符(就如++,–,!,-
等一元运算符),不是三个函数,也不是多个话语。

对变量或值调用 typeof 运算符将回到下列值之1:

  • undefined – 假诺变量是 Undefined 类型的
  • boolean – 若是变量是 Boolean 类型的
  • number – 若是变量是 Number 类型的
  • string – 假诺变量是 String 类型的
  • object – 假如变量是一种引用类型或 Null 类型的

 4858美高梅 26

4858美高梅, 

d、赋值运算符

= += -= *= /=

类型查询

typeof "abc"  // "string"
typeof null  // "object"
typeof true  // "boolean"
typeof 123 // "number"

typeof是多个一元运算符(仿佛++,–,!,-
等一元运算符),不是1个函数,也不是2个言辞。

对变量或值调用 typeof 运算符将再次来到下列值之1:

  • undefined – 假如变量是 Undefined 类型的
  • boolean – 假使变量是 Boolean 类型的
  • number – 假使变量是 Number 类型的
  • string – 假若变量是 String 类型的
  • object – 假如变量是壹种引用类型或 Null 类型的

一、算数运算符

+ - * / % ++ --

运算符

7、流程控制

运算符

二、相比较运算符

> >= < <= != == === !==

注意:

1 == “1”  // true
1 === "1"  // false

算数运算符

+ - * / % ++ --

a、if-else

var a = 10;
if (a > 5){
  console.log("yes");
}else {
  console.log("no");
}

算数运算符

+ - * / % ++ --

3、逻辑运算符

&& || !

相比运算符

> >= < <= != == === !==

注意:

1 == “1”  // true
1 === "1"  // false

b、if-else if-else 

var a = 10;
if (a > 5){
  console.log("a > 5");
}else if (a < 5) {
  console.log("a < 5");
}else {
  console.log("a = 5");
}

相比运算符

> >= < <= != == === !==

注意:

1 == “1”  // true
1 === "1"  // false

四、赋值运算符

= += -= *= /=


逻辑运算符

&& || !

c、switch

var day = new Date().getDay();
switch (day) {
  case 0:
  console.log("Sunday");
  break;
  case 1:
  console.log("Monday");
  break;
default:
  console.log("...")
}

switch中的case子句平日都会加break语句,不然程序会继续执行后续case中的语句。

逻辑运算符

&& || !

7、流程序控制制

赋值运算符

= += -= *= /=

d、for

for (var i=0;i<10;i++) {
  console.log(i);
}

赋值运算符

= += -= *= /=

1、if-else

var a = 10;
if (a > 5){
  console.log("yes");
}else {
  console.log("no");
}

流程序控制制

e、while

var i = 0;
while (i < 10) {
  console.log(i);
  i++;
}

流程序控制制

2、if-else if-else 

var a = 10;
if (a > 5){
  console.log("a > 5");
}else if (a < 5) {
  console.log("a < 5");
}else {
  console.log("a = 5");
}

if-else

var a = 10;
if (a > 5){
  console.log("yes");
}else {
  console.log("no");
}

f、安慕希运算

var a = 1;
var b = 2;
var c = a > b ? a : b

if-else

4858美高梅 27

var a = 10;
if (a > 5){
  console.log("yes");
}else {
  console.log("no");
}

4858美高梅 28

3、switch

var day = new Date().getDay();
switch (day) {
  case 0:
  console.log("Sunday");
  break;
  case 1:
  console.log("Monday");
  break;
default:
  console.log("...")
}

switch中的case子句普通都会加break语句,不然程序会继续执行后续case中的语句。

if-else if-else 

4858美高梅 29

var a = 10;
if (a > 5){
  console.log("a > 5");
}else if (a < 5) {
  console.log("a < 5");
}else {
  console.log("a = 5");
}

4858美高梅 30

8、函数

if-else if-else 

4858美高梅 31

var a = 10;
if (a > 5){
  console.log("a > 5");
}else if (a < 5) {
  console.log("a < 5");
}else {
  console.log("a = 5");
}

4858美高梅 32

4、for

for (var i=0;i<10;i++) {
  console.log(i);
}

switch

4858美高梅 33

var day = new Date().getDay();
switch (day) {
  case 0:
  console.log("Sunday");
  break;
  case 1:
  console.log("Monday");
  break;
default:
  console.log("...")
}

4858美高梅 34

switch中的case子句普通都会加break语句,不然程序会继续执行后续case中的语句。

a、函数定义

// 普通函数定义
function f1() {
  console.log("Hello world!");
}

// 带参数的函数
function f2(a, b) {
  console.log(arguments);  // 内置的arguments对象
  console.log(arguments.length);
  console.log(a, b);
}

// 带返回值的函数
function sum(a, b){
  return a + b;
}
sum(1, 2);  // 调用函数

// 匿名函数方式
var sum = function(a, b){
  return a + b;
}
sum(1, 2);

// 立即执行函数
(function(a, b){
  return a + b;
})(1, 2);

switch

4858美高梅 35

var day = new Date().getDay();
switch (day) {
  case 0:
  console.log("Sunday");
  break;
  case 1:
  console.log("Monday");
  break;
default:
  console.log("...")
}

4858美高梅 36

switch中的case子句平日都会加break语句,不然程序会继续执行后续case中的语句。

5、while

var i = 0;
while (i < 10) {
  console.log(i);
  i++;
}

for

for (var i=0;i<10;i++) {
  console.log(i);
}

当遭遇字典的KV值不分明时,可用for来循环遍历:

a = {"name":"lmj","age":18};
for (i in a) {
    console.log(i,a[i]);
}

// name lmj
// age 18

 

b、函数的全局变量和一些变量

局地变量

在JavaScript函数内部宣称的变量(使用
var)是壹些变量,所以不得不在函数内部访问它(该变量的功用域是函数内部)。只要函数运营完毕,本地变量就会被删除。

全局变量:

在函数外注明的变量是全局变量,网页上的全数脚本和函数都能访问它。

变量生存周期:

JavaScript变量的生命期从它们被声称的年月首步。

有的变量会在函数运转之后被去除。

全局变量会在页面关闭后被删除。

for

for (var i=0;i<10;i++) {
  console.log(i);
}

陆、长富运算

var a = 1;
var b = 2;
var c = a > b ? a : b

while

var i = 0;
while (i < 10) {
  console.log(i);
  i++;
}

九、词法分析

JavaScript中在调用函数的那须臾间,会先实行词法分析。

词法分析的进度:

当函数调用的前一弹指间,会先形成3个激活对象:Avtive
Object(AO),并会分析以下一个方面:

1:函数参数,如若有,则将此参数赋值给AO,且值为undefined。借使未有,则不做任何操作。
2:函数局地变量,如若AO上有同名的值,则不做此外操作。假如没有,则将此变量赋值给AO,并且值为undefined。
3:函数评释,如若AO上有,则会将AO上的对象覆盖。假使未有,则不做其它操作。

函数内部无论是使用参数照旧采用一些变量都到AO上找。

看多个例证:

var age = 18;
function foo(){
  console.log(age);
  var age = 22;
  console.log(age);
}
foo();  // 问:执行foo()之后的结果是?

var age = 18;
function foo(){
  console.log(age);
  var age = 22;
  console.log(age);
  function age(){
    console.log("呵呵");
  }
  console.log(age);
}
foo();  // 执行后的结果是?

4858美高梅 374858美高梅 38

词法分析过程:
1、分析参数,有一个参数,形成一个 AO.age=undefine;
2、分析变量声明,有一个 var age, 发现 AO 上面已经有一个 AO.age,因此不做任何处理
3、分析函数声明,有一个 function age(){...} 声明, 则把原有的 age 覆盖成 AO.age=function(){...};

最终,AO上的属性只有一个age,并且值为一个函数声明

执行过程:
注意:执行过程中所有的值都是从AO对象上去寻找

1、执行第一个 console.log(age) 时,此时的 AO.age 是一个函数,所以第一个输出的一个函数
2、这句 var age=22; 是对 AO.age 的属性赋值, 此时AO.age=22 ,所以在第二个输出的是 2
3、同理第三个输出的还是22, 因为中间再没有改变age值的语句了

解析解答

while

var i = 0;
while (i < 10) {
  console.log(i);
  i++;
}

八、函数

新年终中一年级运算

var a = 1;
var b = 2;
var c = a > b ? a : b

拾、内置对象和章程

JavaScript中的全数东西都以指标:字符串、数字、数组、日期,等等。在JavaScript中,对象是兼具属性和办法的数据。

作者们在上学为主数据类型的时候曾经带大家精晓了,JavaScript中的Number对象、String对象、Array对象等。

注意var s1 = “abc”和var s2 = new
String(“abc”)的区别:typeof s1 –> string而 typeof s2 –>
Object

 4858美高梅 39

长富运算

var a = 1;
var b = 2;
var c = a > b ? a : b

壹、函数定义

JavaScript中的函数和Python中的分外周围,只是概念情势有个别差距。

// 普通函数定义
function f1() {
  console.log("Hello world!");
}

// 带参数的函数
function f2(a, b) {
  console.log(arguments);  // 内置的arguments对象
  console.log(arguments.length);
  console.log(a, b);
}

// 带返回值的函数
function sum(a, b){
  return a + b;
}
sum(1, 2);  // 调用函数

// 匿名函数方式
var sum = function(a, b){
  return a + b;
}
sum(1, 2);

// 立即执行函数
(function(a, b){
  return a + b;
})(1, 2);

补充:

ES陆中允许行使“箭头”(=>)定义函数。

var f = v => v;
// 等同于
var f = function(v){
  return v;
}

要是箭头函数不须求参数或必要多少个参数,便是用圆括号表示参数部分:

var f = () => 5;
// 等同于
var f = function(){return 5};

var sum = (num1, num2) => num1 + num2;
// 等同于
var sum = function(num1, num2){
  return num1 + num2;
}

函数

a、自定义对象

vaScript的指标(Object)本质上是键值对的集聚(Hash结构),然则只可以用字符串作为键。

var a = {"name": "djb", "age": 18};
console.log(a.name);
console.log(a["age"]);

遍历对象中的内容:

var a = {"name": "djb", "age": 18};
for (var i in a){
  console.log(i, a[i]);
}

创立对象:

var person=new Object();  // 创建一个person对象
person.name="djb";  // person对象的name属性
person.age=18;  // person对象的age属性

函数

二、函数中的arguments参数

function add(a,b){
  console.log(a+b);
  console.log(arguments.length)
}
add(1,2)

输出:

3
2

注意:

函数只好回去三个值,假如要重回三个值,只好将其放在数组或对象中回到。

函数定义

JavaScript中的函数和Python中的十二分接近,只是概念形式有点区别。

4858美高梅 40

// 普通函数定义
function f1() {
  console.log("Hello world!");
}

// 带参数的函数
function f2(a, b) {
  console.log(arguments);  // 内置的arguments对象
  console.log(arguments.length);
  console.log(a, b);
}

// 带返回值的函数
function sum(a, b){
  return a + b;
}
sum(1, 2);  // 调用函数

// 匿名函数方式
var sum = function(a, b){
  return a + b;
}
sum(1, 2);

// 立即执行函数
(function(a, b){
  return a + b;
})(1, 2);

4858美高梅 41

补充:

ES6中允许行使“箭头”(=>)定义函数。

var f = v => v;
// 等同于
var f = function(v){
  return v;
}

 

只要箭头函数不需求参数或需求七个参数,正是用圆括号表示参数部分:

4858美高梅 42

var f = () => 5;
// 等同于
var f = function(){return 5};

var sum = (num1, num2) => num1 + num2;
// 等同于
var sum = function(num1, num2){
  return num1 + num2;
}

4858美高梅 43

b、Date对象

创建Date对象

//方法1:不指定参数
var d1 = new Date();
console.log(d1.toLocaleString());
//方法2:参数为日期字符串
var d2 = new Date("2004/3/20 11:12");
console.log(d2.toLocaleString());
var d3 = new Date("04/03/20 11:12");
console.log(d3.toLocaleString());
//方法3:参数为毫秒数
var d3 = new Date(5000);
console.log(d3.toLocaleString());
console.log(d3.toUTCString());

//方法4:参数为年月日小时分钟秒毫秒
var d4 = new Date(2004,2,20,11,12,0,300);
console.log(d4.toLocaleString());  //毫秒并不直接显示

Date对象的措施:

var d = new Date(); 
//getDate()                 获取日
//getDay ()                 获取星期
//getMonth ()               获取月(0-11)
//getFullYear ()            获取完整年份
//getYear ()                获取年
//getHours ()               获取小时
//getMinutes ()             获取分钟
//getSeconds ()             获取秒
//getMilliseconds ()        获取毫秒
//getTime ()                返回累计毫秒数(从1970/1/1午夜)

函数定义

JavaScript中的函数和Python中的非凡接近,只是概念格局有个别不一致。

4858美高梅 44

// 普通函数定义
function f1() {
  console.log("Hello world!");
}

// 带参数的函数
function f2(a, b) {
  console.log(arguments);  // 内置的arguments对象
  console.log(arguments.length);
  console.log(a, b);
}

// 带返回值的函数
function sum(a, b){
  return a + b;
}
sum(1, 2);  // 调用函数

// 匿名函数方式
var sum = function(a, b){
  return a + b;
}
sum(1, 2);

// 立即执行函数
(function(a, b){
  return a + b;
})(1, 2);

4858美高梅 45

补充:

ES六中允许利用“箭头”(=>)定义函数。

var f = v => v;
// 等同于
var f = function(v){
  return v;
}

1经箭头函数不要求参数或索要八个参数,正是用圆括号表示参数部分:

4858美高梅 46

var f = () => 5;
// 等同于
var f = function(){return 5};

var sum = (num1, num2) => num1 + num2;
// 等同于
var sum = function(num1, num2){
  return num1 + num2;
}

4858美高梅 47

三、函数的全局变量和有个别变量

有的变量

在JavaScript函数内部宣称的变量(使用
var)是一些变量,所以只可以在函数内部访问它(该变量的成效域是函数内部)。只要函数运行落成,当地变量就会被删除。

全局变量:

在函数外注明的变量是全局变量,网页上的全部脚本和函数都能访问它。

变量生存周期:

JavaScript变量的生命期从它们被声称的年月中步。

有个别变量会在函数运维之后被剔除。

全局变量会在页面关闭后被删除。

函数中的arguments参数

function add(a,b){
  console.log(a+b);
  console.log(arguments.length)
}

add(1,2)

输出:

2
3

函数名作为参数被调用,示例

# 函数的调用示例,列表从小至大排序
function twonum(x,y) {
    return x - y
}
var list1 = [3,22,44,11,2,0,66]
list1.sort(twonum)

 [0, 2, 3, 11, 22, 44, 66]

 

注意:

函数只能回去二个值,借使要回去多少个值,只可以将其放在数组或对象中回到。

function foo(var1,var2){
    do something
    return var3 # 返回一个值
    return var4,var5 # 错误写法,这样只会返回一个值,var5
    return [var6,var7] # 列表返回多个值
}

 

c、JSON对象

var str1 = '{"name": "djb", "age": 18}';
var obj1 = {"name": "djb", "age": 18};
// JSON字符串转换成对象
var obj = JSON.parse(str1); 
// 对象转换成JSON字符串
var str = JSON.stringify(obj1);

函数中的arguments参数

4858美高梅 48

function add(a,b){
  console.log(a+b);
  console.log(arguments.length)
}

add(1,2)

4858美高梅 49

输出:

3
2

注意:

函数只可以回去一个值,若是要赶回八个值,只可以将其放在数组或对象中回到。

4、作用域

首先在函数内部查找变量,找不到则到外围函数查找,稳步找到最外层。

多少个例子:

1.

var city = "BeiJing";
function f() {
  var city = "ShangHai";
  function inner(){
    var city = "ShenZhen";
    console.log(city);
  }
  inner();
}
f();  //输出结果是?

2.

var city = "BeiJing";
function Bar() {
  console.log(city);
}
function f() {
  var city = "ShangHai";
  return Bar;
}
var ret = f();
ret();  // 打印结果是?

3.闭包

var city = "BeiJing";
function f(){
    var city = "ShangHai";
    function inner(){
        console.log(city);
    }
    return inner;
}
var ret = f();
ret();

函数的全局变量和局地变量

一些变量

在JavaScript函数内部宣称的变量(使用
var)是局地变量,所以只可以在函数内部访问它(该变量的功用域是函数内部)。只要函数运维达成,本地变量就会被去除。

全局变量:

在函数外注脚的变量是全局变量,网页上的拥有脚本和函数都能访问它。

变量生存周期:

JavaScript变量的生命期从它们被声称的时辰开头。

1对变量会在函数运转之后被删去。

全局变量会在页面关闭后被去除。

d、Math对象

abs(x)      返回数的绝对值。
exp(x)      返回 e 的指数。
floor(x)    对数进行下舍入。
log(x)      返回数的自然对数(底为e)。
max(x,y)    返回 x 和 y 中的最高值。
min(x,y)    返回 x 和 y 中的最低值。
pow(x,y)    返回 x 的 y 次幂。
random()    返回 0 ~ 1 之间的随机数。
round(x)    把数四舍五入为最接近的整数。
sin(x)      返回数的正弦。
sqrt(x)     返回数的平方根。
tan(x)      返回角的正切。

函数的全局变量和1部分变量

一部分变量

在JavaScript函数内部宣称的变量(使用
var)是1些变量,所以不得不在函数内部访问它(该变量的功用域是函数内部)。只要函数运转达成,本地变量就会被删除。

全局变量:

在函数外证明的变量是全局变量,网页上的全体脚本和函数都能访问它。

变量生存周期:

JavaScript变量的生命期从它们被声称的日子开端。

局地变量会在函数运维之后被去除。

全局变量会在页面关闭后被删除。

九、词法分析(尝试掌握)

JavaScript中在调用函数的那瞬间,会先进行词法分析。

词法分析的进程:

当函数调用的前1须臾间,会先形成多个激活对象:Avtive
Object(AO),并会分析以下一个方面:

壹:函数参数,假若有,则将此参数赋值给AO,且值为undefined。要是未有,则不做任何操作。
贰:函数局地变量,假设AO上有同名的值,则不做其余操作。假诺未有,则将此变量赋值给AO,并且值为undefined。
3:函数注解,要是AO上有,则会将AO上的靶子覆盖。要是未有,则不做其余操作。

函数内部无论是使用参数依然选择壹些变量都到AO上找。

看七个例证:

var age = 18;
function foo(){
  console.log(age);
  var age = 22;
  console.log(age);
}
foo();  // 问:执行foo()之后的结果是?

第二题:

var age = 18;
function foo(){
  console.log(age);
  var age = 22;
  console.log(age);
  function age(){
    console.log("呵呵");
  }
  console.log(age);
}
foo();  // 执行后的结果是?

4858美高梅 504858美高梅 51

词法分析过程:
1、分析参数,有一个参数,形成一个 AO.age=undefine;
2、分析变量声明,有一个 var age, 发现 AO 上面已经有一个 AO.age,因此不做任何处理
3、分析函数声明,有一个 function age(){...} 声明, 则把原有的 age 覆盖成 AO.age=function(){...};

最终,AO上的属性只有一个age,并且值为一个函数声明

执行过程:
注意:执行过程中所有的值都是从AO对象上去寻找

1、执行第一个 console.log(age) 时,此时的 AO.age 是一个函数,所以第一个输出的一个函数
2、这句 var age=22; 是对 AO.age 的属性赋值, 此时AO.age=22 ,所以在第二个输出的是 2
3、同理第三个输出的还是22, 因为中间再没有改变age值的语句了

答案解析

作用域

首先在函数内部查找变量,找不到则到外围函数查找,稳步找到最外层。

多少个例子:

1.

4858美高梅 52

var city = "BeiJing";
function f() {
  var city = "ShangHai";
  function inner(){
    var city = "ShenZhen";
    console.log(city);
  }
  inner();
}

f();  //输出结果是?

4858美高梅 53

2.

4858美高梅 54

var city = "BeiJing";
function Bar() {
  console.log(city);
}
function f() {
  var city = "ShangHai";
  return Bar;
}
var ret = f();
ret();  // 打印结果是?

4858美高梅 55

3.闭包

4858美高梅 56

var city = "BeiJing";
function f(){
    var city = "ShangHai";
    function inner(){
        console.log(city);
    }
    return inner;
}
var ret = f();
ret();

4858美高梅 57

e、RegExp对象

4858美高梅 584858美高梅 59

//RegExp对象

//创建正则对象方式1
// 参数1 正则表达式(不能有空格)
// 参数2 匹配模式:常用g(全局匹配;找到所有匹配,而不是在第一个匹配后停止)和i(忽略大小写)

// 用户名只能是英文字母、数字和_,并且首字母必须是英文字母。长度最短不能少于6位 最长不能超过12位。

// 创建RegExp对象方式(逗号后面不要加空格)
var reg1 = new RegExp("^[a-zA-Z][a-zA-Z0-9_]{5,11}$");

// 匹配响应的字符串
var s1 = "bc123";

//RegExp对象的test方法,测试一个字符串是否符合对应的正则规则,返回值是true或false。
reg1.test(s1);  // true

// 创建方式2
// /填写正则表达式/匹配模式(逗号后面不要加空格)
var reg2 = /^[a-zA-Z][a-zA-Z0-9_]{5,11}$/;

reg2.test(s1);  // true


// String对象与正则结合的4个方法
var s2 = "hello world";

s2.match(/o/g);         // ["o", "o"]             查找字符串中 符合正则 的内容
s2.search(/h/g);        // 0                      查找字符串中符合正则表达式的内容位置
s2.split(/o/g);         // ["hell", " w", "rld"]  按照正则表达式对字符串进行切割
s2.replace(/o/g, "s");  // "hells wsrld"          对字符串按照正则进行替换

// 关于匹配模式:g和i的简单示例
var s1 = "name:Alex age:18";

s1.replace(/a/, "哈哈哈");      // "n哈哈哈me:Alex age:18"
s1.replace(/a/g, "哈哈哈");     // "n哈哈哈me:Alex 哈哈哈ge:18"      全局匹配
s1.replace(/a/gi, "哈哈哈");    // "n哈哈哈me:哈哈哈lex 哈哈哈ge:18"  不区分大小写


// 注意事项1:
// 如果regExpObject带有全局标志g,test()函数不是从字符串的开头开始查找,而是从属性regExpObject.lastIndex所指定的索引处开始查找。
// 该属性值默认为0,所以第一次仍然是从字符串的开头查找。
// 当找到一个匹配时,test()函数会将regExpObject.lastIndex的值改为字符串中本次匹配内容的最后一个字符的下一个索引位置。
// 当再次执行test()函数时,将会从该索引位置处开始查找,从而找到下一个匹配。
// 因此,当我们使用test()函数执行了一次匹配之后,如果想要重新使用test()函数从头开始查找,则需要手动将regExpObject.lastIndex的值重置为 0。
// 如果test()函数再也找不到可以匹配的文本时,该函数会自动把regExpObject.lastIndex属性重置为 0。

var reg3 = /foo/g;
// 此时 regex.lastIndex=0
reg3.test('foo'); // 返回true
// 此时 regex.lastIndex=3
reg3.test('xxxfoo'); // 还是返回true
// 所以我们在使用test()方法校验一个字符串是否完全匹配时,一定要加上^和$符号。

// 注意事项2(说出来你可能不信系列):
// 当我们不加参数调用RegExpObj.test()方法时, 相当于执行RegExpObj.test("undefined"), 并且/undefined/.test()默认返回true。
var reg4 = /^undefined$/;
reg4.test(); // 返回true
reg4.test(undefined); // 返回true
reg4.test("undefined"); // 返回true

RegExp相关

RegExp对象

 

作用域

第1在函数内部查找变量,找不到则到外围函数查找,稳步找到最外层。

多少个例证:

1.

4858美高梅 60

var city = "BeiJing";
function f() {
  var city = "ShangHai";
  function inner(){
    var city = "ShenZhen";
    console.log(city);
  }
  inner();
}

f();  //输出结果是?

4858美高梅 61

2.

4858美高梅 62

var city = "BeiJing";
function Bar() {
  console.log(city);
}
function f() {
  var city = "ShangHai";
  return Bar;
}
var ret = f();
ret();  // 打印结果是?

4858美高梅 63

3.闭包

4858美高梅 64

var city = "BeiJing";
function f(){
    var city = "ShangHai";
    function inner(){
        console.log(city);
    }
    return inner;
}
var ret = f();
ret();

4858美高梅 65

拾、内置对象和格局

JavaScript中的全体东西都以目的:字符串、数字、数组、日期,等等。在JavaScript中,对象是富有属性和艺术的数额。

咱俩在攻读为主数据类型的时候已经带我们理解了,JavaScript中的Number对象、String对象、Array对象等。

注意var s1 = “abc”和var s2 = new String(“abc”)的区别:typeof s1 –>
string而 typeof s2 –> Object

4858美高梅 66

自定义对象

JavaScript的靶子(Object)本质上是键值对的聚集(Hash结构),不过只可以用字符串作为键。

var a = {"name": "duoduo", "age": 18};
console.log(a.name);
console.log(a["age"]);

遍历对象中的内容:

var a = {"name": "duoduo", "age": 18};
for (var i in a){
  console.log(i, a[i]);
}

成立对象:

var person=new Object();  // 创建一个person对象
person.name="duoduo";  // person对象的name属性
person.age=18;  // person对象的age属性

注意:

ES陆中提供了Map数据结构。它相仿于对象,也是键值对的会合,然而“键”的界定不防止字符串,各连串型的值(包罗对象)都得以当做键。

也正是说,Object结构提供了“字符串–值”的附和,Map结构提供了“值–值”的呼应,是一种更周到的Hash结构完成。

4858美高梅 674858美高梅 68

var m = new Map();
var o = {p: "Hello World"}

m.set(o, "content"}
m.get(o)  // "content"

m.has(o)  // true
m.delete(o)  // true
m.has(o) // false

map

 扩展:

4858美高梅 694858美高梅 70

// 父类构造函数
var Car = function (loc) {
  this.loc = loc;
};

// 父类方法
Car.prototype.move = function () {
  this.loc ++;
};

// 子类构造函数
var Van = function (loc) {
  Car.call(this, loc);
};

// 继承父类的方法
Van.prototype = Object.create(Car.prototype);
// 修复 constructor
Van.prototype.constructor = Van;
// 扩展方法
Van.prototype.grab = function () {
  /* ... */
};

JavaScript面向对象之继续

词法分析(尝试驾驭)

JavaScript中在调用函数的那弹指间,会先进行词法分析。

词法分析的长河:

当函数调用的前1须臾间,会先形成二个激活对象:Avtive
Object(AO),并会分析以下2个方面:

一:函数参数,借使有,则将此参数赋值给AO,且值为undefined。即使未有,则不做别的操作。
二:函数局地变量,借使AO上有同名的值,则不做任何操作。倘使未有,则将此变量赋值给AO,并且值为undefined。
叁:函数评释,倘若AO上有,则会将AO上的靶子覆盖。假设未有,则不做其余操作。

函数内部无论是使用参数照旧选取一些变量都到AO上找。

看多少个例证:

4858美高梅 71

var age = 18;
function foo(){
  console.log(age);
  var age = 22;
  console.log(age);
}
foo();  // 问:执行foo()之后的结果是?

4858美高梅 72

 

第二题:

4858美高梅 73

var age = 18;
function foo(){
  console.log(age);
  var age = 22;
  console.log(age);
  function age(){
    console.log("呵呵");
  }
  console.log(age);
}
foo();  // 执行后的结果是?

 

4858美高梅 744858美高梅 75

1、分析参数,有一个参数,形成一个 AO.age=undefine;
2、分析变量声明,有一个 var age, 发现 AO 上面已经有一个 AO.age,因此不做任何处理
3、分析函数声明,有一个 function age(){...} 声明, 则把原有的 age 覆盖成 AO.age=function(){...};

最终,AO上的属性只有一个age,并且值为一个函数声明

执行过程:
注意:执行过程中所有的值都是从AO对象上去寻找

1、执行第一个 console.log(age) 时,此时的 AO.age 是一个函数,所以第一个输出的一个函数
2、这句 var age=22; 是对 AO.age 的属性赋值, 此时AO.age=22 ,所以在第二个输出的是 2
3、同理第三个输出的还是22, 因为中间再没有改变age值的语句了

答案解析

 

词法分析(尝试领会)

JavaScript中在调用函数的那眨眼之间间,会先进行词法分析。

词法分析的历程:

当函数调用的前1弹指间,会先形成四个激活对象:Avtive
Object(AO),并会分析以下二个地点:

一:函数参数,如果有,则将此参数赋值给AO,且值为undefined。假设未有,则不做其它操作。
二:函数局地变量,假如AO上有同名的值,则不做别的操作。假设未有,则将此变量赋值给AO,并且值为undefined。
三:函数评释,如若AO上有,则会将AO上的靶子覆盖。如若未有,则不做其余操作。

函数内部无论是使用参数依旧使用部分变量都到AO上找。

看五个例证:

4858美高梅 76

var age = 18;
function foo(){
  console.log(age);
  var age = 22;
  console.log(age);
}
foo();  // 问:执行foo()之后的结果是?

4858美高梅 77

 第二题:

4858美高梅 78

var age = 18;
function foo(){
  console.log(age);
  var age = 22;
  console.log(age);
  function age(){
    console.log("呵呵");
  }
  console.log(age);
}
foo();  // 执行后的结果是?

4858美高梅 79

4858美高梅 804858美高梅 81

词法分析过程:
1、分析参数,有一个参数,形成一个 AO.age=undefine;
2、分析变量声明,有一个 var age, 发现 AO 上面已经有一个 AO.age,因此不做任何处理
3、分析函数声明,有一个 function age(){...} 声明, 则把原有的 age 覆盖成 AO.age=function(){...};

最终,AO上的属性只有一个age,并且值为一个函数声明

执行过程:
注意:执行过程中所有的值都是从AO对象上去寻找

1、执行第一个 console.log(age) 时,此时的 AO.age 是一个函数,所以第一个输出的一个函数
2、这句 var age=22; 是对 AO.age 的属性赋值, 此时AO.age=22 ,所以在第二个输出的是 2
3、同理第三个输出的还是22, 因为中间再没有改变age值的语句了

答案解析

 

2、Date对象

创建Date对象

//方法1:不指定参数
var d1 = new Date();
console.log(d1.toLocaleString());
//方法2:参数为日期字符串
var d2 = new Date("2004/3/20 11:12");
console.log(d2.toLocaleString());
var d3 = new Date("04/03/20 11:12");
console.log(d3.toLocaleString());
//方法3:参数为毫秒数
var d3 = new Date(5000);
console.log(d3.toLocaleString());
console.log(d3.toUTCString());

//方法4:参数为年月日小时分钟秒毫秒
var d4 = new Date(2004,2,20,11,12,0,300);
console.log(d4.toLocaleString());  //毫秒并不直接显示

Date对象的主意:

var d = new Date(); 
//getDate()                 获取日
//getDay ()                 获取星期
//getMonth ()               获取月(0-11)
//getFullYear ()            获取完整年份
//getYear ()                获取年
//getHours ()               获取小时
//getMinutes ()             获取分钟
//getSeconds ()             获取秒
//getMilliseconds ()        获取毫秒
//getTime ()                返回累计毫秒数(从1970/1/1午夜)

详见Date对象方法:点我

嵌入对象和艺术

JavaScript中的全数东西都以目的:字符串、数字、数组、日期,等等。在JavaScript中,对象是兼具属性和措施的多少。

我们在学习为主数据类型的时候曾经带我们理解了,JavaScript中的Number对象、String对象、Array对象等。

注意var s1 = “abc”和var s2 = new String(“abc”)的区别:typeof s1 –>
string而 typeof s2 –> Object

4858美高梅 82

内置对象和方式

JavaScript中的全数东西都以指标:字符串、数字、数组、日期,等等。在JavaScript中,对象是有着属性和艺术的数额。

大家在学习为主数据类型的时候曾经带我们了然了,JavaScript中的Number对象、String对象、Array对象等。

注意var s1 = “abc”和var s2 = new String(“abc”)的区别:typeof s1 –>
string而 typeof s2 –> Object

4858美高梅 83

3、JSON对象

var str1 = '{"name": "duoduo", "age": 18}';
var obj1 = {"name": "duoduo", "age": 18};
// JSON字符串转换成对象
var obj = JSON.parse(str1); 
// 对象转换成JSON字符串
var str = JSON.stringify(obj1);

自定义对象

JavaScript的对象(Object)本质上是键值对的聚集(Hash结构),可是只可以用字符串作为键。

var a = {"name": "Alex", "age": 18};
console.log(a.name);
console.log(a["age"]);

遍历对象中的内容:

var a = {"name": "Alex", "age": 18};
for (var i in a){
  console.log(i, a[i]);
}

业务并未有那么简单…

 

创造对象:

var person=new Object();  // 创建一个person对象
person.name="Alex";  // person对象的name属性
person.age=18;  // person对象的age属性

注意:

ES陆中提供了Map数据结构。它好像于对象,也是键值对的汇聚,不过“键”的限定不幸免字符串,各种类型的值(包罗对象)都得以当做键。

也等于说,Object结构提供了“字符串–值”的照应,Map结构提供了“值–值”的应和,是1种更完美的Hash结构达成。

4858美高梅 844858美高梅 85

var m = new Map();
var o = {p: "Hello World"}

m.set(o, "content"}
m.get(o)  // "content"

m.has(o)  // true
m.delete(o)  // true
m.has(o) // false

map

扩展:

4858美高梅 864858美高梅 87

// 父类构造函数
var Car = function (loc) {
  this.loc = loc;
};

// 父类方法
Car.prototype.move = function () {
  this.loc ++;
};

// 子类构造函数
var Van = function (loc) {
  Car.call(this, loc);
};

// 继承父类的方法
Van.prototype = Object.create(Car.prototype);
// 修复 constructor
Van.prototype.constructor = Van;
// 扩展方法
Van.prototype.grab = function () {
  /* ... */
};

javascript面向对象之继续

自定义对象

JavaScript的指标(Object)本质上是键值对的聚众(Hash结构),但是只可以用字符串作为键。

var a = {"name": "Alex", "age": 18};
console.log(a.name);
console.log(a["age"]);

遍历对象中的内容:

var a = {"name": "Alex", "age": 18};
for (var i in a){
  console.log(i, a[i]);
}

事务并未那么简单…

创立对象:

var person=new Object();  // 创建一个person对象
person.name="Alex";  // person对象的name属性
person.age=18;  // person对象的age属性

注意:

ES陆中提供了Map数据结构。它好像于对象,也是键值对的联谊,不过“键”的限定不压制字符串,各种类型的值(包罗对象)都足以当做键。

也正是说,Object结构提供了“字符串–值”的应和,Map结构提供了“值–值”的对应,是壹种更全面包车型大巴Hash结构达成。

4858美高梅 884858美高梅 89

var m = new Map();
var o = {p: "Hello World"}

m.set(o, "content"}
m.get(o)  // "content"

m.has(o)  // true
m.delete(o)  // true
m.has(o) // false

map

 

 扩展:

4858美高梅 904858美高梅 91

// 父类构造函数
var Car = function (loc) {
  this.loc = loc;
};

// 父类方法
Car.prototype.move = function () {
  this.loc ++;
};

// 子类构造函数
var Van = function (loc) {
  Car.call(this, loc);
};

// 继承父类的方法
Van.prototype = Object.create(Car.prototype);
// 修复 constructor
Van.prototype.constructor = Van;
// 扩展方法
Van.prototype.grab = function () {
  /* ... */
};

JavaScript面向对象之继续

 

4、RegExp对象

4858美高梅 924858美高梅 93

//RegExp对象

//创建正则对象方式1
// 参数1 正则表达式(不能有空格)
// 参数2 匹配模式:常用g(全局匹配;找到所有匹配,而不是在第一个匹配后停止)和i(忽略大小写)

// 用户名只能是英文字母、数字和_,并且首字母必须是英文字母。长度最短不能少于6位 最长不能超过12位。

// 创建RegExp对象方式(逗号后面不要加空格)
var reg1 = new RegExp("^[a-zA-Z][a-zA-Z0-9_]{5,11}$");

// 匹配响应的字符串
var s1 = "bc123";

//RegExp对象的test方法,测试一个字符串是否符合对应的正则规则,返回值是true或false。
reg1.test(s1);  // true

// 创建方式2
// /填写正则表达式/匹配模式(逗号后面不要加空格)
var reg2 = /^[a-zA-Z][a-zA-Z0-9_]{5,11}$/;

reg2.test(s1);  // true


// String对象与正则结合的4个方法
var s2 = "hello world";

s2.match(/o/g);         // ["o", "o"]             查找字符串中 符合正则 的内容
s2.search(/h/g);        // 0                      查找字符串中符合正则表达式的内容位置
s2.split(/o/g);         // ["hell", " w", "rld"]  按照正则表达式对字符串进行切割
s2.replace(/o/g, "s");  // "hells wsrld"          对字符串按照正则进行替换

// 关于匹配模式:g和i的简单示例
var s1 = "name:duoduo age:18";

s1.replace(/a/, "哈哈哈");      // "n哈哈哈me:duoduo age:18"
s1.replace(/a/g, "哈哈哈");     // "n哈哈哈me:duoduo 哈哈哈ge:18"      全局匹配
s1.replace(/a/gi, "哈哈哈");    // "n哈哈哈me:duoduo 哈哈哈ge:18"  不区分大小写


// 注意事项1:
// 如果regExpObject带有全局标志g,test()函数不是从字符串的开头开始查找,而是从属性regExpObject.lastIndex所指定的索引处开始查找。
// 该属性值默认为0,所以第一次仍然是从字符串的开头查找。
// 当找到一个匹配时,test()函数会将regExpObject.lastIndex的值改为字符串中本次匹配内容的最后一个字符的下一个索引位置。
// 当再次执行test()函数时,将会从该索引位置处开始查找,从而找到下一个匹配。
// 因此,当我们使用test()函数执行了一次匹配之后,如果想要重新使用test()函数从头开始查找,则需要手动将regExpObject.lastIndex的值重置为 0。
// 如果test()函数再也找不到可以匹配的文本时,该函数会自动把regExpObject.lastIndex属性重置为 0。

var reg3 = /foo/g;
// 此时 regex.lastIndex=0
reg3.test('foo'); // 返回true
// 此时 regex.lastIndex=3
reg3.test('xxxfoo'); // 还是返回true
// 所以我们在使用test()方法校验一个字符串是否完全匹配时,一定要加上^和$符号。

// 注意事项2(说出来你可能不信系列):
// 当我们不加参数调用RegExpObj.test()方法时, 相当于执行RegExpObj.test("undefined"), 并且/undefined/.test()默认返回true。
var reg4 = /^undefined$/;
reg4.test(); // 返回true
reg4.test(undefined); // 返回true
reg4.test("undefined"); // 返回true

RegExp相关

推而广之阅读

Date对象

创建Date对象

4858美高梅 94

//方法1:不指定参数
var d1 = new Date();
console.log(d1.toLocaleString());
//方法2:参数为日期字符串
var d2 = new Date("2004/3/20 11:12");
console.log(d2.toLocaleString());
var d3 = new Date("04/03/20 11:12");
console.log(d3.toLocaleString());
//方法3:参数为毫秒数
var d3 = new Date(5000);
console.log(d3.toLocaleString());
console.log(d3.toUTCString());

//方法4:参数为年月日小时分钟秒毫秒
var d4 = new Date(2004,2,20,11,12,0,300);
console.log(d4.toLocaleString());  //毫秒并不直接显示

4858美高梅 95

Date对象的不2法门:

4858美高梅 96

var d = new Date(); 
//getDate()                 获取日
//getDay ()                 获取星期
//getMonth ()               获取月(0-11)
//getFullYear ()            获取完整年份
//getYear ()                获取年
//getHours ()               获取小时
//getMinutes ()             获取分钟
//getSeconds ()             获取秒
//getMilliseconds ()        获取毫秒
//getTime ()                返回累计毫秒数(从1970/1/1午夜)

4858美高梅 97

练习:

编写代码,将眼今日子按“2017-12-二7 1一:1一 星期三”格式输出。

4858美高梅 984858美高梅 99

var d = new Date();
var YEAR = d.getFullYear();
var MONTH = d.getMonth()+1;
var DATE = d.getDate();
var DAY= d.getDay();
var myHOURS = d.getHours();
var MINUTES = d.getMinutes();
switch (DAY) {
    case 1:
        DAY="星期一";
        break;
    case 2:
        DAY="星期二";
        break;
    case 3:
        DAY="星期三";
        break;
    case 4:
        DAY="星期四";
        break;
    case 5:
        DAY="星期五";
        break;
    case 6:
        DAY="星期六";
        break;
    case 7:
        DAY="星期日";
        break;
}
console.log('%s-%s-%s %s-%s %s',YEAR,MONTH,DATE,myHOURS,MINUTES,DAY);

粗糙的

 

4858美高梅 1004858美高梅 101

const WEEKMAP = {
    0:"星期日",
    1:"星期日",
    2:"星期日",
    3:"星期日",
    4:"星期日",
    5:"星期日",
    6:"星期日"
};

function showTime() {
    let d = new Date();
    let YEAR = d.getFullYear();
    let MONTH = d.getMonth()+1;
    let DATE = d.getDate();
    let HOURS = d.getHours();
    let MINUTES = d.getMinutes();
    let WEEKS = WEEKMAP[d.getDay()];
    // 模板字符串拼接
    showContent = `${YEAR}-${MONTH}-${DATE} ${HOURS}:${MINUTES} ${WEEKS}`;
    console.log(showContent);

}
showTime();

光滑的

 

详尽Date对象方法:点我

Date对象

创建Date对象

4858美高梅 102

//方法1:不指定参数
var d1 = new Date();
console.log(d1.toLocaleString());
//方法2:参数为日期字符串
var d2 = new Date("2004/3/20 11:12");
console.log(d2.toLocaleString());
var d3 = new Date("04/03/20 11:12");
console.log(d3.toLocaleString());
//方法3:参数为毫秒数
var d3 = new Date(5000);
console.log(d3.toLocaleString());
console.log(d3.toUTCString());

//方法4:参数为年月日小时分钟秒毫秒
var d4 = new Date(2004,2,20,11,12,0,300);
console.log(d4.toLocaleString());  //毫秒并不直接显示

4858美高梅 103

Date对象的章程:

4858美高梅 104

var d = new Date(); 
//getDate()                 获取日
//getDay ()                 获取星期
//getMonth ()               获取月(0-11)
//getFullYear ()            获取完整年份
//getYear ()                获取年
//getHours ()               获取小时
//getMinutes ()             获取分钟
//getSeconds ()             获取秒
//getMilliseconds ()        获取毫秒
//getTime ()                返回累计毫秒数(从1970/1/1午夜)

4858美高梅 105

练习:

编排代码,将日前几日子按“2017-1贰-二7 1壹:11 周四”格式输出。

详细Date对象方法:
]()

5、Math对象

4858美高梅 1064858美高梅 107

abs(x)      返回数的绝对值。
exp(x)      返回 e 的指数。
floor(x)    对数进行下舍入。
log(x)      返回数的自然对数(底为e)。
max(x,y)    返回 x 和 y 中的最高值。
min(x,y)    返回 x 和 y 中的最低值。
pow(x,y)    返回 x 的 y 次幂。
random()    返回 0 ~ 1 之间的随机数。
round(x)    把数四舍五入为最接近的整数。
sin(x)      返回数的正弦。
sqrt(x)     返回数的平方根。
tan(x)      返回角的正切。

Math

JSON对象

var str1 = '{"name": "Alex", "age": 18}';
var obj1 = {"name": "Alex", "age": 18};
// JSON字符串转换成对象
var obj = JSON.parse(str1); 
// 对象转换成JSON字符串
var str = JSON.stringify(obj1);

JSON对象

4858美高梅 108

var str1 = '{"name": "Alex", "age": 18}';
var obj1 = {"name": "Alex", "age": 18};
// JSON字符串转换成对象
var obj = JSON.parse(str1); 
// 对象转换成JSON字符串
var str = JSON.stringify(obj1);

4858美高梅 109

RegExp对象

完整表达,请移步至此>传送门<

//RegExp对象

//创建正则对象方式1
// 参数1 正则表达式(不能有空格)
// 参数2 匹配模式:常用g(全局匹配;找到所有匹配,而不是在第一个匹配后停止)和i(忽略大小写)

// 用户名只能是英文字母、数字和_,并且首字母必须是英文字母。长度最短不能少于6位 最长不能超过12位。

// 创建RegExp对象方式(逗号后面不要加空格)
var reg1 = new RegExp("^[a-zA-Z][a-zA-Z0-9_]{5,11}$");

// 匹配响应的字符串
var s1 = "bc123";

//RegExp对象的test方法,测试一个字符串是否符合对应的正则规则,返回值是true或false。
reg1.test(s1);  // true

// 创建方式2
// /填写正则表达式/匹配模式(逗号后面不要加空格)
var reg2 = /^[a-zA-Z][a-zA-Z0-9_]{5,11}$/;

reg2.test(s1);  // true


// String对象与正则结合的4个方法
var s2 = "hello world";

s2.match(/o/g);         // ["o", "o"]             查找字符串中 符合正则 的内容
s2.search(/h/g);        // 0                      查找字符串中符合正则表达式的内容位置
s2.split(/o/g);         // ["hell", " w", "rld"]  按照正则表达式对字符串进行切割
s2.replace(/o/g, "s");  // "hells wsrld"          对字符串按照正则进行替换

// 关于匹配模式:g和i的简单示例
var s1 = "name:Alex age:18";

s1.replace(/a/, "哈哈哈");      // "n哈哈哈me:Alex age:18"
s1.replace(/a/g, "哈哈哈");     // "n哈哈哈me:Alex 哈哈哈ge:18"      全局匹配
s1.replace(/a/gi, "哈哈哈");    // "n哈哈哈me:哈哈哈lex 哈哈哈ge:18"  不区分大小写


// 注意事项1:
// 如果regExpObject带有全局标志g,test()函数不是从字符串的开头开始查找,而是从属性regExpObject.lastIndex所指定的索引处开始查找。
// 该属性值默认为0,所以第一次仍然是从字符串的开头查找。
// 当找到一个匹配时,test()函数会将regExpObject.lastIndex的值改为字符串中本次匹配内容的最后一个字符的下一个索引位置。
// 当再次执行test()函数时,将会从该索引位置处开始查找,从而找到下一个匹配。
// 因此,当我们使用test()函数执行了一次匹配之后,如果想要重新使用test()函数从头开始查找,则需要手动将regExpObject.lastIndex的值重置为 0。
// 如果test()函数再也找不到可以匹配的文本时,该函数会自动把regExpObject.lastIndex属性重置为 0。

var reg3 = /foo/g;
// 此时 regex.lastIndex=0
reg3.test('foo'); // 返回true
// 此时 regex.lastIndex=3
reg3.test('xxxfoo'); // 还是返回true
// 所以我们在使用test()方法校验一个字符串是否完全匹配时,一定要加上^和$符号。

// 注意事项2(说出来你可能不信系列):
// 当我们不加参数调用RegExpObj.test()方法时, 相当于执行RegExpObj.test("undefined"), 并且/undefined/.test()默认返回true。
var reg4 = /^undefined$/;
reg4.test(); // 返回true
reg4.test(undefined); // 返回true
reg4.test("undefined"); // 返回true

 4858美高梅 110

 

 

RegExp对象

4858美高梅 1114858美高梅 112

//RegExp对象

//创建正则对象方式1
// 参数1 正则表达式(不能有空格)
// 参数2 匹配模式:常用g(全局匹配;找到所有匹配,而不是在第一个匹配后停止)和i(忽略大小写)

// 用户名只能是英文字母、数字和_,并且首字母必须是英文字母。长度最短不能少于6位 最长不能超过12位。

// 创建RegExp对象方式(逗号后面不要加空格)
var reg1 = new RegExp("^[a-zA-Z][a-zA-Z0-9_]{5,11}$");

// 匹配响应的字符串
var s1 = "bc123";

//RegExp对象的test方法,测试一个字符串是否符合对应的正则规则,返回值是true或false。
reg1.test(s1);  // true

// 创建方式2
// /填写正则表达式/匹配模式(逗号后面不要加空格)
var reg2 = /^[a-zA-Z][a-zA-Z0-9_]{5,11}$/;

reg2.test(s1);  // true


// String对象与正则结合的4个方法
var s2 = "hello world";

s2.match(/o/g);         // ["o", "o"]             查找字符串中 符合正则 的内容
s2.search(/h/g);        // 0                      查找字符串中符合正则表达式的内容位置
s2.split(/o/g);         // ["hell", " w", "rld"]  按照正则表达式对字符串进行切割
s2.replace(/o/g, "s");  // "hells wsrld"          对字符串按照正则进行替换

// 关于匹配模式:g和i的简单示例
var s1 = "name:Alex age:18";

s1.replace(/a/, "哈哈哈");      // "n哈哈哈me:Alex age:18"
s1.replace(/a/g, "哈哈哈");     // "n哈哈哈me:Alex 哈哈哈ge:18"      全局匹配
s1.replace(/a/gi, "哈哈哈");    // "n哈哈哈me:哈哈哈lex 哈哈哈ge:18"  不区分大小写


// 注意事项1:
// 如果regExpObject带有全局标志g,test()函数不是从字符串的开头开始查找,而是从属性regExpObject.lastIndex所指定的索引处开始查找。
// 该属性值默认为0,所以第一次仍然是从字符串的开头查找。
// 当找到一个匹配时,test()函数会将regExpObject.lastIndex的值改为字符串中本次匹配内容的最后一个字符的下一个索引位置。
// 当再次执行test()函数时,将会从该索引位置处开始查找,从而找到下一个匹配。
// 因此,当我们使用test()函数执行了一次匹配之后,如果想要重新使用test()函数从头开始查找,则需要手动将regExpObject.lastIndex的值重置为 0。
// 如果test()函数再也找不到可以匹配的文本时,该函数会自动把regExpObject.lastIndex属性重置为 0。

var reg3 = /foo/g;
// 此时 regex.lastIndex=0
reg3.test('foo'); // 返回true
// 此时 regex.lastIndex=3
reg3.test('xxxfoo'); // 还是返回true
// 所以我们在使用test()方法校验一个字符串是否完全匹配时,一定要加上^和$符号。

// 注意事项2(说出来你可能不信系列):
// 当我们不加参数调用RegExpObj.test()方法时, 相当于执行RegExpObj.test("undefined"), 并且/undefined/.test()默认返回true。
var reg4 = /^undefined$/;
reg4.test(); // 返回true
reg4.test(undefined); // 返回true
reg4.test("undefined"); // 返回true

RegExp相关

 

Math对象

abs(x)      返回数的绝对值。
exp(x)      返回 e 的指数。
floor(x)    对数进行下舍入。
log(x)      返回数的自然对数(底为e)。
max(x,y)    返回 x 和 y 中的最高值。
min(x,y)    返回 x 和 y 中的最低值。
pow(x,y)    返回 x 的 y 次幂。
random()    返回 0 ~ 1 之间的随机数。
round(x)    把数四舍五入为最接近的整数。
sin(x)      返回数的正弦。
sqrt(x)     返回数的平方根。
tan(x)      返回角的正切。

 重回随机数的演示:

4858美高梅 113

 

(完)

Math对象

4858美高梅 1144858美高梅 115

abs(x)      返回数的绝对值。
exp(x)      返回 e 的指数。
floor(x)    对数进行下舍入。
log(x)      返回数的自然对数(底为e)。
max(x,y)    返回 x 和 y 中的最高值。
min(x,y)    返回 x 和 y 中的最低值。
pow(x,y)    返回 x 的 y 次幂。
random()    返回 0 ~ 1 之间的随机数。
round(x)    把数四舍五入为最接近的整数。
sin(x)      返回数的正弦。
sqrt(x)     返回数的平方根。
tan(x)      返回角的正切。

Math

 

发表评论

电子邮件地址不会被公开。 必填项已用*标注

网站地图xml地图
Copyright @ 2010-2019 美高梅手机版4858 版权所有