JavaScript 权威指南-学习笔记（一）

JavaScript 权威指南-学习笔记

• JavaScript是一门高级、动态、解释型变成语言，非常适合面向对象和函数式编程风格。
• JavaScript的变量是无类型的。
• JavaScript和Java除了表面语法大致相似，它与Java是完全不同的两门变成语言。

Hello World

Node：交互式模式输出Hello World

node
console.log("Hello World")

Node：非交互式环境输出Hello World

1.新建hello.js文件

2.文件写入：console.log("Hello World")

3.使用node 执行hello.js文件

浏览器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

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操作符只删除自身属性，不删除继承属性

检查对象属性

• 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 = 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"

如果想把数组的文本内容保存起来以备后用，可以使用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 arguments

function() {  

  var args = [].slice.call(arguments);

  //...

}

 

// Using ES6 Array.from

function() {  

  var args = Array.from(arguments);

  //..

}

var filled = Array.from([1,,2,,3], (n) => n || 0);  

console.log("filled:", filled);  

// => [1,0,2,0,3]

本文仅供学习交流使用，如侵立删！