首页 > 图灵资讯 > 技术篇>正文
javascript 高级特性
2023-05-29 13:53:50
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html> <head> <title>advance.html</title><meta http-equiv="pragma" content="no-cache"><meta http-equiv="cache-control" content="no-cache"><meta http-equiv="expires" content="0"> <meta name="keywords" content=“keyword1，keyword2，keyword3”> <meta name="description" content="this is my page"> <meta name="content-type" content="text/html; charset=UTF-8"> <!--<link rel="stylesheet" type="text/css" href="./styles.css">--><script type="text/javascript" src="../js/jquery-1.11.3.js"></script><script type="text/javascript">// <![CDATA[//如果您需要访问没有硬编码的window标识符的全球对象，您可以在任何级别的函数作用域进行以下操作：var global = (function () {return this;})();function show(str) {$("#p").append($("<p></p>").text("" + str));}$(document).ready(function() {///变量名需要遵守两个简单的规则:///•第一个字符必须是字母、下划线(_)或美元符号($)///•剩余的字符可以是下划线、美元符号或任何字母或数字符//变量声明不必要///ECMAScript 另一个有趣的方面(也是大多数程序设计语言的主要区别)，在使用变量之前不需要声明。//ECMAScript 当解释程序遇到未声明的标识符时，用该变量名创建全局变量，并初始化为指定值。//ECMAScript 当解释程序遇到未声明的标识符时，用该变量名创建全局变量，并初始化为指定值。///在 ECMAScript 变量可以有两种类型的值，即原始值和引用值。///原始值存储在栈中（stack）简单的数据段，也就是说，它们的值直接存储在变量访问位置。///引用值存储在堆中（heap）对象，也就是说，存储在变量处的值是指针（point），指向存储对象的内存。///当变量赋值时，ECMAScript 必须判断该值是原始类型还是引用类型。为了实现这一点，解释程序需要尝试判断该值是否为 ECMAScript 原始类型之一，即 Undefined、Null、Boolean、Number 和 String 型。//字符串在许多语言中被视为引用类型，而不是原始类型，因为字符串的长度是可变的。ECMAScript 打破了这一传统。//如果一个值是引用类型，那么它的存储空间将从堆中分配。因为引用值的大小会发生变化，所以不能放在栈里，否则会降低变量搜索的速度。//相反，变量堆栈空间中的值是存储在堆栈中的对象的地址。//typeof 操作符//对变量或值调用 typeof 操作符将返回下列值之一：///•undefined - 如果变量是 Undefined 类型的//•boolean - 如果变量是 Boolean 类型的//•number - 如果变量是 Number 类型的//•string - 如果变量是 String 类型的//•object - 如果变量是一种引用类型或 Null 类型的//null 被认为是对象的占位符，从而解释了这一矛盾，但从技术上讲，它仍然是原始值。//Undefined 类型只有一个值，即 undefined。//Undefined 类型只有一个值，即 undefined。当声明的变量不初始化时，变量的默认值是 undefined。//提示：值 undefined 不同于未定义的变量。但是，typeof 这两个值并没有真正区分运算符。///如果未定义的变量 使用除 typeof 其他操作符会导致错误，因为其他操作符只能用于声明的变量。//当函数没有明确的返回值时，返回也是值 "undefined"show(typeof oTemp);//undefinedfunction testFunc() { }show(testFunc() == undefined);//true//Null 只有一个值的类型//另一个类型是 Null，它只有一个特殊值 null，即字面量。值 undefined 实际上是从值 null 因此，衍生的 ECMAScript 将它们定义为相等的。值 undefined 实际上是从值 null 因此，衍生的 ECMAScript 将它们定义为相等的。//虽然这两个值相等，但它们的含义不同。undefined 它声明了变量，但在其初始化时没有赋予变量值，null 用来表示尚未存在的对象。//如果函数或方法需要返回对象，当找不到对象时，通常会返回 null。show(null == undefined);//true//Number 类型//ECMA-262 中定义最特殊的类型是 Number 类型。这种类型可以表示 32 位的整数也可以表示 64 位浮点数。//八进制字面量的第一个数字必须是 0///16进制的字面量，第一个数字必须是 后面接字母 x，然后是任何16进制数字(0 到 9 和 A 到 F）。//提示:虽然所有的整数都可以表示为八进制或十六进制的字面量，但所有的数学操作都会返回十进制的结果。//几个特殊值也被定义为 Number 类型。 Number.MAX_VALUE 和 Number.MIN_VALUE，它们定义了 Number 值集合的外界。///最后一个特殊值 NaN，表示非数（Not a Number）。NaN 这是一个奇怪的特殊值。一般来说，这种情况发生在类型上（String、Boolean 等)转换失败时。//NaN 也不能用于算术计算。NaN 另一个奇怪的是，它不等于它自己。为此，不建议使用 NaN 值本身。函数 isNaN() 会做得很好。show([NaN == NaN, isNaN("blue")]);//false true//String 该类型的独特之处在于，它是唯一一种没有固定大小的原始类型。字符串字面量由双引号(”)或单引号(')声明。//ECMAScript 字符字面量：///n 换行 //\t 制表符 //\b 空格 //\r 回车 //\\ 反斜杠 //\' 单引号 //\" 双引号 show("aa\'cc\\\\\""";// aa'cc\"//ECMAScript 类型转换////ECMAScript 为开发者提供了大量简单的类型转换方法。//大多数类型都有简单的转换方法，还有几种全局方法可以用于更复杂的转换。///大多数类型都有简单的转换方法，还有几种全局方法可以用于更复杂的转换。无论如何，在 ECMAScript 类型转换是一个简短的步骤。//ECMAScript 的 Boolean 原始值、数字和字符串的有趣之处在于它们是伪对象，这意味着它们实际上具有属性和方法。//Number 类型的 toString() 该方法有两种模式，即默认模式和基础模式。采用默认模式，toString() 该方法仅用相应的字符串输出数字值。//注：在默认模式下，无论最初使用什么表示法来声明数字，Number 类型的 toString() 数字十进制表示返回方法。//采用 Number 类型的 toString() 该方法的基础模式可以使用不同的基础输出数字，如二进制基础 二、八进制基是 八、十六进制基是 16。var iNum = 100;show([iNum.toString(), iNum.toString(2), iNum.toString(8), iNum.toString(16)]);//ECMAScript 将非数字的原始值转换为数字有两种方法，即 parseInt() 和 parseFloat()。//前者将值转换为整数，后者将值转换为浮点数。//前者将值转换为整数，后者将值转换为浮点数。只有对 String 只有通过调用这些方法，类型才能正确运行；其他类型的返回都是 NaN。//parseInt() 该方法首先检查位置 0 判断字符是否是有效数字；如果没有，该方法将返回 NaN，其他操作不再继续执行。但如果字符是有效数字，则该方法将检查位置 1 同样的测试处的字符。///这个过程将持续到发现非有效数字的字符，此时 parseInt() 将字符之前的字符串转换成数字。show([parseInt(1234abcd)， parseInt(1234.34aa);///第一个小数点是有效字符。假如有两个小数点，第二个小数点将被视为无效。show(parseFloat(11.22.33);//你也可以使用强制类型转换（type casting）处理转换值的类型。即使是另一种类型，也可以通过强制类型转换访问特定值。//ECMAScript 中可用的 3 强制类型转换如下:////•Boolean(value) - 将给定值转换为 Boolean 型//•Number(value) - 将给定值转换为数字（可以是整数或浮点数）//•String(value) - 将给定值转换为字符串//Boolean() 函数：当转换值为至少一个字符串时 0 当数字或对象时，Boolean() 函数将返回 true。如果值是空字符串，数字 0、undefined 或 null，它将返回 false。show([Boolean(""), Boolean(null), Boolean(undefined), Boolean(0), Boolean(50), Boolean("hello"), Boolean(new Object())]);//false,false,false,false,true,true,true//Number() 函数:与 parseInt() 和 parseFloat() 该方法的处理方法相似，但它转换为整个值，而不是部分值。show([Number(false), Number(true), Number(null), Number(1.2)， Number(undefined), Number("1.2.3"), Number(new Object())]);//0，1，0，1.2NaN,NaN,NaN//String() 函数：强制转换为字符串并调用 toString() 方法的唯一区别在于，对 null 和 undefined 在不造成错误的情况下，强制性类型转换值可以生成字符串：show([String(null), String(undefined)]);//null,undefined//null.toString() 会导致错误//////ECMAScript 引用类型//引用类型通常称为类型（class）。//注：从传统意义上说，ECMAScript 不是真的有类。//注：从传统意义上说，ECMAScript 不是真的有类。事实上，除了说明不存在类，在 ECMA-262 “类”一词根本没有出现在中间。//ECMAScript 逻辑上等同于其他程序设计语言中的类别，定义了“对象定义”。//对象是由 new 由实例对象的名称创建的运算符。//当有不止一个参数时，ECMAScript 括号需要使用。如无参数，括号可省略：注：虽然括号不必要，但为避免混乱，最好使用括号。//Object 对象(每个属性和方法都会被其他对象覆盖)///ECMAScript 所有的对象都是由这个对象继承的，Object 对象中的所有属性和方法都会出现在其他对象中，所以我理解了 Object 对象，可以更好地理解其他对象。//Object 对象具有以下属性：////constructor 引用(指针)创建对象的函数。对于 Object 对象，指针指向原始对象 Object() 函数。//prototype 引用对象的对象原型。对于所有对象，它默认返回 Object 对象的一个例子。//Object 对象还有几种方法:////hasOwnProperty(property) 判断对象是否具有特定属性。该属性必须用字符串指定。//isPrototypeOf(object) 判断对象是否是另一个对象的原型。//propertyIsEnumerable 判断给定的属性是否可以使用 for...in 列举句子。//toString() 返回对象的原始字符串表示。对于 Object 对象，ECMA-262 这个值没有定义，所以不同 ECMAScript 实现不同的值。//valueOf() 返回最适合对象的原始值。对于许多对象，该方法返回的值与 ToString() 返回值相同。//Boolean 对象是 Boolean 引用类型的原始类型。//Boolean 对象将覆盖 Object 对象的 ValueOf() 方法，返回原始值，即 true 和 false。ToString() 该方法也将被覆盖，返回字符串 "true" 或 "false"。//在 Boolean 在表达式中，所有对象都会自动转换为 true，所以 oFalseObject 的值是 true。var oFalseObject = new Boolean(false);show(oFalseObject && true); //true//Number 对象是 Number 引用类型的原始类型。var oNumberObject = new Number(168);//toFixed() 该方法返回具有指定位数小数字的字符串。//toExponential() 该方法以科学计数法表示的数字字符串形式返回。//toPrecision() 该方法以最有意义的形式返回预定的数字形式或指数形式。//toFixed()、toExponential() 和 toPrecision() 为了用正确的小数位数正确地表示一个数，所有的方法都将被放弃。 show([oNumberObject.toFixed(2), oNumberObject.toExponential(3), oNumberObject.toPrecision(4)]);/168.00，1.680e+2，168.0//String 对象是 String 原始类型的对象表示///String 对象的 valueOf() 方法和 toString() 所有的方法都会回来 String 原始值var类型 oStringObject = new String("hello world");show([oStringObject.valueOf() == oStringObject.toString(), oStringObject == "hello world"]);//true,true//length 属性:String 对象具有属性 length，即使字符串包含双字节字符(和 ASCII 字符相对，ASCII 字符只占用一个字节)，每个字符只算一个字符。show([oStringObject.length, "陈智权".length]);//11, 3//charAt() 和 charCodeAt() 方法: 访问字符串中的单个字符。show([oStringObject.length, "陈智权".length]);//11, 3//charAt() 和 charCodeAt() 方法: 访问字符串中的单个字符。这两种方法都有一个参数，即要操作的字符的位置。//charAt() 该方法返回指定位置的字符。charCodeAt()得到的是字符代码。show([oStringObject.charAt(1), oStringObject.charCodeAt(1), "陈智权".charAt(1), "陈智权".charCodeAt(1)]);//e,101,智,26234//concat() 方法：用于连接一个或多个字符串 String 对象的原始值。该方法返回的是 String 原始值，保持原始值 String 对象不变。show([oStringObject.concat(" jaeson"), oStringObject]);//出于这个原因，更常见的是用加号(+)连接字符串，因为这种形式在逻辑上表明了真实的行为:show([oStringObject + " jaeson", oStringObject]);//indexOf() 和 lastIndexOf() 方法：返回是指定子串在另一个字符串中的位置，如果找不到子串，则返回 -1。这两种方法的区别在于，indexOf() 方法从字符串开始(位置) 0)开始检索字符串，但是 lastIndexOf() 方法是从字符串的结尾检索子串。show([oStringObject.indexOf("o"), oStringObject.lastIndexOf("o")]);//localeCompare() 方法: 对字符串进行排序。show([oStringObject.indexOf("o"), oStringObject.lastIndexOf("o")]);//localeCompare() 方法: 排序字符串。///•如果 String 在参数中的字符串按字母顺序排列之前，返回负数。//•如果 String 对象等于参数中的字符串，返回 0//•如果 String 参数中的字符串按字母顺序排列后，返回正数。//注释:如果返回负数，最常见的是 -1.但真正返回的是实现决定的。如果返回正数，同样，最常见的是 1.但真正返回的是实现决定的。//localeCompare() 大写字母按字母顺序排列在小写字母之后，区分大写字母。show([oStringObject.localeCompare("brick"), oStringObject.localeCompare("hello world"), oStringObject.localeCompare("zero")]);//slice() 和 substring()//这两种方法返回的是要处理的字符串的子串，都接受一两个参数。第一个参数是子串的起始位置，//第二个参数(如果使用)是子串终止前的位置(也就是说，终止位置的字符不包括在返回值内)。第一个参数是子串的起始位置，///第二个参数(如果使用)是子串终止前的位置(也就是说，终止位置的字符不包括在返回值内)。//如果省略第二个参数，终止位置默认为字符串的长度。//slice() 和 substring() 方法没有改变 String 对象本身的价值。他们只回到原来的地方 String 值，保持 String 对象不变。show([oStringObject.slice(3), oStringObject.slice(3, 7), oStringObject.substring(3), oStringObject.substring(3, 7)]);//事实上，这两种方法并不完全相同，但只有当参数为负时，它们以不同的方式处理参数。//对负数参数，slice() 该方法将使用字符串的长度加上参数，substring() 将其作为一种方法 0 处理(也就是说，忽略它)。//对负数参数，slice() 该方法将使用字符串的长度加上参数，substring() 将其作为一种方法 0 处理(也就是说，它将被忽略)。//如果后面的参数小于前面的参数，slice返回空串，substring将调整两个参数， substring() 以较小的数字为起始位，以较大的数字为终止位。show([oStringObject.slice(3, -4), oStringObject.substring(3, -100)]);//toLowerCase()、toUpperCase()show([oStringObject.toUpperCase(), oStringObject.toLowerCase(), oStringObject]);//instanceof 使用操作符/// typeof 操作符时使用引用类型的存储值会出现问题。无论引用什么类型的对象，它都会返回 "object"。//ECMAScript 引入另一个 Java 运算符 instanceof 解决这个问题。show([typeof new Boolean(), typeof new String(), typeof new Number()]);//object,object,object//instanceof 该方法要求开发人员明确确认对象为特定类型。show([new Boolean() instanceof Boolean, new String() instanceof String, new String() instanceof Object, 10 instanceof Number, "String" instanceof String, false instanceof Boolean, "String" instanceof Object]);//true,true,true,false,false,false,false});// ]]></script> </head> <body><p id="p"></p> </body></html>