JavaScript---------函数

1.浏览器内置函数：

var myText = "myText is String";
var newString = myText.replace("String","number");

 replace() 字符串函数接受一个字符串，用另一个子字符串替换一个子字符串，并返回替换后的新字符串，即：把myText中的String换成number。

结果展示：

var myArray = ["I","miss","you"];
var myString = myArray.join(" ");

 join() 函数接受一个数组，将所有数组元素连接成一个单一的字符串，并返回这个新字符串。 

结果展示：

var myNumber = Math.random();

random() 函数生成一个随机数字在 0 和 1 之间，并返回该数字

结果展示： 

2.函数与方法：

程序员把函数称为对象方法（method）的一部分。到目前为止我们所使用的内置代码同属于这两种形式：函数和方法。内置浏览器函数并不是函数——它们是方法。函数和方法在很大程度上是可互换的，二者区别在于方法是在对象内定义的函数。浏览器内置函数（方法）和变量（称为属性）存储在结构化对象内，以使代码更加高效，易于处理。

 3.自定义函数：

function draw(){
  ctx.clearRect(0,0,WIDTH,HEIGHT);
  for(var i=0;i<100;i++){
    ctx.beginPath();
    ctx.fillStyle = "rgba(255,0,0,0.5)";
    ctx.arc(random(WIDTH),random(HEIGHT),random(50),0,2*Math.PI);
    ctx.fill();
  }
}

该函数在  <canvas>元素中绘制 100 个随机圆。

每次我们想要这样做，我们可以使用这个函数来调用这个功能：

draw();

而不是每次我们想重复一遍，都要写出所有的代码。函数可以从内部函数调用其他函数。以上函数例如调用random()函数三次，由以下代码定义：

function random(number) {
  return Math.floor(Math.random() * number);
}

我们需要这个函数，因为浏览器的内置 Math.random()函数只生成一个 0 到 1 之间的随机十进制数。我们想要一个 0 到一个指定数字之间的随机整数。

4.调用函数：

function myFunction() {
  alert("hello");
}

myFunction();

结果展示： 

5.匿名函数：

1. 匿名函数也称为函数表达式，创建一个没有名称的函数，叫做匿名函数。

2. 函数表达式与函数声明的区别：

函数声明会进行声明提升（declaration hoisting），而函数表达式不会。

3.创建一个没有名称的函数，如下：

function() {
  alert('hello');
}

4. 通常将匿名函数与事件处理程序一起使用。

例如，如果单击相关按钮，以下操作将在函数内运行代码：

①在HTML文件中：创建一个button按钮

②在JS文件中，添加如下代码：

var myButton = document.querySelector("button");

myButton.onclick = function () {
  alert("hello");
};

结果展示：

点击按钮出现弹窗：

5. 将匿名函数分配为变量的值，例如：

var myGreeting = function () {
  alert("hello");
};

现在可以使用以下方式调用此函数：

myGreeting();

有效地给变量一个名字;还可以将该函数分配为多个变量的值，例如：

var anotherGreeting = function () {
  alert("hello");
};

现在可以使用以下任一方法调用此函数

myGreeting();
anotherGreeting();

6.创建方法时，最好使用下列形式：

function myGreeting() {
  alert("hello");
}

使用匿名函数来运行负载的代码以响应事件触发（如点击按钮）——使用事件处理程序。

看起来像这样：

myButton.onclick = function () {
  alert("hello");
};

6.函数参数：

1. 参数有时称为参数（argument）、属性（propertie）或甚至特性（attribute）。

2. 浏览器的内置  Math.random()函数不需要任何参数。

var myNumber = Math.random();

   当被调用时，它总是返回 0 到 1 之间的随机数。

3. 浏览器的内置字符串replace()函数需要两个参数：

   ①在主字符串中查找的子字符串

   ②用以下替换该字符串的子字符串

var myText = "I am a string";
var newString = myText.replace("string", "sausage");

4. 有时参数不是必须的——不必指定它们。如果没有，该功能一般会采用某种默认行为。

例如，数组 join()函数的参数是可选的：

const myArray =["NELL","bob","mary",666];
const mystring = myArray.join(" ");

 结果展示：

const myArray =["NELL","bob","mary",666];
const mystring1 = myArray.join();

 结果展示：

如果没有包含参数来指定分隔符，默认情况下会使用逗号。

7.函数作用域和冲突：

1. 当你创建一个函数时，函数内定义的变量和其他东西都在它们自己的单独的范围内，不能被函数外的代码访问。所有函数的最外层被称为全局作用域，在全局作用域内定义的值可以在任意地方访问。

2. 假设你有一个 HTML 文件，它调用两个外部 JavaScript 文件，并且它们都有一个使用相同名称定义的变量和函数：

HTML文件中：

<script src="first.js"></script>
<script src="second.js"></script>
<script>
  greeting();
</script>

first.js中： 

let name = "NELL";
function greeting() {
  alert("你好 " + name);
}

 second.js中：

let name = "BOB";
function greeting() {
  alert("hello " + name);
}

①这两个函数都使用 greeting() 形式调用，但是你只能访问到first.js 的greeting()函数（第二个文件被忽视了）。

②另外，第二次尝试使用 let 关键字定义 name 变量会导致一个错误。