javascript 基础学习（一）

1、数据类型

数值型：number（凡是数字都是数值型，不区分整数和小数）
字符串：string（凡是引号包裹起来的内容全部都是字符串）
布尔：boolean（true、false）
对象类型：object（特殊取值null）
未定义型：undefined

2、变量

定义：就是存放数据的、内疗可以存储任意数据

声明变量：

1.	只能由字母、数字、_（下划线）、$（美元符号）组成。
2.	不能以数字开头。
3.	命名中不能出现-（js会理解成减号进行减法的操作），不能和关键字冲突。

var 变量名称 = 存储的数据;   	(variable 变量)

3、数据转换

//转数字
var a = "123"
var a1 = Number(a) // 字符串转整数
var b = "1.123"
var b1 = Number(b)// 字符串转小数
var c = true;//true ->1,false ->0
var c1 = Number(c)
//转字符串
var a = 123;
var a1 = a+""
var a1 = a.toString()
var b = true;
var b1 = b+"" // true
var c = undefined;
var c1 = String(c) //undefined
//转bool值
var a = Boolean(0)//数值类型，除了0/NaN是转为false只外,其余都是true
var b = Boolean(NaN)
var c = Boolean("")//字符串 ---> 布尔。除了空串，其余的都是true。

4、检测数据类型

typeof(value); 或者typeof value;     返回这个变量的类型. 
说明 : 同一个变量, 可以进行不同类型的数据赋值

<script type="text/javascript">
    var a;
    alert(typeof a);  // undefined
    a = 1;
    alert(typeof a); // number
    a = "string";
    alert(typeof a); // string
    a = true;
    alert(typeof a); // boolean
</script>

5、算术运算符

+	-	*	/	%	++	--

1.	由于js中的小数和整数都是number类型，不存在类似整数除以整数还是整数的结论。
2.	字符串和其他的数据使用+号运算，会连接成一个新的字符串。
3.	字符串使用除了+以外的运算符：如果字符串本身是一个数字，那么会自动转成number进行运算
，否则就会返回一个NaN的结果，表示这不是一个数字。NaN：not a number

alert(1234 / 1000 * 1000); // 1234
  
var s = "12";
s -= 10;
alert(s);  // 2
 
var s = "aa";
s -= 10;
alert(s);  // NaN       Not a Number 不是一个数字
 
var s = "12";
s += 10;
alert(s); 

6、关系（比较）运算符

>		>=		<		<=  	!=		
==	等于（只比较内容）	===	恒等于（比较内容的同时还要比较数据类型）
注意：关系运算符返回的结果只有两个：true / false

7、逻辑运算符

&&	 	与		true&&false		====>false
|| 		或		true||false			====>true
！ 		非		!true				====>false
false（理解）：false,  0,  null,  undefined 
true（理解）：true, 非0,  非null,  非undefined
 
针对 && 顺口溜: 找第一个出现的假值. (一假即假)
针对 || 顺口溜: 找第一个出现的真值. (一真即真)

8、三元运算符

条件？表达式1：表达式2
如果条件为true，返回表达式1的结果
如果条件为false，返回表达式2的结果

9、添加语句

if(条件){
    表达式
}else if(条件){
    表达式
}else{
    表达式
}

switch(常量){
    case 条件:
    case 条件:
        break;
    case 条件:
        break;
    default:
        alert("不及格!");
        break;
}

10、循环结构 while、do-while. for;

while(循环条件){循环体;}
do{循环体;}while(循环条件);
for(循环变量赋初值；循环条件；循环变量增值){循环语句;}
console.log（...）; 以日志的形式在控制台输出结果！

11、函数

function 函数名(形式参数){函数体}
调用函数：函数名(实际参数);

arguments

// 可以通过arguments获取所有的实际传递的参数
function add(){
                //arguments:可以获取所有实际传递的参数
                var sum = 0;
                console.log(arguments)
                for(var i = 0;i<arguments.length;i++){
                    sum = sum + arguments[i]
                }
                return sum
            };
            
add(1,3,3,5,6,7);

 立即执行函数

(function(a, b) {
     console.log("a = " + a);
     console.log("b = " + b);
 })(123, 456);

匿名函数是没有名字的函数

function(形式参数){函数体}
调用方式：将匿名函数赋值给一个变量，通过变量名调用函数
定义函数并赋值给变量：var fn = function(形式参数){函数体}
调用函数：fn(实际参数);

<script type="text/javascript">
    // 匿名函数 : 没有名称的函数
    var func = function(i, u) {
        alert(i + " love " + u);
    }
    // 调用函数 :
   func("柳岩", "小白");//显示柳岩love小白
</script>

 12、数组

1）创建数组

创建数组对象
方式一：字面量定义。举例：
var arr = [1,2,3];
方式二：对象定义（数组的构造函数）。
语法：
var arr = new Array(参数);

2）数组常见方法

push()：向数组的最后面插入一个或多个元素，返回结果为该数组新的长度。

pop()：删除数组中的最后一个元素，返回结果为被删除的元素。

unshift()：在数组最前面插入一个或多个元素，返回结果为该数组新的长度。插入元素后，其他元素的索引会依次调整。

shift()：删除数组中的第一个元素，返回结果为被删除的元素。

