javascript 忍者秘籍读书笔记(二)
闭包的私有变量
function Ninja() {
let feints = 0;
this.getFeints = function () {
return feints
};
this.feint = function () {
feints++;
return feints
}
}
let ninja1 = new Ninja();
每一个通过ninja1 构造函数创建的对象实例可以获得各自的实例方法,但是私有变量不允许直接访问,为什么要保持私有变量的引用?,因为这些私有变量并不是对象的私有属性,但是通过构造函数所创建的对象方法去访问这些变量
* 通过函数访问私有变量,而不是通过对象访问
生成器
function* weaponGenerator() {
yield 1;
yield 2;
yield 3;
}
let a = weaponGenerator();
//for (const arrayElement of a) {
// console.log(arrayElement);
//}
console.log(a.next());
// { value: 1, done: false }
while (!a.next().done) {
console.log(a.next().value);
}
使用yield 操作付将执行全交给另一个生成器
function* weaponGenerator() {
yield 1;
yield* Ninja();
yield 3;
}
function* Ninja() {
yield 4;
yield 5;
yield 6;
}
let a=weaponGenerator();
console.log(a.next()); //{ value: 1, done: false }
console.log(a.next());//{ value: 4, done: false }
console.log(a.next());//{ value: 5, done: false }
promise
const ninja=new Promise((res,rej)=>{
res("成功");
rej("失败")
});
ninja.then(res=>{
console.log(res);
}).catch(rej=>{
console.log(rej);
})
原型
函数(Function)才有prototype属性,对象(除Object) 拥有__proto__
函数与函数之间的继承
原型继承
function Person(){}
Person.prototype.dance = function () {};
function Ninja(){}
Ninja.prototype = new Person();
const a = new Ninja();
继承
ES5继承
function Person(){}
Person.prototype.dance=function(){};
function Ninja(){}
Ninja.prototype=new Person();
Object.defineProperty(Ninja.prototype,"constructor",{
enumerable:false,
value:Ninja,
writable:true
});
ES6继承
class Person{
constructor(name) {
this.name=name
}
dance(){
return true;
}
}
class Ninja extends Person{ //关键字 extends 实现继承
constructor(name,weapon){
super(name);
this.weapon=weapon;
}
}
原型对象
只要创建一个新函数,然后给该函数创建一个prototype属性,这个属性指向函数的原型对象
function Person{}
person.prototype.name="Nicholas"
var person1=new Person();
对象的访问
在函数中 getter与setter控制属性访问
function Ninja(){
let skillLevel;
//getter方法控制对私有变量的访问
this.getSkill=()=>skillLevel;
// getter 方法控制对私有变量的复制
this.setSkill=value=>skillLevel=value;
}
let a=new Ninja();
a.setSkill('xiaoming');
console.log(a.getSkill());
在对象字面量中定义 getter 和setter
const a = {
arr: ['yosi', 'xiao', 'hattori'],
get firstGet() {
return this.arr[0]
},
set firstSet(value) {
return this.arr[0] = value
}
};
a.firstSet='lisi';// set 应该是赋值表达式的右边部分
console.log(a.firstGet);
ES6的class使用getter和seter
class Ninja{
constructor(){
this.arr = ['a', 'b', 'c'];
}
get firstNinja(){
return this.arr[0]
}
set firstNinja(value){
this.arr[0]=value
}
}
let a = new Ninja();
a.firstNinja='d';
console.log(a.firstNinja);
Object.defineProperty定义getter和setter方法
function Ninja(){
let a=0;
Object.defineProperty(this,'a',{
get(){
return a
},
set(value){
a=value
}
})
}
let nin = new Ninja();
nin.a=2;
console.log(nin.a);
使用getter与setter校验属性值
function Ninja(){
let a=0;
Object.defineProperty(this,'a',{
get(){
return a
},
set(value){
if (!Number.isInteger(value)) {
throw new TypeError('不是整数')
}
a=value
}
})
}
const p = new Ninja();
p.a='s';//报错
console.log(p.a);
使用getter与setter定义计算属性值
const a={
name:'xiaoming',
age:12,
get getAll(){
return this.name+'---'+this.age
},
set setAll(value){
const segments = value.split('');
this.name=segments[0];
this.age = segments[1];
}
};
a.setAll = 'ab';
console.log(a.getAll); // a---b
console.log(a.name); //a
console.log(a.age); //b
Proxy
Proxy 对象对于定义基本操作的自定义行为
语法
let p=new Proxy(target,handler);
参数
target 目标对象
handler 一个对象,其属性是执行操作的行为函数
给不存在属性名,返回数为37
let handler={
get(target,name){
return name in target?target[name]:37;
}
};
let p = new Proxy({}, handler);
p.a=1;
p.b=2;
console.log(p.c);//37
---------
const a = {name: 'lisi'};
const rep = new Proxy(a, {
get(target, key) {
return key in target ? target[key] : '报错啦';
},
set(target, key, value) {
return target[key] = value
}
});
rep.s=1;
console.log(rep.l);//报错了
----------
function Ninja() {
let a = 0;
Object.defineProperty(this,'a',{
get(){
return a
},
set(value){
a=value
}
})
}
const nin = new Ninja();
nin.a=2;
console.log(nin.a);
-------
function makeLoggable(target){
return new Proxy(target,{
get(target,key){
return target[key]
},
set(target,key,value){
target[key]=value
}
})
}
let ninja={name: 'xiaoming'};
let a = makeLoggable(ninja);
a.sex = '男';
console.log(a);
------
function Folder() {
return new Proxy({}, {
get(target, key) {
if (!(key in target)) {
target[key] = new Folder();
}//如果对象不具有该属性,则创建该属性
return target[key]
}
})
}
const rootFolder = new Folder();
try {
rootFolder.name.sss.ggg.ddd = 'xxx';//不会报错
} catch (e) {
fail('报错!')
}
使用代理实现数组负索引
const ninjas = ['a', 'b', 'c'];
console.log(ninjas[-2]);//js不支持数组负索引
console.log(ninjas.slice(-1));
function createArray(array) {
if (!Array.isArray(array)) {
throw new TypeError('不是数组,报错')
}
return new Proxy(array,{
get(target,key){
key=+key;
return target[key < 0 ? target.length + key : key];
},
set(target, key, value) {
key=+key;
return target[key<0?target.length+key:key]=value
}
})
}
const arr = ['a', 'b', 'c', 'd'];
const proxyArr = createArray(arr);
console.log(proxyArr[-2]);
创建数组
创建数组有两种方式
内置Array构造函数
const arr=[1,2,3,4]
使用数组字面量
const sum=new Array('a','b','c')
push pop 比 shift,unshift 快
模块化
# 使用对象,闭包和立即执行函数实现模块
ES6模块
export const ninja='xiaoming' 导出
export default xxxx 默认导出
export {name as xxx} 别名导出
import {name,age} from 'xxx' 导入命令导出
import * as xxx from 'xxx' 导入模块中声明的全部内容
###############...............................................................................................................................................................................................................................................................................
javascript 忍者秘籍读书笔记(二)的更多相关文章
- javascript 忍者秘籍读书笔记
书名 "学徒"=>"忍者" 性能分析 console.time('sss') console.timeEnd('sss') 函数 函数是第一类对象 通过字 ...
- 《JavaScript 高级程序设计》读书笔记二 使用JavaScript
一 <script>元素 a.四个属性: async:立即异步加载外部脚本: defer:延迟到文档完全被解析再加载外部脚本: src:外部脚本路径: type:脚本语言的内容类型: ...
- JavaScript DOM编程艺术读书笔记(二)
第五章 最佳实践 平稳退化(graceful degradation):如果正确使用了JavaScript脚本,可以让访问者在他们的浏览器不支持JavaScript的情况下仍能顺利地浏览你网站.虽然某 ...
- JavaScript DOM 高级程序设计读书笔记二
响应用户操作和事件 事件就是操作检测与脚本执行的组合,或者基于检测到的操作类型在某个对象上调用事件侦听器(事件处理程序). 事件的类型 事件可以分为几种类型:对象事件,鼠标事件,键盘事件(只适用于do ...
- 《javascript权威指南》读书笔记——第二篇
<javascript权威指南>读书笔记——第二篇 金刚 javascript js javascript权威指南 今天是今年的196天,分享今天的读书笔记. 第2章 词法结构 2.1 字 ...
- 《javascript权威指南》读书笔记——第一篇
<javascript权威指南>读书笔记——第一篇 金刚 javascript js javascript权威指南 由于最近想系统学习下javascript,所以开始在kindle上看这本 ...
- 【记】《.net之美》之读书笔记(二) C#中的泛型
前言 上一篇读书笔记,很多小伙伴说这本书很不错,所以趁着国庆假期,继续我的读书之旅,来跟随书中作者一起温习并掌握第二章的内容吧. 一.理解泛型 1.为什么要使用泛型?-----通过使用泛型,可以极大地 ...
- 《JavaScript高级程序设计》读书笔记--前言
起因 web编程过程使用javascript时感觉很吃力,效率很低.根本原因在于对javascript整个知识体系不熟,看来需要找些书脑补一下,同时欢迎众网友监督. 大神推荐书籍 看了博客大神们推荐的 ...
- 《你必须知道的.NET》读书笔记二:小OO有大原则
此篇已收录至<你必须知道的.Net>读书笔记目录贴,点击访问该目录可以获取更多内容. 一.单一职责原则 (1)核心思想:一个类最好只做一件事,只有一个引起它变化的原因 (2)常用模式:Fa ...
随机推荐
- json方式的面向对象、拖拽
//json方式的面向对象 var obj= { a:, b:, c:function(){ alert( } } obj.c();//12 //命名空间 var miaov={}; miaov.co ...
- NIO的整体认识
目录 1.Java NIO简介 2.java NIO和IO的主要区别 3.缓冲区buffer和通道channel 3.1.缓冲区buffer 3.2.channel 4.文件通道fileChannel ...
- nginx日志设置
环境:nginx1.16.1 (1)日志类型:access_log(访问日志) error_log(错误日志)rewrite_log 访问日志:通过访问日志我们可以得到用户的IP地址.浏览器的信息,请 ...
- PCA 在手写数字数据集上的应用
在 skilearn 的手写数据集中,每个数据点都是 0 到 9 之间手写数字的一张 8*8 灰度图像.用 PCA 将其降维到二维,并可视化数据点,如下: 1.digits 数据演示: from sk ...
- 利用多线程使socket服务端可以与多个客户端同时通讯
利用多线程使socket服务端可以与多个客户端同时通讯 server import socket 1. 符合TCP协议的手机 server = socket.socket(socket.AF_INET ...
- 使用adb 命令(atrace)抓起systrace的方法。
adb shell atrace -c -b --async_start -z gfx 1. 执行查看adb shell atrace 功能 atrace --h atrace: invalid op ...
- contact form 7如何搭配Akismet过滤垃圾邮件
contact form 7有很多站长在用,但是经常会有一些垃圾邮件进来,如何过滤呢?两个方法:1.表单提交启用验证码功能,很多垃圾邮件是用软件扫相应的端口,然后批量群发,如果用验证码了可以过滤很大一 ...
- wordpress列表页如果文章没有缩略图就显示默认图片
有时我们在设计wordpress模板时需要考虑是否有特色图,在分类页上如果一些文章有缩略图一些没有那就有点参差不齐不美观,有没办法设置如果没有文章缩略图则自动显示默认图呢?可以的,随ytkah一起来看 ...
- CentOS7 开放端口 通过 firewall-cmd 工具来操作防火墙
CentOS7 提供了 firewall-cmd 工具来操作防火墙. firewall-cmd --permanent:表示设置为持久,配置被写入配置文件,跨重启,不会立即生效,重新加载配置后生效.不 ...
- postfix发邮件失败,日志和postqueue -p提示Connection refused
1. postfix服务未启动 2. /etc/postfix/main.cf文件中未设置inet_interfaces = all