<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title></title>
<link rel="stylesheet" href="">
</head>
<body>
<script type="text/javascript">
function displayInfo(args) {
var output = "";
if (typeof args.name == "string") {
output += "Name:" + args.name + "\n"
}
if (typeof args.age == "number") {
output += "Age:" + args.age + "\n"
}
console.log(output)
}
displayInfo({
name: "Nicholas",
age: 29
})
var person = {
name: "Nicholas",
age: 20
}
// 都是可以访问的啦
person.name
person["age"]
var propertyName = "name"
person[propertyName]
// 除非必须使用变量来访问属性 否则 我们建议使用 点表示法
// 5.2 Array 数组
// 数组的每一项 都可以保存任意类型
// 第一种 使用 Array 构造函数
var colors = new Array()
var colors = new Array(20)
var colors = new Array("red", "blue", "green")
var colors = new Array(3)
var names = new Array("Greg")
var colors = Array(3)
var names = Array("Greg")
// 数组的第二种 数组字面量 表示法
var colors = ['red', 'blue', 'green'] // 创建一个包含3个 字符串的数组
var names = []; // 创建一个 空数组
var values = [1, 2, ] // 不要这样创建
var options = [, , , , , ] // 不要这样创建
var colors = ['red', 'blue', 'green'] // 定义一个字符串数组
colors[0] //显示第一项
colors[2] = "black" // 修改第三项
colors[3] = "brown" // 新增第四项
var colors = ['red', 'blue', 'green'] //创建 一个包含三个字符串数组
colors.length = 2 //
colors[2] // undefined
var colors = ["red", 'blue', 'green']
colors.length = 4
colors[3] // undefined
colors //(4) ["red", "blue", "green", empty]
var colors = ["red", 'blue', 'green'] // 创建一个3个字符串的数组
colors[colors.length] = "black" // 在位置3 添加一种颜色
colors[colors.length] = "brown" //在位置4 添加一种颜色
var colors = ["red", 'blue', 'green'] // 创建三个字符串
colors[99] = "black" //在99 位置上 添加一种颜色
colors.legnth //100
// 检测数组
// 对于网页或者 一个全局作用域而言
if (value instanceof Array) {
// 对数组执行的某些操作
}
if (Array.isArray(value)) {
// 对数组执行某些操作
}
// 转换方法 toLocaleString() toString() valueOf()
var colors = ['red', 'blue', 'green'] // 创建数组
colors.toLocaleString() // "red,blue,green"
colors.toString() // "red,blue,green"
colors.valueOf() // ["red", "blue", "green"]
colors // red,blue,green
var person1 = {
toLocaleString: function() {
return "Nikolaos"
},
toString: function() {
return "Nikolaos"
}
}
var person2 = {
toLocaleString: function() {
return "Grigorios"
},
toString: function() {
return "Greg"
}
}
var people = [person1, person2]
people
people.toString() //"Nikolaos,Greg"
people.toLocaleString() // "Nikolaos,Grigorios"
var colors = ["red", 'green', 'blue']
colors.join(",") // "red,green,blue"
colors.join("||") // "red||green||blue"
// 如果数组中 某一项的值 是null 或者undefined 那么该值 在join,toLocaleString() toString() valueOf()
// 返回的结果以空字符串表示
// 栈方法 last-in-frist-out
var colors = new Array() // 创建一个新数组
var count = colors.push("red", "green") // 推入两项
count // 2
count = colors.push("black") // 推入另一项
count //3 push 返回的是数组的项数
var item = colors.pop()
item //red
colors //["green", "black"]
var colors = ["red", "blue"]
colors.push("brown") // 添加另一项
colors[3] = "black" // 添加一项
colors.length
var item = colors.pop() //取得最后一项
item // blakc
// 队列方法 frist-in-frist-out
var colors = new Array()
var count = colors.push("red", "green")
count //2
colors.push("black")
count // 3
var item = colors.shift() // 取得第一项
item // red
colors //["green", "black"]
var colors = new Array()
var count = colors.unshift("red", "green") // 推入两项
count = colors.unshift("black") // 推入另一项
count //3
var item = colors.pop()
item //green
colors.length // 2
// 数组的重新排序方法 5.2.5 reverse() sort()
var values = [1, 2, 3, 4, 5]
values.reverse()
var values = [0, 1, 5, 10, 15]
values.sort()
values // [0, 1, 10, 15, 5] 进行的是字符串比较
function compare(value1, value2) {
if (value1 < value2) {
return -1
} else if (value1 > value2) {
return 1
} else {
return 0
}
}
var values = [0, 1, 5, 10, 15]
values.sort(compare);
values // [0, 1, 5, 10 ,15]
function compare2(value1, value2) {
if (value1 < value2) {
return 1
} else if (value1 > value2) {
return -1
} else {
return 0
}
}
var values = [0, 1, 5, 10, 15]
values.sort(compare);
values // 15, 10, 5, 1, 0]
// reverse sort 返回值 是经过排序之后的数组
function compare(value1, value2) {
return value2 - value1
}
var values = [0, 1, 5, 10, 15]
values.sort(compare);
values // 15, 10, 5, 1, 0]
// 5.2.6 操作方法 concat slice 不改变原来的数组
var colors = ["red", "green", "blue"]
var colors2 = colors.concat("yellow", ["black", 'brown'])
colors2 // ["red", "green", "blue", "yellow", "black", "brown"]
// splice。不会影响原来的数组
var colors = ["red", "green", "blue", "yellow", "black", "brown"]
var colors2 = colors.slice(1) // ["green", "blue", "yellow", "black", "brown"]
var colors3 = colors.slice(1, 4) // ["green", "blue", "yellow"] 不包含结束位置
// 如果 slice 传入的是一个负数。则用 数组长度 加上该数来确定相应的位置
// splice 插入 删除 和替换
// 删除可以删除任意数量的项 第一个要删除的位置 第二个要删除的项目
// 插入 可以向指定位置插入 任意数量的项 提供三个参数 参数一 起时位置 参数2 删除的项目 参数3 要要入的项 可以多个
// 替换 可以指定位置 插入任意数量的项 同时删除任意数量的项
// 5.2.7 位置方法 indexOf lastIndexOf() 两个参数 要查找的项 和 查找起点索引的位置
// idnexOf从输入开始的位置向后查找。 lastIndexOf 从数组的末尾开始向前查找
// 这两个方法 返回的查找项在数组中的位置 没有找打的情况下 -1
// 5.2.8 迭代方法 every filter forEach map some
// 每个方法都接受两个参数 要在每一项运行的函数 和运行该函数作用域对象传入这些方法的函数会接受三个参数 数组项的值 该项目数组中的位置 和数组对象本身
// every() 对数组中的每一项运行给定函数 如果该函数每一项都返回true 否则返 false
var numbers = [1, 2, 3, 4, 5, 4, 3, 2, 1]
var everyResult = numbers.every(function(item, index, array) {
return (item > 2)
})
// some() 对数组没有项运行给定函数 ,如果该函数对任意一项返回true 则返回true
var someResult = numbers.some(function(item, index, array) {
console.log(item)
return (item > 2)
})
// filter 对数组每一项运行给定函数, 返回该函数返回true 的项目组成的数组
var filterResult = numbers.filter(function(item, index, array) {
console.log(item)
return item > 2
})
filterResult // [3, 4, 5, 4, 3]
// map 对每一项运行给定函数 ,返回每次函数调用的结果 组成的数组
var mapResult = numbers.map(function(item, index, array) {
return item * 2;
})
mapResult // [2, 4, 6, 8, 10, 8, 6, 4, 2]
// forEach() 对数组每一项运行给定函数 这个方法没有返回值
numbers.forEach(function(item, index, array) {
alert(item) // 执行某些操作
})
// 5.2.9 归并方法 reduce 和 reduceRight 这两个方法都会迭代数组中的所有项 然后构建一个最中要返回的值
// reduce 从数组第一项 到最后一项。 reduceRight 从数组最后一项 到第一项
// 都接受两个参数。一个在每一项 调用的函数和(可选) 作为归纳并基础的初始值
// 函数的接受四个参数。前一个值 当前值 项的索引 和 数组对象
var values = [1, 2, 3]
var sum = values.reduce(function(prev, cur, index, array) {
return prev + cur
}, 1)
sum // 7
// 5.3 data 类型
var now = new Date()
now // Tue Jan 16 2018 14:16:27 GMT+0800 (CST)
// 特定的日期创建 日期对象
Date.parse() Date.UTC()
// 创建 2004 年 5月 25 日 创建一个日期对象
var someDate = new Date(Date.parse('May 25, 2004'))
var someDate = new Date("May 25, 2004")
// Date.UTC() 同样返回日期的毫秒数 参数分别是年份 月份 那一天 时 分 秒 以及 毫秒数 其中 年份和月份是必须的
// GMT 时间 2000 年 1月 1 日 午夜零时
var y2k = new Date(Date.UTC(2000, 0))
//GMT 时间 2005 年5月 5 日 下午 5:55:55
var allFives = new Date(Date.UTC(2005, 4, 5, 17, 55, 55))
allFives // Fri May 06 2005 01:55:55 GMT+0800 (CST)
// 本地时间。2005 年5月 5 日 下午 5:55:55
var allFives = new Date(2005, 4, 5, 17, 55, 55)
allFives //Thu May 05 2005 17:55:55 GMT+0800 (CST)
// ECMAScript5 新增 Date.now() 表示调用这个方法时候的 日期和毫秒数
// 取得开始的时间
var startTime = Date.now()
startTime // 1516084719045 返回的是毫秒数
// 不支持的的情况下 请使用 +操作获取Date对象的时间戳
// 取得开始的时间
var start = +new Date();
// 5.3.1 继承的方法
// 5.4 RegExp 类型
var expression = /pattern/
flags
// 匹配字符串中 所有“at” 的实例
var pattern = /at/g
// 匹配 第一个 “bat”或者 “bac” 不区分大小写
var pattern = /[bc]at/i
// 匹配所有以 at 结尾的是那个字符的组合 不区分大小写
var pattern = /.at/gi
// 匹配第一个 “bat” 或者“cat” 不区分大小写
var pattern = /[bc]at/i
// 所有元字符 搜必须转移 正则表达式中的元字符。有
({
[\ ^ $ | ? * +.]
}
// 匹配 第一个 [ac]at 不区分大小写
var pettern = /\[ac\]at/
// 匹配所有 以“at” 结尾 的3个字符的组合 不区分 大小写
var pettern = /.at/gi
// 匹配所有以 ".at" 结尾不区分大小写
var pettern = /\.at/i
// 以上是通过 字面量 来定义正则表达式。下面通过 构造函数 定义正则表达式
// 匹配第一个 “bat”或者“cat” 不区分大小写
var pattern = /[[bc]at]/i
var pattern = new RegExp("[bc]at", "i")
// 使用正则表达式 字面量 和使用REgExp 构造函数创建的正则表达式不一样。
// 字面量 始终共享 同一个RegExp实例。 而使用构造函数 创建每一个RegExp 实例
var re = null, i;
for (var i = 0; i < 10; i++) {
re = /cat/gi
re.test("catastrophe")
}
for (var i = 0; i < 10; i++) {
re = new RegExp("cat", "g")
re.test("catastrophe")
}
// RegExp 实例方法
var str = "mom and dad and baby"
var pattern = /mom( and dad( and baby)?)?/gi
pattern.exec(str)
// ["mom and dad and baby", " and dad and baby", " and baby", index: 0, input: "mom and dad and baby"]
var str = "cat, bat, sat, fat"
var pattern = /.at/
var pattern2 = /.at/g
pattern.exec(str) // ["cat", index: 0, input: "cat, bat, sat, fat"]
pattern2.exec(str) //
// 如果没有g 值返回
// 正则表达式 的第二个方法 test()
var text = "000-00-0000"
var pattern = /\d{3}-\d{2}-\d{4}/
if (pattern.test(text)) {
console.log("The pattern was matched")
}
// RegExp 实例 继承toLocaleString 和toString 方法 都会返回正则表达式字面量
var pattern = new RegExp("\\[bc\\]at", "gi")
pattern.toString() pattern.toLocaleString()
// RegExp 构造函数属性
var text = "this has been a short summer";
var pattern = /(.)hort/g
if (pattern.test(text)) {
alert(RegExp.input) //this has been a short summer
alert(RegExp.leftContent)
alert(RegExp.rightContent)
alert(RegExp.lastMatch) //short
alert(RegExp.lastParen) //s
alert(RegExp.multiline)
}
if (pattern.test(text)) {
alert(RegExp.$_) //this has been a short summer
alert(RegExp["$`"]) //this has been a
alert(RegExp["$&"]) //short
alert(RegExp["$+"]) //s
alert(RegExp["$*"]) //undefined
}
var text = "this has been a short summer"
var pattern = /(..)or(.)/g
if (pattern.test(text)) {
alert(RegExp.$1) //sh
alert(RegExp.$2) //t
}
// Funcrtion 类型 每个函数都是Function 类型的实例
// 函数声明
function sum(num1, num2) {
return num1 + num2
}
var sum = function(num1, num2) {
return num1 + num2
}
// 构造函数的方式创建函数
var sum = new Function("num1", "num2", "return num1 + num2");
// 函数是对象 函数名是指针 一个函数可以有多个名字
function sum(num1, num2) {
return num1 + num2
}
sum(10, 10) //20
var anotherSum = sum;
anotherSum(10, 10) //20
sun = null
anotherSum(10, 10) // 20
anotherSum.prototype // { constructor: ƒ } constructor: ƒ sum(num1, num2)
// 5.5.1 没有重载 深入理解
function addSomeNumber(num) {
return num + 100
}
function addSomeNumber(num) {
return num + 200
}
// 用预解析解释 非常清楚
var result = addSomeNumber(100) // 300
var assSomeNumber = function(num) {
return num + 100
}
addSomeNumber = function(num) {
return num + 200
}
var result = addSomeNumber(100) //300
// 5.5.2 函数声明式 和函数表达式
// 函数声明式浏览器会进行预解析 函数表达式必须等到解析器执行到它所在的代码 才会真正解释执行
// 作为值的函数
// 函数不仅可以像传参一样把一个函数传递个另一个函数 而且可以将一个函数作为另一个函数的结果返回
function callSomeFunction(SomeFunction, someArgument) {
return SomeFunction(someArgument)
}
function add10(num) {
return num + 10
}
var result = callSomeFunction(add10, 10)
result //20
function getGreeting(name) {
return "hello " + name
}
var result2 = callSomeFunction(getGreeting, "Nicholas")
result2 // hello Nicholas
// 当一个函数中返回另一个函数 也是极为有用的一种技术
function createComparisonFunction(propertyName) {
return function(object1, object2) {
var value1 = object1[propertyName]
var value2 = object2[propertyName]
if (value1 < value2) {
return -1
} else if (value1 > value2) {
return 1
} else {
return 0
}
}
}
var data = [{ name: "Zachary", age: 28 }, { name: 'Nicholas', age: 29 }]
data.sort(createComparisonFunction("name"))
data[0].name // Nicholas
data.sort(createComparisonFunction("age"))
data[0].name // Zachary
// 函数内部属性。arguments this
// argument 是一个类数组的对象包含传入函数的所有参数 但这个参数还有一个名字叫做callee 该属性是一个指针 指向拥有arguents 对象的函数
function factorial(num) {
if (num < 1) {
return 1
} else {
return num * factorial(num - 1)
}
}
function factorial(num) {
if (num < 1) {
return
} else {
return num * arguments.callee(num - 1)
}
}
var trueFactorial = factorial
factorial = function() {
return 0
}
trueFactorial(5) //120
factorial(5) //0
// 函数内部的另一个函数对象 是this
// this 引用的是函数执行的环境对象
window.color = "red"
var o = { color: "blue" }
function sayColor() {
alert(this.color)
}
sayColor() // red
o.sayColor = sayColor
o.sayColor() //blue
// 函数的名字仅仅是一个包含指针的变量而已 因此 全局的sayColor 和 o.sayColor 指向仍然是同一个函数
// ECMAScript 规范化了另一个函数对象属性 caller 保存当前函数的函数的引用 在全局作用域调用当前函数 它的值是null
function outer() {
inner()
}
function inner() {
alert(inner.caller) //function outer() { inner()}
}
outer()
function outer() {
inner()
}
function inner() {
alert(arguments.callee.caller) // function outer() { inner()}
}
// 函数的属性和方法
// 函数也是对象 每个函数都包含两个属性 length prototype length 表示传输传递参数的个数
function sayName(name) {
alert(name)
}
function sum(num1, num2) {
return num1 + num2
}
function sayHi() {
alert("hi")
}
sayName.length //1
sum.length //2
sayHi.length // 0
// 每个函数 都包两个 非法继承来的方法 call apply 用特定的作用域中调用函数 实际上相当于设置函数体内this对象的值
// apply 方法接受两个参数。一个是在其中运行函数的作用域 ,另一个是参数数组 其实第二个可以是Array实例 也可以是arguemnts对象
function sum(num1, num2) {
return num1 + num2
}
function callSum1(num1, num2) {
return sum.apply(this, arguments)
}
function callSum2(num1, num2) {
return sum.apply(this, [num1, num2])
}
callSum1(10, 15) //25
callSum2(10, 15) //25
// 上面的例子中callSum1 在执行sum() 函数传入的this作为this 因为是全局调用的所以是window
// call 和apply 方法的作用相同 第一个this 不变 ,变化的是其余参数都直接传递参数
function sum(num1, num2) {
return num1 + num2
}
function callSum1(num1, num2) {
return sum.call(this, num1, num2)
}
callSum1(10, 10) //20
// 传递参数并非apply 和call 真正的用武之地。它真正强大的地方是 能够扩充函数赖以生存的作用域
window.color = "red";
var o = { color: "blue" }
function sayColor() {
alert(this.color)
}
sayColor.call(this) // red
sayColor.call(window) // red
sayColor.call(o) //blue
// 使用 call apply 来扩充作用域的最大的好处 就是对象和方法 不需要热河耦合关系
// ECMAScript5 还定义个一个方法并bind() 这个方法创建一个函数的实例 其this 值会被绑定要传入的bing()函数的值
window.color = "red"
var o = { color: "blue" }
function sayColor() {
alert(this.color)
}
var objectSayColor = sayColor.bind(o)
objectSayColor() //blue
// 每个函数都会继承 toLocaleString() 和 toString() valueOf() 智慧返回函数代码
// 引用类型 Object Array Function Date RegExp
// 特殊的三个引用类型 也称为包装类型 Boolean String NUmber
var s1 = "some text"
var s2 = s1.substring(2)
// 执行上述代码 过程是。创建String实例 在实例上调用这个方法 销毁这个实例
var s1 = new String("some text")
var s2 = s1.substring(2)
s1.null
// 引用类型和包装类型最主要的区别镀锡那个的生存期 使用new 操作符创建的引用类型的实例 在执行流里来当前作用域之前一只存在 自动创建的包装类型只存在于代码执行的瞬间
var s1 = "some text"
s1.color = "red"
s1.color // undefined
// Object 构造函数也会和工厂方法一样 根据传入的值类型返回相应的基本包装类型实例
var obj = new Object("some text")
obj instanceof String //true
// 传入字符串 返回String 实例 传入数值 返回Number 实例 传入布尔值 返回Boolean 实例
// 要注意 使用new 调用包装类型的构造函 与直接调用同名的转换类型的函数是不一样的
var value = "25"
var number = Number(value) //转换函数
typeof //number
var obj = new Object(value) //构造函数
typeof obj //object
// number 保存基本类型值25 obj 保存的是Number实例
// 5.6.1 Boolean 类型
// 创建 Boolean 对象
var booleanObject = new Boolean(true)
// Boolean 实例重写了 valueOf 方法 返回基本类型 true false , 重写了 toString 返回 字符串"true" "false"
var falseObject = new Boolean(false)
var result = falseObject && true
result //true
var falseValue = false;
result = falseValue && true
// 原因。布尔表达式中所有对戏那个都会被转换为true
// 基本类型 和引用类型 还有两个区别 typeof 基本类型返回 bolean 引用类型返沪object
// Boolean 对象是 Boolean 类型的实例 所以使用 instanceof Boolean 镀锡那个返回true。基本类型 返回false
booleanObject instanceof Boolean // true
falseValue instanceof Boolean //false
// 5.6.2 Number 类型
// 创建 Number 对象
var numberObject = new Object(10)
// Number 类型重写了 valueOf toLocaleString toString valueOf() 返回基本类型数值 其它两个方法 返回字符串数值
// toString 方法 还可以传递一个参数 告诉他返回几进制
var num = 10
num.toString() //10
num.toString(2) // 1010
num.toString(8) // 12
num.toString(16) // a
// 除了继承方法之外Number 类型还提供了 将数值格式化字符串的方法
// toFixed() 方法会按照 指定的小树位返回字符串表示
var num = 10
num.toFixed(2) //10.00
var num = 10.005
num.toFixed(2) // 10.01
// toFixed() 方法表示带有 0-20 个小数 的数值。 这只是规范。浏览器支持更多位数
// 格式化数值的方法toExponential() 该方法 指数的表示发
var num = 10
num.toExponential() // 1e+1
// toPrecision 表示数值最合适的方式
var num = 99
num.toPrecision(1) // 1e+2
num.toPrecision(2) //99
num.toPrecision(3) //99.0
num.toPrecision(4) //99.00
var numberObject = new Number(10)
var numValue = 10
typeof numberObject //object
typeof numValue // number
numberObject instanceof Number //true
numValue instanceof Number //false
// 5.6.3 String 类型
var stringObject = new String("hello world")
// 继承的 valueOf toLocaleString toString 都返回对象 都返回对象所表示的基本字符串值
// 每个String 实例 都有一个length 属性
// 字符方法 用于访问字符串的两个方法 charAt() charCodeAt() 这两个方法 都接受一个参数 charAt方法返回对应数组位置中的字符 charCodeAt 返回数组对应位置上的字符比啊不能编码
var stringValue = "abcA hello world"
stringValue.charAt(1); //b
stringValue.charCodeAt(0) // 97
stringValue.charCodeAt(1) // 98
stringValue.charCodeAt(3) // 65
stringValue[0] // a
// 字符串的操作方法 concat 合并多个数组;合并多个字符串 并且可以接受任意多的参数
var stringValue = "hello "
var result = stringValue.concat("world")
result //hello world
stringValue // hello
// ECMAScript 还基于字符串创建三个操作字符串的方法 slice() substr() substring()
// 都接受一到两个参数。第一个参数 指定字符串开始的位置 第二个字符串 表示字符串到哪里结束
// slice() substring() 第二个参数指定的是 字符串 最后一个字符后面的位置
// substr() 指定返回字符个数
var stringValue = "abcd efghjklmn"
stringValue.slice(3) //d efghjklmn
stringValue.slice(3, 6) // d e
stringValue.substring(3) //d efghjklmn
stringValue.substring(3, 6) //d e
stringValue.substr(3) // d efghjklmn
stringValue.substr(3, 6) // d efgh
// 如果传入的是负数slice() 将会把传入的负数与字符串相加
// substr() 第一个参数负数相加 第二个参数0
// substring 会把所有的负数都转化为 0
var stringValue = "abcd efghjklmnz" // length 15
stringValue.slice(-3) // mnz
stringValue.slice(-3, -2) // m
stringValue.substr(-3) // mnz
stringValue.substr(-3, -1) // ""
stringValue.substring(-3) // abcd efghjklmnz
stringValue.substring(-3, -1) // ""
// 字符串位置方法 indexOf() lastIndexOf() 搜索给定的子字符串 返回字符串的位置 没有搜索到返回 -1
var stringValue = "abcd efghjklcnz" // length 15
stringValue.indexOf("c") //2
stringValue.lastIndexOf("c") // 12
// 这两个方法 都可以接受两个参数 第二个参数是从哪里开始搜索
stringValue.indexOf("c", 3) //12
stringValue.lastIndexOf("c", 3) //2 这个方法 永远都是从后向前查找的
var stringValue = " abf dgwa aeg aaf a gfgdh agag "
var position = []
var pos = stringValue.indexOf("a")
while (pos > -1) {
position.push(pos)
pos = stringValue.indexOf("a", pos + 1)
}
position // [1, 8, 10, 14, 15, 18, 26, 28]
// ECMAScript5 位所有的字符串都定义了trim 方法 这个方法创建一个字符串副本 删除前值和后缀所有的空格 并返回结果
var stringValue = " abf dgwa aeg aaf a gfgdh agag "
var tirmStringValue = stringValue.trim()
tirmStringValue // "abf dgwa aeg aaf a gfgdh agag"
// 字符串大小写 转换方法 toLocaleLowerCase toLocaleUpperCase
var stringValue = " AbDHGJGFJ dfgs "
stringValue.toLocaleLowerCase() // " abdhgjgfj dfgs "
stringValue.toLocaleUpperCase() // " ABDHGJGFJ DFGS "
// 6 字符串模式匹配方法 match() 方法 本质上调用RegExp相同。match 只接受一个参数 正则表达值 或者 RegExp 对象
var str = "cat bat Sat gat tat"
var pattern = /.at/
matches = str.match(pattern) // ["cat", index: 0, input: "cat bat Sat gat tat"]
// 另一个模糊匹配的方法 search 字符串或者Regexp 对象 如果查询到返回字符串中的位置。没有返回-1
var str = "cat bat Sat gat tat"
str.search(/at/) // 1
// replace 接受两个参数 第一个参数可以是正则表达式或者RegExp 第二个参数 可以是一个字符串或者 一个函数
var str = "cat bat Sat gat tat"
str.replace("t", "2") // "ca2 bat Sat gat tat"
str.replace(/at/, "1") // "c1 bat Sat gat tat"
str.replace(/at/g, "1") //"c1 b1 S1 g1 t1"
// replace 高级用法 如果第二个字符串使用特殊字符序列 ,将正则表达式匹配到的结果插入到 结果字符串中
var str = "cat, bat, Sat, gat, tat"
var result = str.replace(/(.at)/g, 'w $1') // "w cat, w bat, w Sat, w gat, w tat"
// replacy 第二个参数 传递函数 在值哟一个匹配项 会向函数传递
// 三个参数 模式的匹配项 模式匹配项 在字符串中的位置 和原始字符串
function htmlEscape(text) {
return text.replace(/[<>"&]/g, function(match, pos, originalText) {
switch (match) {
case "<":
return "%lt;";
case ">":
return "%gt;"
case "&":
return "&"
case "\"":
return """;
}
})
}
htmlEscape("<p class=\"greeting\">Hello wrold!</p>")
// "%lt;p class="greeting"%gt;Hello wrold!%lt;/p%gt;"
// 最后 模式匹配的方法 split 这个方法 可以基于指定分隔符 分割成多个子字符串 放在数组中
var colorText = "red,blue,green,yellow"
colorText.split(",") // ["red", "blue", "green", "yellow"]
colorText.split(",", 2) // ["red", "blue"]
colorText.split(/[^\,]+/) // ["", ",", ",", ",", ""]
// 操作字符串的组合一个方法 localeCompare
// 如果字符串中 自负排在字符串参数之前 返回 -1 相等 0 之后 1
var stringValue = "yellow";
stringValue.localeCompare("brick") // 1
stringValue.localeCompare("yellow") // 0
stringValue.localeCompare("zoo") // -1
var stringValue = "yellow";
function determineOrder(value) {
var result = stringValue.localeCompare(value)
if (result < 0) {
alert("The String 'yellow' comes before the String '" + value + "'")
} else if (result > 0) {
alert("The String 'yellow' comes before the String '" + value + "'")
} else {
alert("The String 'yellow' equal to the String '" + value + "'")
}
}
determineOrder("brick") determineOrder("yellow") determineOrder("zoo")
// 8 formCharCode() 方法 String 构造函数本身还有一个静态方法 formCharCode 接受一个或者 多个字符编码 转化为字符串
String.fromCharCode(104, 101, 108, 108, 111)
// 单个内置对象。开发人员不必显示实例化内置对象 比如。Object String Array 还有两个内置对象 Global Math
// Global isNan isFinite parseInt parseFloat 都是Global 对象的方法。
// url 编码 encodeURI 和 encodeURIComponent() 方法 进行编码 发给浏览器 因为主要是有效的URII
// URI 通用资源标识符 (uniform resource identifiers)
// encodeURI 不会对本身属于特殊字符进行编码
// encodeURIComponent 会对任何 非标准字符进行编码 例如冒号 正斜杠 问好 井字号
var uri = "http://www.wrox.com/illegal value.html#start"
encodeURI(uri)
// "http://www.wrox.com/illegal%20value.html#start"
encodeURIComponent(uri)
// "http%3A%2F%2Fwww.wrox.com%2Fillegal%20value.html%23start"
// 一般来说 使用encodeURIComponent() 方法 比encodeURI 更多
// 与 encodeURI encodeURIComponent 对应的方法 decodeURI decodeURIComponent
// eval 相当于ECMAScript 完成的解析器 只接受一个参数 要执行的字符串
eval("alert('hi')")
var msg = "hello world"
eval("alert(msg)")
sayHi()
eval("function sayHi(){ alert('hi')}")
eval("var msg = 'hello world'")
alert(msg)
// 在eval() 中创建的任何变量或者函数 都不会被提升
// Global 的属性。undefined NaN Infinity 都是Global 的属性 所有原生引用类型的构造函数 ,Object Function 都是Global 对象的属性
属性 说明 undeifned //特殊值 undefined
NaN // 特殊值 Nan
Infinity // 特殊值 Infinity
Object // 构造对象Object
Array // 构造函数Array
Function // 构造函数Function
Boolean // 构造函数Boolean
String // 构造函数 String
Number // 构造函数 Number
Data // 构造函数 Date
RegExp // 构造函数 Regexp
Error // 构造函数 Error
EvalError //构造函数 Error
RangerError //构造函数RangerError
SyntaxError //构造函数 SyntaxError
ReferenceError //构造函数 referenceEor
TypeError //构造函数 TypeError
URIError // 构造函数URIError
// 4 window 对象 在全局作用域声明定义所有变量和函数 都成为了 window 对象的属性
var color = "red"
function sayColor() {
alert(window.color)
}
window.sayColor() //red
var global = function() {
return this
}()
// 5.7.2 Math 对象
// 对象的属性 min() max() 方法
Math.max(3, 54, 32, 23, 324, 234); // 324
Math.min(3, 54, 32, 23, 324, 234); // 3
var values = [1, 3, 334, 545, 543, 23, 2, 8, 34]
var max = Math.max.apply(Math, values)
// 3 舍入方法。Math.ceil() Math.floor() Math.round()
// Math.cell() 执行向上舍入 即它总是将整数向上舍入位最近的整数
// Math.floor() 执行向下舍入 即它总是将整数向上舍入位最近的整数
// Math.round() 执行标准舍入 即它总是将数值 四舍五入最接近的数值
// 4 random() 方法 随机 任意
// Math.random 方法 返回一个大于等于0 小于1 的随机数 一下公式 可以从某个范围内 随机选取一个数值
// 值 = Math.floor(Math.random() * 可能值的总数 + 第一个可能值)
// 返回 1 - 10 之间的数值
var num = Math.floor(Math.random() * 10 + 1);
// 返回 2 - 10
var num = Math.floor(Math.random() * 9 + 2);
function selectFrom(lowerValue, upperValue) {
var choices = upperValue - lowerValue + 1
return Math.floor(Math.random() * choices + lowerValue)
}
selectFrom(2, 10) //介于 2-10 (包括2 和10 ) 的一个数值
var colors = ["red", "green", "blue", "yellow", "black", "purple", "brown"]
var color = colors[selectFrom(0, colors.length - 1)]
</script>
</body>
</html>
引用类型
最新推荐文章于 2021-02-16 23:12:33 发布