slice()：从数组中提取指定的一个或者多个元素，返回结果为新的数组（不会改变原来的数组）。

splice()：从数组中删除指定的一个或多个元素，返回结果为新的数组（会改变原来的数组）

concat()：连接两个或多个数组，返回结果为新的数组。（不会改变原数组）

join()：将数组转换为字符串，返回结果为转换后的字符串（不会改变原来的数组）。

reverse()：反转数组，返回结果为反转后的数组（会改变原来的数组）。

sort()：对数组的元素进行从小到大来排序（会改变原来的数组）。

3）数组遍历

// 数组的遍历
// 遍历数组即：获取并操作数组中的每一个元素。在我们的实战开发中，使用得非常频繁。
// 遍历数组的方法包括：every()、filter()、forEach()、map()、some()
			
// for循环 遍历
var arr = ["生命壹号","许嵩","永不止步"];
for(var i = 0;i<arr.length;i++){
    console.log(arr[i]);  // arr[i]代表的是数组中的每一个元素i
}
console.log(arr);
			
// forEach()方法需要一个函数作为参数。这种函数，是由我们创建但是不由我们调用的，我们称为回调函数。
// 数组中有几个元素，该回调函数就会执行几次。执行完毕后，浏览器会将遍历到的元素。
// 回调函数中传递三个参数：
// 第一个参数，就是当前正在遍历的元素
// 第二个参数，就是当前正在遍历的元素的索引
// 第三个参数，就是正在遍历的数组
var arr = ["王一", "王二", "王三"];
arr.forEach(function(item, index, obj) {
console.log("item:" + item);
console.log("index:" + index);
console.log("obj:" + obj);
console.log("----------");
});
// 打印结果：
// item:王一
// index:0
// obj:王一,王二,王三
// ----------
// ​
// item:王二
// index:1
// obj:王一,王二,王三
// ----------
// ​
// item:王三
// index:2
// obj:王一,王二,王三
// ----------
			
// map()方法
// 解释：对数组中每一项运行回调函数，返回该函数的结果，组成的新数组（返回的是加工之后的新数组）
var arr1 = [1, 3, 6, 2, 5, 6];
var arr2 = arr1.map(function (item, index) {
    return item + 10;  //让arr1中的每个元素加10
})
console.log(arr2);//[11,13,16,12,15,16]
const arr1 = [
    { name: '千古壹号', age: '28' }, { name: '许嵩', age: '32' }
];
const arr2 = arr1.map(item => item.name); // 将数组 arr1 中的 name 属性，存储到 数组 arr2 中
console.log('arr1:' + JSON.stringify(arr1));//arr1:[{"name":"千古壹号","age":"28"},{"name":"许嵩","age":"32"}]
console.log('arr2:' + JSON.stringify(arr2));//arr2:["千古壹号","许嵩"]
			
// filter()
// 解释：对数组中每一项运行回调函数，该函数返回结果是true的项，将组成新的数组（返回值就是这个新的数组）。
var arr1 = [1, 3, 6, 2, 5, 6];
var arr2 = arr1.filter(function(item, index) {
    return item > 4; //将arr1中大于4的元素返回，组成新的数组
});
console.log(JSON.stringify(arr2));// [6,5,6]
const arr1 = [
    { name: '许嵩', type: '一线' },
    { name: '周杰伦', type: '过气' },
    { name: '邓紫棋', type: '一线' },
];
const arr2 = arr1.filter(item => item.type == '一线'); // 筛选出一线歌手
console.log(JSON.stringify(arr2));//  [{"name":"许嵩","type":"一线"},{"name":"邓紫棋","type":"一线"}]
			
// every()：对数组中每一项运行回调函数，如果都返回true，every就返回true；如果有一项返回false，则停止遍历，此方法返回fals
var arr1 = ["千古", "宿敌", "南山忆", "素颜"];
var bool1 = arr1.every(function (element, index, array) {
    if (element.length > 2) {
        return false;
    }
    return true;
});
console.log(bool1);  //输出结果：false。只要有一个元素的长度是超过两个字符的，就返回false
var arr2 = ["千古", "宿敌", "南山", "素颜"];
var bool2 = arr2.every(function (element, index, array) {
    if (element.length > 2) {
        return false;
    }
    return true;
});
console.log(bool2);  //输出结果：true。因为每个元素的长度都是两个字符。
			
// indexOf() 和 lastIndexOf()：获取数据的索引
var arr = ["a","b","c","d","e","d","c"];
console.log(arr.indexOf("c"));       //从前往后，找第一个"c"在哪个位置
console.log(arr.lastIndexOf("d"));   //从后往前，找第一个"d"在哪个位置
			
// find()  findIndex()
// find(function(item, index, arr){return true})
let arr = [2, 3, 2, 5, 7, 6];
let result = arr.find(function (item, index) {
    return item > 4; //遍历数组arr，一旦发现有第一个元素大于4，就把这个元素返回
});
console.log(result);  //打印结果：5
			
let arr = [2, 3, 2, 5, 7, 6];
let result = arr.findIndex(function (item, index) {
    return item > 4; //遍历数组arr，一旦发现有第一个元素大于4，就把这个元素的index返回
});
console.log(result); //打印结果：3