函数练习：
判断一个数是否是质数
1 <!DOCTYPE html>
2 <html lang="en">
3 <head>
4 <meta charset="UTF-8">
5 <title>这是标题</title>
6 <script>
7 function isPrime(x) {
8 for (var i = 2; i * i <= x; i++) {
9 if (x % i == 0) {
10 return 0;
11 }
12 }
13 return 1;
14 }
15 // 判断 ２－１００ 以内的素数
16 for(var i = 2;i<=100;i++){
17 var flag = isPrime(i);
18 if (flag){
19 console.log(i + "是素数");
20 }
21 }
22 </script>
23 </head>
24 <body>
25
26 </body>
27 </html>
求一组数中的最大值和最小值：
1 <!DOCTYPE html>
2 <html lang="en">
3 <head>
4 <meta charset="UTF-8">
5 <title>这是标题</title>
6 <script>
7 function max_array(arr) {
8 var max =arr[0];
9 for (var i = 1; i < arr.length; i++) {
10 if(arr[i] > max){
11 max = arr[i];
12 }
13 }
14 return max;
15 }
16 var arr = [12,3,53,34,23,34,2,23];
17 var ret = max_array(arr);
18 console.log("最大值为 "+ ret);
19 </script>
20 </head>
21 <body>
22
23 </body>
24 </html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>这是标题</title>
<script>
function min_array(arr) {
var min =arr[0];
for (var i = 1; i < arr.length; i++) {
if(arr[i] < min){
min = arr[i];
}
}
return min;
}
var arr = [12,3,53,34,23,34,2,23];
var ret = min_array(arr);
console.log("最小值为 "+ ret);
</script>
</head>
<body>
</body>
</html>
求一组数的最小值
求一组数的和：
1 <!DOCTYPE html>
2 <html lang="en">
3 <head>
4 <meta charset="UTF-8">
5 <title>这是标题</title>
6 <script>
7 function sum_array(arr) {
8 var sum = 0 ;
9 for (var i = 0; i < arr.length; i++) {
10 sum += arr[i];
11 }
12 return sum;
13 }
14 var arr = [12,3,53,34,23,34,2,23];
15 var ret = sum_array(arr);
16 console.log("总和为 "+ ret);
17 </script>
18 </head>
19 <body>
20
21 </body>
22 </html>
通过函数实现数组的反转：
1 <!DOCTYPE html>
2 <html lang="en">
3 <head>
4 <meta charset="UTF-8">
5 <title>这是标题</title>
6 <script>
7 function reverse(arr) { //选择排序 从小到大
8 var temp;
9 for (var i = 0; 2*i < arr.length; i++) {
10 temp = arr[i];
11 arr[i] = arr[arr.length -i-1];
12 arr[arr.length -i-1] = temp;
13 }
14 return arr;
15 }
16 var arr = [12,3,53,34,23,34,2,23];
17 console.log("逆序之前的数组"+ arr);
18 var ret = reverse(arr);
19 //逆序之后的数组
20 console.log(ret);
21 </script>
22 </head>
23 <body>
24 </body>
25 </html>
通过函数实现冒泡排序：
1 <!DOCTYPE html>
2 <html lang="en">
3 <head>
4 <meta charset="UTF-8">
5 <title>这是标题</title>
6 <script>
7 function sort_byBubble(arr) { //冒泡 从小到大
8 var temp ;
9 for (var i = 0; i < arr.length - 1; i++) {
10 for (var j = 0; j < arr.length - 1 - i; j++) {
11 if (arr[j] >arr[j+1] ){
12 temp = arr[j];
13 arr[j] = arr[j+1];
14 arr[j+1] = temp;
15 }
16 }
17 }
18 return arr;
19 }
20 var arr = [12,3,53,34,23,34,2,23];
21 var ret = sort_byBubble(arr);
22 //冒号排序之后的数组
23 console.log(ret);
24 </script>
25 </head>
26 <body>
27 </body>
28 </html>
通过函数实现选择排序：
1 <!DOCTYPE html>
2 <html lang="en">
3 <head>
4 <meta charset="UTF-8">
5 <title>这是标题</title>
6 <script>
7 function sort_bySelect(arr) { //选择排序 从小到大
8 var temp ;
9 var min_idx;
10 for (var i = 0; i < arr.length ; i++) {
11 min_idx = i;
12 for (var j = i+1; j <arr.length ; j++) {
13 if(arr[j] <arr[min_idx]){
14 min_idx = j;
15 }
16 }
17 if(min_idx!= i){
18 temp = arr[min_idx];
19 arr[min_idx] = arr[i];
20 arr[i] = temp;
21 }
22 }
23 return arr;
24 }
25 var arr = [12,3,53,34,23,34,2,23];
26 var ret = sort_bySelect(arr);
27 //选择排序之后的数组
28 console.log(ret);
29 </script>
30 </head>
31 <body>
32 </body>
33 </html>
js 中实现整除：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>这是标题</title> 6 <script> 7 console.log(parseInt(12/5)); 8 </script> 9 </head> 10 <body> 11 </body> 12 </html>
arguments对象伪数组
1 <!DOCTYPE html>
2 <html lang="en">
3 <head>
4 <meta charset = "UTF-8">
5 <title>我是网站标题</title>
6 <script>
7 function f1(){
8 console.log(arguments); //输出的是个伪数组
9 }
10 f1(1,2,3,4,5);
11 </script>
12
13 </head>
14 <body></body>
15
16 </html
输出的是：
可以通过 arguments.length 来获取输入参数的长度。
所以，上面的函数就可以简化为如下：
1 <!DOCTYPE html>
2 <html lang="en">
3 <head>
4 <meta charset = "UTF-8">
5 <title>我是网站标题</title>
6 <script>
7 function func(){
8 var sum =0;
9 for(var i=0;i<arguments.length;i++){
10 sum += arguments[i];
11 }
12 return sum;
13 }
14 var ret = func(1,2,3,4,5);
15 console.log(ret);
16 </script>
17
18 </head>
19 <body></body>
20
21 </html>
这样只需要一个函数就可以搞定所有数字的求和运算了！
补：如果直接输入函数名字，输出的是函数的代码：
函数的其他定义方式：
匿名函数：
它不能直接调用，
1 <!DOCTYPE html>
2 <html lang="en">
3 <head>
4 <meta charset = "UTF-8">
5 <title>我是网站标题</title>
6 <script>
7 //普通函数
8 function func(){
9 console.log("Hello World!");
10 }
11 //匿名函数
12 var f =function (){
13 console.log("好帅哦");
14 }； //函数表达式后面一定要加分号，因为这里是赋值语句。
15 f();
16 </script>
17
18 </head>
19 <body></body>
20
21 </html>
下面看两种情况：
1 <!DOCTYPE html>
2 <html lang="en">
3 <head>
4 <meta charset = "UTF-8">
5 <title>我是网站标题</title>
6 <script>
7 //普通函数
8 function f1(){
9 console.log("Hello World!");
10 }
11 f1();
12 function f1(){
13 console.log("我去！");
14 }
15 f1();
16
17
18 </script>
19
20 </head>
21 <body></body>
22
23 </html>//输出： 我去！ （２） 此时，函数只是声明，程序执行的时候先看声明，之后再执行。
另外一种情况：
1 <!DOCTYPE html>
2 <html lang="en">
3 <head>
4 <meta charset = "UTF-8">
5 <title>我是网站标题</title>
6 <script>
7 //普通函数
8 f1 = function (){
9 console.log("Hello World!");
10 }；
11 f1();
12 f1 = function (){
13 console.log("我去！");
14 }；
15 f1();
16 </script>
17
18 </head>
19 <body></body>
20
21 </html>输出：Hello World!我去！ 此时就是，相当于变量了
它的好处有：
没有名字，根本就不会发生冲突。
它执行玩之后就会释放内存了！
小结：
函数的声明，函数表达式还有函数的自调用。
函数也是一种数据类型：
输出是：function .
函数作为参数使用：
函数作为返回值使用：
作用域：
预知：
全局变量和局部变量
它们分别对应全局作用域和局部作用域。
在其他语言中，还有块级作用域，但是js 中没有块级作用域。
小结：只有函数内部定义的是局部变量，其他都是全局变量。
我们使用的时候尽量要使用局部变量，而不是全局变量，因为局部变量在函数执行完毕之后就会释放空间了。
隐式全局变量：
还有个问题：
输出是：number
undefined
小结：全局变量不能被删除，隐式全局变量可以被删除。
作用域链：
预解析：
不仅仅是变量，函数的声明也会被提前。
注：Python 中不会预解析的。
预解析案例：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset = "UTF-8">
<title>我是网站标题</title>
<script>
function f1(){
console.log(num);
var num = 10; //var num 会提到当前作用域的最上面，仍然在{} 内
}
f1();
console.log(num); //报错
</script>
</head>
<body></body>
</html>
1 <!DOCTYPE html>
2 <html lang="en">
3 <head>
4 <meta charset = "UTF-8">
5 <title>我是网站标题</title>
6 <script>
7
8 f1();
9 console.log(c);
10 console.log(b);
11 console.log(a); //此处报错，其余都是9， b,c 不报错因为它们是隐式全局变量。
12
13 function f1(){
14 var a= b =c =9;
15 console.log(a);
16 console.log(b);
17 console.log(c);
18 }
19 </script>
20
21 </head>
22 <body></body>
23
24 </html>
查资料：
MDN
例如：
对象：
下面的内容概括：
js 不是面向对象的语言，但是它是一门基于对象的语言。
js 没有继承和多态的概念，它没有面向对象的三大特性，只能说有封装。
但是，它可以模拟出三大特性。
创建对象的三种方式：
第一种：调用系统的构造函数来创建对象。
1 <!DOCTYPE=html> 2 3 <html lang="en"> 4 <meta charset=‘UTF-8‘> <title>这是网页标题</title> 5 6 <head> 7 <script> 8 var person = new Object(); 9 person.name = "tom"; 10 person.age = 18; 11 12 </script> 13 14 </head> 15 <body> 16 </body> 17 </html>
1 <!DOCTYPE html>
2 <html lang="en">
3 <head>
4 <meta charset="UTF-8">
5 <title>这是网页标题</title>
6
7 <script>
8 var person = new Object();
9 //添加属性
10 person.name = "tom";
11 person.age = 18;
12
13 //添加方法
14 person.sleep = function () {
15 console.log("我要睡觉了")
16 }
17 person.eat = function () {
18 console.log("我要吃饭了")
19 }
20
21 console.log(person.name);
22 console.log(person.age);
23
24 person.sleep();
25 person.eat();
26
27 </script>
28 </head>
29 <body>
30
31 </body>
32 </html>
给对象添加属性和方法
第二种：自定义构造函数创建对象（结合第一种，通过工厂模式创建对象）。
现在有两个问题：
第一个问题：如何一次性创建多个对象。
1 <!DOCTYPE html>
2 <html lang="en">
3 <meta charset = "UTF-8">
4 <title>这是网页</title>
5 <head>
6 <script>
7 function createObject(name,age) {
8 var obj = new Object();
9 obj.name = name;
10 obj.age = age;
11 obj.sayHi = function () {
12 console.log("Hello My Name is : "+ obj.name+" 我今年： "+this.age+" 岁");
13 };
14 return obj;
15 }
16 var person = createObject("tom",18);
17 person.sayHi();
18
19 var dog = createObject("wangcai",10);
20 dog.sayHi();
21
22
23
24 </script>
25 </head>
26 <body>
27
28 </body>
29 </html>
利用函数封装，达到快速创建多个对象
其实这就是工厂模式创建对象。
下面是第二个问题：
如何分辨出对象到底是什么类型。
主要是通过自定义构造函数，
首先知道Object() 是系统的构造函数，所以，对于如何创建自定义的构造函数，可以参考系统的。
Object()函数的定义方式，我们可以查到：
它的构造函数和函数很类似
函数和构造函数的区别：
看首字母是否是大写，大写的是构造函数，小写的是正常的函数。
注：构造函数也可以当普通函数使用。但是尽量要用大写表示类。
完整的类（自定义的构造函数）如下：
1 <!DOCTYPE html>
2 <html lang="en">
3 <meta charset = "UTF-8">
4 <title>这是网页</title>
5 <head>
6 <script>
7 function Person(name, age) { //Person是个自定义的类 。类似于系统的 Object
8 this.name = name;
9 this.age = age;
10 this.sayHi = function () {
11 console.log("Hello World, My Name : "+this.name + "! My Age: "+this.age);
12 }
13 }
14 var person = new Person("egon",18);
15 person.sayHi();
16 </script>
17 </head>
18 <body>
19
20 </body>
21 </html>
1 <!DOCTYPE html>
2 <html lang="en">
3 <meta charset = "UTF-8">
4 <title>这是网页</title>
5 <head>
6 <script>
7 function Person(name, age) { //Person是个自定义的类 。类似于系统的 Object
8 this.name = name;
9 this.age = age;
10 this.sayHi = function () {
11 console.log("Hello World, My Name : "+this.name + "! My Age: "+this.age);
12 }
13 }
14 var person = new Person("egon",18);
15 person.sayHi();
16
17 console.log(person instanceof Person); //true
18 console.log(person instanceof Object); //true
19 function Dog() {}
20 console.log(person instanceof Dog); //false
21 </script>
22 </head>
23 <body>
24 </body>
25 </html>
instanceof 的使用
========================================================
自定义对象做了四件事（即var obj = new Person() 系统一共 做了四件事 ） ：
第三种：字面量的方式创建对象：
它等同于：
1 <!DOCTYPE html>
2 <html lang="en">
3 <meta charset = "UTF-8">
4 <title>这是网页标题</title>
5 <head>
6 <script>
7 var person = {
8 name :"egon",
9 age :18,
10 sayHi:function () {
11 console.log("Hello World, "+this.name+" I am My age is : "+this.age); //都是不能直接用 name ,age
12 }
13 };
14 person.sayHi();
15 </script>
16 </head>
17 <body>
18 </body>
19 </html>
#############################################
字面量创建对象的缺陷：
最后一个
js是一门动态类型的语言：
1，代码（变量）只有执行到相应位置才知道具体是什么类型。
2，对象，只要是通过.点了什么就增加了相应的对象 或方法。
==============================================
除了点之外，使用另一种访问属性的方式（中扩号的方式）：
1 <!DOCTYPE html>
2 <html lang="en">
3 <meta charset = "UTF-8">
4 <title>这是网页标题</title>
5 <head>
6 <script>
7 function Person(name, age) {
8 this.name = name ;
9 this.age = age;
10 }
11 var person =new Person("egon",18);
12 person.sex = "男";
13 person.sayHi = function () {
14 console.log(this.name + this.age+this.sex);
15 };
16 // console.log(person.name);
17 // console.log(person.age);
18 // person.sayHi();
19
20 // 不仅仅可以 用点点方式来访问属性
21 //也可以用下面的中括号的方式来访问属性
22 console.log(person["name"]);
23 console.log(person["age"]);
24 person["sayHi"]();
25 </script>
26 </head>
27 <body>
28 </body>
29 </html>
JSON 格式的数据及遍历：
JavaScript Object Notation（标记）
json也是个对象，
但是，没有赋值，所以是underfined .
遍历json格式的数据：
主要是通过for in 循环：
for in 循环可以用于，不知道Json 种具体的索引的时候遍历数据。
1 <!DOCTYPE html>
2 <html lang="en">
3 <meta charset = "UTF-8">
4 <title>这是网页标题</title>
5 <head>
6 <script>
7 var json={
8 "name":"egon",
9 "age":18,
10 "sex":true
11 };
12 //遍历json 的数据
13 for (var key in json){
14 console.log(key); //注意，key此时是个变量，不是json 对象的属性，
15 // console.log(json.key); //如果直接 console.log(json.key) 的话，相当于新增属性(新增变量key)，但是没有赋值，会输underfined
16 //应该如下方式：
17 // console.log(json[key]); //这样才是输出相应的数据。
18 }
19 //补充：
20 //上面的新增属性
21 // console.log(json.key);
22 //因为json.key = "aaaa" 就相当于新增到对象种 “name” = "aaaa" 这个 所以，如果直接 json.key 会输出underfined.
23 </script>
24 </head>
25 <body>
26 </body>
27 </html>
简单类型和复杂类型：
值类型和引用类型传递：
内置对象：
常见的内置对象：
作业：MDN 查
原文地址：https://www.cnblogs.com/zach0812/p/11518003.html
时间： 2024-11-10 08:14:17