《Javascript 高级程序设计(第三版)》笔记0x7 引用类型(2)

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/funkstill/article/details/84842933

目录

 

Function 类型

     没有重载

    函数声明与函数表达式

     作为值的函数

      将一个函数作为另一个函数的结果返回

       从一个函数中返回另一个函数

    函数内部属性

      callee 属性

       this

      caller 

    函数属性和方法

      属性:length 和 prototype

      方法:apply()和 call()

       bind()

基本包装类型

     Boolean类型

     Number类型

    String类型

      字符方法

      字符串操作方法

      字符串位置方法

      trim()方法

      字符串大小写转换方法

      字符串的模式匹配方法

       localeCompare()方法

      fromCharCode()方法

      HTML 方法

单体内置对象

    Global对象

        URI 编码方法

       eval()方法

      Global 对象的属性

       window 对象

    Math对象

      Math 对象的属性

      min()和 max()方法 

      舍入方法

      random()方法

      其他方法


Function 类型

      函数实际上是对象。每个函数都是 Function 类型的实例,而且都与其他引用类型一样具有属性和方法。由于函数是对象,因此函数名实际上也是一个指向函数对象的指针,不会与某个函数绑定。

function sum (num1, num2) {
    return num1 + num2;
}
//这与下面使用函数表达式定义函数的方式几乎相差无几。
var sum = function(num1, num2){//在使用函数表达式定义函数时,没有必要使用函数名——通过变量 sum 即可以引用函数
    return num1 + num2;
};

//使用 Function 构造函数
var sum = new Function("num1", "num2", "return num1 + num2"); // 不推荐

         由于函数名仅仅是指向函数的指针,因此函数名与包含对象指针的其他变量没有什么不同。换句话说,一个函数可能会有多个名字.

function sum(num1, num2){
    return num1 + num2;
}
alert(sum(10,10)); //20
var anotherSum = sum;
alert(anotherSum(10,10)); //20
sum = null;
alert(anotherSum(10,10)); //20
//注意即使将 sum 设置为 null,让它与函数“断绝关系”,但仍然可以正常调用anotherSum()。

     没有重载

//函数名是指针,那后面的函数名自然会覆盖前面
function addSomeNumber(num){
    return num + 100;
}
function addSomeNumber(num) {
    return num + 200;
}
var result = addSomeNumber(100); //300

//相当于
var addSomeNumber = function (num){
    return num + 100;
};
addSomeNumber = function (num) {
    return num + 200;
};
var result = addSomeNumber(100); //300

    函数声明与函数表达式

        解析器会率先读取函数声明,并使其在执行任何代码之前可用(可以访问);至于函数表达式,则必须等到解析器执行到它所在的代码行,才会真正被解释执行。

     作为值的函数

      将一个函数作为另一个函数的结果返回

function callSomeFunction(someFunction, someArgument){
        return someFunction(someArgument);
}

