JavaScript学习

100 阅读4分钟

快速入门(和css类似)

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>快速入门</title>

    <!--  内部引用  -->
    <script>
        alert("hello,JavaScript!");
    </script>

    <!--  外部引用  -->
    <script src="../JS文件/简单的入门.js"></script>

</head>
<body>

</body>
</html>

不一样的数据结构


alert("不一样的数据类型");

//定义变量 无论是什么类型  都用 var

//= 赋值
    var a = 4;

//== 比较(类型不一样,值一样的时候,也会返回true  如 1=="1"  )

    a=="4";//ture

// === 绝对等于(类型一样,值一样的时候,才会返回true)

    a==="4";//false

//新建一个数组,数组内的元素的数据类型可以不一样
    var a1=["sad",'sd',123,null];

//新建一个对象,对象后面用大括号,属性之间用逗号隔开,最后一个不用加逗号

    var student = {
        name: "s1",
        age: 3,
        id: ["ss","asda",'112',null,125]
    }

//浮点数,和java一样,也存在精度问题。f1===f2 返回结果:false

    var f1 = 1/3;
    var f2 = 1-2/3;

//解决方法 Math.abs解决 --> Math.abs(f1-f2)<0.00000000001 返回true

严格检查模式

// 注意:这句话必须放在第一行
'use strict';//加上这句话 ,第六行代码就会报错 这就是 严格检查模式

 alert("严格检查模式");

// i = 1;不会报错,此时的 i 是全局变量,代码量变多的时候,其他地方用到 i,会引起错误

var m = 1 ;// m 是局部变量,正确。但是建议用 let关键字 即   let m = 1;

对象

'use strict'

/*
声明一个对象,结构:
var 对象名 = {
    属性名:属性值,
    属性名:属性值,
    属性名:属性值
}
*/

//定义一个person对象,它有四个属性
var person = {
    name: "xiaohong",
    age: 20,
    score:60
}

//修改属性值 给对象赋值
person.name = "xiaolan";
console.log(person.name);//"xiaolan"

//输入一个不存在的属性,不会报错,会返回undefined。
console.log(person.id);//undefined

//动态删减属性,通过delete删除对象的属性
delete person.score;//true
console.log(person);//{name: "xiaolan", age: 20}

//动态添加,直接给新属性添加值。
person.email = "sdadsad";
console.log(person.email);//"sdadsad"

//判断属性值是否在这个对象中! xxx in xxx
console.log('score' in person);//false
console.log('name' in person);//true
console.log('toString' in person);//true  继承object,object中有toString,所以是true

//判断一个属性是否是这个对象自身拥有的   hhasOwnProperty()
console.log(person.hasOwnProperty('age'));//true

标准对象

标准对象
typeof 123  -->number
typeof '123' -->string
typeof true -->true
typeof NaN -->number
typeof [] -->object
typeof {} -->object
typeof null -->object
typeof Math.abs -->function
typeof undefined -->undefined

数组

'use strict'

let s = [1,2,3,"a","b","c"];

//截取数组的一部分
s.slice(1,3);
console.log(s);

//push(),pop()压入和弹出尾部元素
s.push(["w",123]);
s.pop();

//unshift(),shift()压入和弹出头部元素
s.unshift("unshift");
s.unshift("shift");
s.shift();

字符串

'use strict'
//多行字符串编写 `` tab键上面,esc键下面
let msg = `hello
good
nice
你好啊
`;
console.log(msg);

//模板字符串  用${}连接
let name = "s1";
let age =20;
msg = `hello,${name}+{age}`
console.log(msg);//hello,s1+{age}

// \转义字符
let str = '\u4e22';//unicode
let s = '\x42';//ASCII

console.log(str);//丢
console.log(s);//B

//Java中字符串的方法在JS也同样适用。

不一样的for循环

'use strict'

//forEach
var nums = [1,2,3,4,5,6,8,7,9];
nums.forEach(function (value) {
    console.log(value);
})
console.log("=========================");
// for...in
for(var i in nums){
    console.log(nums[i]);
}

iterator遍历

'use strict'

//使用iterator遍历

//遍历map
var map = new Map([['tom',19],['honey',20],['marry',18],['jane',22]]);
for (let i of map) {
    console.log(i);
}

//遍历set
var set = new Set([10,10,10,20,50,60,70,80,90]);
for (let i of set) {
    console.log(i);
}

Map和Set

'use strict'
// ES6新特性 Map
//学生的姓名,学生的年龄
// var names=['tom','honey','marry','jane'];
// var age=[19,20,18,22];

