JavaScript 权威指南-学习笔记(一)

JavaScript 权威指南-学习笔记

  • JavaScript是一门高级、动态、解释型变成语言,非常适合面向对象和函数式编程风格。
  • JavaScript的变量是无类型的。
  • JavaScript和Java除了表面语法大致相似,它与Java是完全不同的两门变成语言。
Hello World
Node:交互式模式输出Hello World
node console.log("Hello World")

JavaScript 权威指南-学习笔记(一)
文章图片

Node:非交互式环境输出Hello World 1.新建hello.js文件
2.文件写入:console.log("Hello World")
3.使用node 执行hello.js文件
JavaScript 权威指南-学习笔记(一)
文章图片

浏览器JavaScript控制台输出 1.新建hello.js文件并写入:console.log("Hello World")
2.新建hello.html并写入:
3.在浏览器打开hello.html:file:///F:/javascript/%E7%BB%83%E4%B9%A0DEMO/hello.html
JavaScript 权威指南-学习笔记(一)
文章图片

F12打开开发者工具窗口,就可以在控制台看到输出信息。
声明-关键词
  • const:声明常量(不可被修改,重新赋值会抛出TypeError)
  • let:声明变量(在同一作用域中重新声明相同变量会导致语法错误)推荐使用此方法声明变量
  • var:声明变量(使用var声明的变量作用域为包含函数,而非包含块,这可能会导致隐含的错误,推荐使用let)
  • funtion:定义函数
  • class:定义类
对象
创建对象
  • 直接创建对象
    let empty = {}; //没有属性的对象 let point = {x:0, y:0}; //包含两个属性的对象

  • 使用new创建对象
    let a = new Object(); //创建一个空对象,与{}相同 let b = new Array(); //创建一个空数组,与[]相同 let c = new Date(); //创建一个表示当前时间的日期对象 let d = new Map(); //创建一个映射对象,用于存储键值对

  • 使用Object.create()创建对象
    Object.create()用于创建一个新对象,使用其第一个参数作为新对象的原型:
    let a = object.create({x: 1, y: 2}); // a继承属性x和y a.x + a.y// =>3

读取对象属性 要获取一个对象的值,可以使用(.)或([])操作符
let point = {x:0, y:0}; //包含两个属性的对象 let a = point.x// 获取point的x属性值 let b = point["y"]// 获取point的y属性值

写入对象属性 要创建或设置属性,与查询属性一样,可以使用(.)或([]),只是要把他们放到赋值表达式的左边
let point = {x:0, y:0}; //包含两个属性的对象 point.a = 0; point["b"] = 0;

删除对象属性
  • delete操作符用于从对象中移除属性
  • delete并不操作属性的值,而是操作属性本身
  • delete操作符只删除自身属性,不删除继承属性
JavaScript 权威指南-学习笔记(一)
文章图片

检查对象属性
  • in
    let o = {x: 1}; "x" in o // =>true: o有自身属性"x" "y" in o // =>false: o没有属性"y" "toString" in o // =>true: o继承了toString的属性

  • hasOwnProperty().
    对象hasOwnProperty()方法用于测试对象是否有给定名字的属性,对继承的属性返回false
    let o = {x: 1}; o.hasOwnProperty("x"); // =>true: o有自身属性"x" o.hasOwnProperty("y") // =>false: o没有属性"y" o.hasOwnProperty("toString") // =>false: toString是继承属性

  • object.assign():从一个对象向另一个对象复制属性
数组
创建数组
  • 直接创建
    let empty = []; // 没有元素的数组 let primes = [1, 2, 3, 4, 5]; // 有5个数值元素的数组 let misc = [1.1, true, "a",]; // 3种不同类型的元素,最后还有一个逗号

  • Array()创建数组
    • 不传参调用
      let a = new Array(); // 创建一个空数组

    • 创建一个数组,并指定长度
      let a = new Array(10); // 创建一个指定长度的数组

    • 创建两个或更多个数组元素,或传入一个非数值元素
      let a = new Array(5, 4, 3, 2,1, "testing, testing"); // 创建一个指定长度的数组

  • Array.of()创建一个带元素的数组
    Array.of()// =>[]; 返回没有参数的空数组 Array.of(10)// =>[10]; 创建只有一个数值元素的数组 Array.of(1,2,3)// =>[1,2,3];

  • Array.from()通过字符串创建一个数组
    var myArr = Array.from("RUNOOB"); // =>[ 'R', 'U', 'N', 'O', 'O', 'B' ]

读写数组
  • 使用 [] 操作符访问数组元素
    let a = ["world"]; // 先创建包含一个元素的数组 let value = https://www.it610.com/article/a[0]; // 读取元素0 a[1] = 3.14; // 写入元素1

    超出索引会返回undefined,不会报错
添加和删除数组元素
  • 数组添加元素
    let a = []; //创建一个空数组 a[0] = "zero"; //添加一个元素 a.push("one"); //在末尾添加一个值

flat()和flatMap()打平数组
  • flat()打平一级嵌套
    [1, [2, 3]].flat()//=>[1, 2, 3] [1, [2, [3]]]].flat()//=>[1, 2, [3]]

  • flat() 传参打平多层级嵌套
    let a = [1,[2,[3,4]]]; a.flat(1) //=> [1,2,[3,4]] a.flat(2) //=> [1,2,3,4]

数组转换为字符串
  • join()
    let a = [1, 2, 3]; a.join() //=>"1,2,3" a.join(" ") //=>"1 2 3" a.join("") //=>"123" let b = new Array(10); //长度为10但没有元素的数组 b.join("-") //=>"---------":包含9个连字符的字符串

  • toString()
    [1,2,3].toString() //=>"1,2,3" ["a", "b", "c"].toString() //=>"a,b,c" [1, [2, "c"]].toString() //=>"1,2,c"

【JavaScript 权威指南-学习笔记(一)】如果想把数组的文本内容保存起来以备后用,可以使用JSON.stringify()
数组迭代
1.数组循环var officers = [s{ id: 20, name: 'Captain' },{ id: 24, name: 'General' },{ id: 56, name: 'Admiral' },{ id: 88, name: 'Commander' }]; 2.for循环,使用率最高,也是最基本的一种遍历方式var officersIds = []; for(var i=0,len=officers.length; i d.textContent); console.log("div text:", text); // Old, ES5 way to get array from argumentsfunction() {var args = [].slice.call(arguments); //...} // Using ES6 Array.fromfunction() {var args = Array.from(arguments); //..}var filled = Array.from([1,,2,,3], (n) => n || 0); console.log("filled:", filled); // => [1,0,2,0,3]

本文仅供学习交流使用,如侵立删!

    推荐阅读