function add10(num){
    return num + 10;
}
var result1 = callSomeFunction(add10, 10);
alert(result1); //20
function getGreeting(name){
    return "Hello, " + name;
}
var result2 = callSomeFunction(getGreeting, "Nicholas");
alert(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"));
alert(data[0].name); //Nicholas
data.sort(createComparisonFunction("age"));
alert(data[0].name); //Zachary

    函数内部属性

        arguments 主要用途是保存函数参数;

      callee 属性

        该属性是一个指针,指向拥有这个 arguments 对象的函数。 

function factorial(num){
    if (num <=1) {
        return 1;
    } else {
        return num * factorial(num-1)
    }
}

function factorial(num){
    if (num <=1) {
        return 1;
    } else {
        return num * arguments.callee(num-1)
    }
}

        解除了函数体内的代码与函数名的耦合状态。

       this

        引用的是函数据以执行的环境对象

//当在网页的全局作用域中调用函数时,this 对象引用的就是 window
window.color = "red";
var o = { color: "blue" };
function sayColor(){
    alert(this.color);
}
sayColor(); //"red"
o.sayColor = sayColor;
o.sayColor(); //"blue"

        函数的名字仅仅是一个包含指针的变量而已。因此,即使是在不同的环境中执行,全局的 sayColor()函数与 o.sayColor()指向的仍然是同一个函数。

      caller 

        保存着调用当前函数的函数的引用,如果是在全局作用域中调用当前函数,它的值为 null。

function outer(){
    inner();
}
function inner(){
    alert(arguments.callee.caller);
}
outer();

    函数属性和方法

      属性:length 和 prototype

//length表参数个数
function sayName(name){
    alert(name);
}
function sum(num1, num2){
    return num1 + num2;
}
function sayHi(){
    alert("hi");
}
alert(sayName.length); //1
alert(sum.length); //2
alert(sayHi.length); //0

        对于ECMAScript 中的引用类型而言, prototype 是保存它们所有实例方法的真正所在。换句话说,诸如toString()和 valueOf()等方法实际上都保存在 prototype 名下,只不过是通过各自对象的实例访问罢了。

      方法:apply()和 call()

/*apply()方法接收两个参数:一个是在其中运行函数的作用域,另一个是参数数组。
其中,第二个参数可以是 Array 的实例,也可以是arguments 对象。*/
function sum(num1, num2){
    return num1 + num2;
}
function callSum1(num1, num2){
    return sum.apply(this, arguments); // 传入 arguments 对象
}
function callSum2(num1, num2){
    return sum.apply(this, [num1, num2]); // 传入数组
}
alert(callSum1(10,10)); //20
alert(callSum2(10,10)); //20

/*对于 call()方法而言,第一个参数是 this 值没有变化,变化的是其余参数都直接传递给函数。*/
function sum(num1, num2){
    return num1 + num2;
}
function callSum(num1, num2){
    return sum.call(this, num1, num2);
}
alert(callSum(10,10)); //20

        传递参数并非 apply()和 call()真正的用武之地;它们真正强大的地方是能够扩充函数赖以运行的作用域。使用 call()(或 apply())来扩充作用域的最大好处,就是对象不需要与方法有任何耦合关系。

window.color = "red";
var o = { color: "blue" };
    function sayColor(){
    alert(this.color);
}
sayColor(); //red
sayColor.call(this); //red
sayColor.call(window); //red
sayColor.call(o); //blue

       bind()

         这个方法会创建一个函数的实例,其 this 值会被绑定到传给 bind()函数的值。

window.color = "red";
var o = { color: "blue" };
function sayColor(){
    alert(this.color);
}
var objectSayColor = sayColor.bind(o);
objectSayColor(); //blue

基本包装类型

        为了便于操作基本类型值, ECMAScript 还提供了 3 个特殊的引用类型: Boolean、 Number 和String。

var s1 = "some text";
var s2 = s1.substring(2);
//相当于
var s1 = new String("some text");
var s2 = s1.substring(2);
s1 = null;

        引用类型与基本包装类型的主要区别就是对象的生存期。使用 new 操作符创建的引用类型的实例,在执行流离开当前作用域之前都一直保存在内存中。而自动创建的基本包装类型的对象,则只存在于一行代码的执行瞬间,然后立即被销毁。这意味着我们不能在运行时为基本类型值添加属性和方法。

        Object 构造函数也会像工厂方法一样,根据传入值的类型返回相应基本包装类型的实例。 

var obj = new Object("some text");
alert(obj instanceof String); //true

     Boolean类型

var booleanObject = new Boolean(true);

var falseObject = new Boolean(false);
var result = falseObject && true;
alert(result); //true

var falseValue = false;
result = falseValue && true;
alert(result); //false

        首先, typeof 操作符对基本类型返回"boolean",而对引用类型返回"object"。其次,由于 Boolean 对象是 Boolean 类型的实例,所以使用 instanceof操作符测试 Boolean 对象会返回 true,而测试基本类型的布尔值则返回 false。

alert(typeof falseObject); //object
alert(typeof falseValue); //boolean
alert(falseObject instanceof Boolean); //true
alert(falseValue instanceof Boolean); //false

     Number类型

var num = 10;
alert(num.toString()); //"10"
alert(num.toString(2)); //"1010"
alert(num.toString(8)); //"12"
alert(num.toString(10)); //"10"
alert(num.toString(16)); //"a"

alert(num.toFixed(2)); //"10.00"

alert(num.toExponential(1)); //"1.0e+1"

var num = 10.005;
alert(num.toFixed(2)); //"10.01"

var num = 99;
alert(num.toPrecision(1)); //"1e+2"
alert(num.toPrecision(2)); //"99"
alert(num.toPrecision(3)); //"99.0"

var numberObject = new Number(10);
var numberValue = 10;
alert(typeof numberObject); //"object"
alert(typeof numberValue); //"number"
alert(numberObject instanceof Number); //true
alert(numberValue instanceof Number); //false

    String类型

var stringObject = new String("hello world");

var stringValue = "hello world";
alert(stringValue.length); //"11"

      字符方法

var stringValue = "hello world";
alert(stringValue.charAt(1)); //"e"

alert(stringValue.charCodeAt(1)); //输出"101"

alert(stringValue[1]); //"e"

      字符串操作方法

var stringValue = "hello ";
var result = stringValue.concat("world");
alert(result); //"hello world"
alert(stringValue); //"hello"

var stringValue = "hello ";
var result = stringValue.concat("world", "!");
alert(result); //"hello world!"
alert(stringValue); //"hello"

var stringValue = "hello world";
alert(stringValue.slice(3)); //"lo world"
alert(stringValue.substring(3)); //"lo world"
alert(stringValue.substr(3)); //"lo world"
alert(stringValue.slice(3, 7)); //"lo w"
alert(stringValue.substring(3,7)); //"lo w"
alert(stringValue.substr(3, 7)); //"lo worl"

var stringValue = "hello world";
alert(stringValue.slice(-3)); //"rld",slice()方法会将传入的负值与字符串的长度相加
alert(stringValue.substring(-3)); //"hello world"
alert(stringValue.substr(-3)); //"rld"
alert(stringValue.slice(3, -4)); //"lo w"
alert(stringValue.substring(3, -4)); //"hel",ubstring()方法会把所有负值参数都转换为 0。
alert(stringValue.substr(3, -4)); //""(空字符串),substr()方法将负的第一个参数加上字符串的长度,而将负的第二个参数转换为 0

      字符串位置方法

var stringValue = "hello world";
alert(stringValue.indexOf("o")); //4
alert(stringValue.lastIndexOf("o")); //7

var stringValue = "hello world";//第二个参数,表示从字符串中的哪个位置开始搜索。
alert(stringValue.indexOf("o", 6)); //7
alert(stringValue.lastIndexOf("o", 6)); //4

      trim()方法

var stringValue = " hello world ";
var trimmedStringValue = stringValue.trim();
alert(stringValue); //" hello world "
alert(trimmedStringValue); //"hello world"

      字符串大小写转换方法

var stringValue = "hello world";
alert(stringValue.toLocaleUpperCase()); //"HELLO WORLD"
alert(stringValue.toUpperCase()); //"HELLO WORLD"
alert(stringValue.toLocaleLowerCase()); //"hello world"
alert(stringValue.toLowerCase()); //"hello world"

      字符串的模式匹配方法

var text = "cat, bat, sat, fat";
var pattern = /.at/;
//与 pattern.exec(text)相同
var matches = text.match(pattern);
alert(matches.index); //0
alert(matches[0]); //"cat"
alert(pattern.lastIndex); //0

var text = "cat, bat, sat, fat";
var pos = text.search(/at/);
alert(pos); //1

var text = "cat, bat, sat, fat";
var result = text.replace("at", "ond");
alert(result); //"cond, bat, sat, fat"
result = text.replace(/at/g, "ond");
alert(result); //"cond, bond, sond, fond"

var text = "cat, bat, sat, fat";
result = text.replace(/(.at)/g, "word ($1)");
alert(result); //word (cat), word (bat), word (sat), word (fat)

       localeCompare()方法

var stringValue = "yellow";
alert(stringValue.localeCompare("brick")); //1
alert(stringValue.localeCompare("yellow")); //0
alert(stringValue.localeCompare("zoo")); //-1

      fromCharCode()方法

alert(String.fromCharCode(104, 101, 108, 108, 111)); //"hello"

      HTML 方法

使用 JavaScript 动态格式化 HTML

单体内置对象

        “由 ECMAScript 实现提供的、不依赖于宿主环境的对象,这些对象在 ECMAScript 程序执行之前就已经存在了。” 

    Global对象

        ECMAScript 中的 Global 对象在某种意义上是作为一个终极的“兜底儿对象”来定义的。换句话说,不属于任何其他对象的属性和方法,最终都是它的属性和方法。事实上,没有全局变量或全局函数;所有在全局作用域中定义的属性和函数,都是 Global 对象的属性。 

        URI 编码方法

        Global 对象的 encodeURI()和 encodeURIComponent()方法可以对 URI(Uniform Resource Identifiers,通用资源标识符)进行编码,以便发送给浏览器。有效的 URI 中不能包含某些字符。 

         encodeURI()主要用于整个 URI(例如, http://www.wrox.com/illegal value.htm),而 encodeURIComponent()主要用于对 URI 中的某一段(例如前面 URI 中的 illegal value.htm)进行编码。它们的主要区别在于, encodeURI()不会对本身属于 URI 的特殊字符进行编码,例如冒号、正斜杠、问号和井字号;而 encodeURIComponent()则会对它发现的任何非标准字符进行编码。

var uri = "http://www.wrox.com/illegal value.htm#start";

alert(encodeURI(uri));//"http://www.wrox.com/illegal%20value.htm#start"
alert(encodeURIComponent(uri));//"http%3A%2F%2Fwww.wrox.com%2Fillegal%20value.htm%23start"

var uri = "http%3A%2F%2Fwww.wrox.com%2Fillegal%20value.htm%23start";

alert(decodeURI(uri));//http%3A%2F%2Fwww.wrox.com%2Fillegal value.htm%23start
alert(decodeURIComponent(uri));//http://www.wrox.com/illegal value.htm#start

       eval()方法

        eval()方法就像是一个完整的 ECMAScript 解析器,它只接受一个参数,即要执行的 ECMAScript (或 JavaScript)字符串。

var msg = "hello world";
eval("alert(msg)"); //"hello world"

eval("var msg = 'hello world'; ");
alert(msg); //"hello world"

         能够解释代码字符串的能力非常强大,但也非常危险。因此在使用 eval()时必须极为谨慎,特别是在用它执行用户输入数据的情况下。否则,可能会有恶意用户输入威胁你的站点或应用程序安全的代码(即所谓的代码注入)。

      Global 对象的属性

       window 对象

        ECMAScript 虽然没有指出如何直接访问 Global 对象,但 Web 浏览器都是将这个全局对象作为window 对象的一部分加以实现的。因此,在全局作用域中声明的所有变量和函数,就都成为了 window对象的属性。

var color = "red";
function sayColor(){
    alert(window.color);
}
window.sayColor(); //"red",全局变量是 window 对象的属性

//另一种取得 Global 对象的方法是使用以下代码:
var global = function(){
    return this;
}();

    Math对象

      Math 对象的属性

      min()和 max()方法 

var max = Math.max(3, 54, 32, 16);
alert(max); //54
var min = Math.min(3, 54, 32, 16);
alert(min); //3

var values = [1, 2, 3, 4, 5, 6, 7, 8];
var max = Math.max.apply(Math, values);

      舍入方法

alert(Math.ceil(25.9)); //26
alert(Math.ceil(25.5)); //26
alert(Math.ceil(25.1)); //26
alert(Math.round(25.9)); //26
alert(Math.round(25.5)); //26
alert(Math.round(25.1)); //25
alert(Math.floor(25.9)); //25
alert(Math.floor(25.5)); //25
alert(Math.floor(25.1)); //25

      random()方法

var num = Math.floor(Math.random() * 10 + 1);//选择一个 1到 10 之间的数值

var num = Math.floor(Math.random() * 9 + 2);//选择一个介于 2 到 10 之间的值

      其他方法

猜你喜欢

转载自blog.csdn.net/funkstill/article/details/84842933