var map = new Map([['tom',19],['honey',20],['marry',18],['jane',22]]);
var age = map.get('tom');//通过key获得value
console.log(age);//

map.set('admin',123456);

console.log(map);//Map(5) {"tom" => 19, "honey" => 20, "marry" => 18, "jane" => 22, "admin" => 123456}

//ES6新特性 Set
//Set 无序不重复的集合

var set = new Set([10,10,10,20,50,60,70,80,90]);
console.log(set);//{10, 20, 50, 60, 70,80,90}

set.add(22);//添加一个新元素
console.log(set);//{10, 20, 50, 60, 70,80,90,22}

set.delete(10);//删除与括号内相同的元素
console.log(set);//{20, 50, 60, 70,80,90}

//set集合是否包含某个属性值
console.log(set.has(20));//true

Date

'use strict'

var now = new Date();
now.getFullYear();
now.getMonth();//  0~11
now.getDate();
now.getDay();//星期几
now.getHours();
now.getMinutes();
now.getSeconds();
now.getTime();//时间戳

JSON

在JavaScript中,一切皆为对象,任何的js支持的类型,JSON都支持

格式:

  • 对象都用{}
  • 数组都用[]
  • 所以的键值对都用 key:value 对象和json字符串的转化:
'use strict'
var user ={
    name: "xiaohong",
    age: 3,
    sex: '男'
}

//对象转换为json字符串
var jsonuser = JSON.stringify(user);

//将json字符串转换为对象, 参数为json字符串

var obj = JSON.parse('{"name":"xiaolan","id":"3186016002"}');

/*
输出结果:
console.log(user)
VM77:1 {name: "xiaohong", age: 3, sex: "男"}age: 3name: "xiaohong"sex: "男"__proto__: Object
undefined
console.log(jsonuser)
VM112:1 {"name":"xiaohong","age":3,"sex":"男"}
undefined
console.log(obj)
VM161:1 {name: "xiaolan", id: "3186016002"}id: "3186016002"name: "xiaolan"__proto__: Object
undefined
*/

函数

'use strict'

//方式一
function abs(x){
    if (typeof x!= 'number'){
        throw 'Not a number!';
    }
    if (x>=0){
        return x;
    }else{
        return -x;
    }
}

//方式二
var abs = function (x) {
    if (typeof x!= 'number'){
        throw 'Not a number!';
    }
    if (x>=0){
        return x;
    }else{
        return -x;
    }
}

//方式一和方式二的调用方式一样 : abs(参数)
//参数如果为空   则返回NaN  --> 解决方法:手动抛出异常

/*
    if (typeof x!= 'number'){
        throw 'Not a number!';
    }
 */

//arguments:快可以用来遍历所有的传入的参数
var aaa = function (x) {
    console.log("x==>"+x);
    for (let i = 0;i < arguments.length;i++){
        console.log(arguments[i]);
    }
}

//rest: 获得所有除了已经定义了的参数的参数
var bbb = function (a,b,...rest) {
    console.log("a==>"+a);
    console.log("b==>"+b);
    console.log(rest);
}

变量的作用域

  1. 在javascript中,var定义变量实际是有作用域的。
  2. 假设在函数体中声明,则在函数体外不可以使用(闭包)
var f1 = function () {
    var x = 1;
    x = x+1;
    console.log(x);//2
}
x = x+2;
console.log(x);//Uncaught ReferenceError: x is not defined
  1. 如果两个函数使用了相同的变量名,只要在函数内部就不冲突。
var f1 = function () {
    var x = 1;
    console.log(x);//1
}
var f2 =function() {
    var x = 3;
    console.log(x);//3
}
  1. 内部函数可以访问外部函数的成员,反之则不行
var f1 = function () {
    var x = 1;
    var f2 =function() {
        var y = x + 1;
        console.log(y);//2
    }
    var z = y + 1;       	    console.log(z);//UncaughtReferenceError: y is not defined
}
  1. 假设,内部函数变量和外部函数变量重名.
var f1 = function () {
    var x = 1;
    var f2 = function (){
        var x = 2;
        console.log("inner"+x);//inner2 
    }
    console.log("outer"+x);//outer1
    f2();
}
f1();

在JavaScript中,函数查找变量从自身函数开始~, 由“内”向“外”查找,假设外部存在这个同名的函数变量,则内部函数会屏蔽外部函数的变量。

其余零零碎碎的东西> blog.csdn.net/pan_h1995/a…